Can't play video using QtWebEngine

[Zabarne]

Hi guys

While I'm able to watch the video in this website with using QuickNanoBrowser:
https://www.richemont.com/

I'm unable to load it with my QtWebEngine based app:

Is there any reason for that? Is there anything to enable to let the video displays?
I'm on macOS / QT6.6.0.

Help appreciated
Many thanks

[mpergand]

Hi @Zabarne,

I have the same thing, I suppose this video uses some mpg formats, QWebEngine needs to be build with Proprietary codecs enabled .
See HERE

[Zabarne]

Hi @mpergand

Thanks for your help.

If it was really a proprietary audio/video CODEC issue, why the QuickNanoBrowser app shipped with QTCreator worked?

To my knowledge, QT team doesn't provide any proprietary CODEC.
If the QuickNanoBrowser app failed to load the video, I would have agreed with you. But this isn't the case and the video was sucessfully loaded in QuickNanoBrowser (see above screenshot),

Best

[SGaist]

Hi,

Without seeing your code, nobody can guess what's going on.

The first question that comes to mind is: what are you doing differently from the Quick Nano Browser example ?

[Zabarne]

@SGaist I will prepare a little demo and share it here

[Zabarne]

Good Morning @SGaist

Here you are:

#include <QApplication>
#include <QMainWindow>
#include <QWebEngineView>

int main(int argc, char **argv)
{
    QApplication app(argc, argv);

    QMainWindow* window = new QMainWindow();
    QWebEngineView * view = new QWebEngineView(window);
    window->setCentralWidget(view);
    window->resize(1024, 768);
    window->show();

    QWebEnginePage * page = new QWebEnginePage(view);

    view->setPage(page);
    view->load(QUrl("https://www.richemont.com/"));

    return app.exec();
}

And as you can see, even with a minimalistic QtWebEngine app, the video isn't loaded:

The video is quite big ~40MiB. Is there a QtWebEngine's buffer we can tweak? Not even sure if this is related.

Help appreciated!

[Zabarne]

@SGaist Could you help me please?

[Ryan.S]

I have a custom Qt app that uses a QtWebEngine browser and it can successfully playback the video at the top of the page.

My QtWebEngine was compiled with proprietary codecs and if I had to guess, this is almost certainly the issue. I'm not knowledgeable enough to know which codecs are included when compiling with proprietary codecs or why QuickNanoBrowser would work...does QuickNanoBrowser perhaps come with an open source codec like OpenH264? According to VLC, the video is using a basic h264 codec.

The only other thing my app may have that yours might not, is using persistent cookies on the QWebEngineProfile that gets loaded with the browser. Perhaps the site requires something on the cookie-side, but that seems less likely than the codec(s).

[Zabarne]

Hi @Ryan-S

@Ryan-S said in Can't play video using QtWebEngine:

The only other thing my app may have that yours might not, is using persistent cookies on the QWebEngineProfile that gets loaded with the browser.

This is interesting. Would you mind sharing how to persist cookies with a profile?

I adapted the above code to use QWebEngineProfile like this:

#include <QApplication>
#include <QMainWindow>
#include <QWebEngineProfile>
#include <QWebEngineView>
#include <QNetworkCookie>

int main(int argc, char **argv)
{
    QApplication app(argc, argv);

    QMainWindow* window = new QMainWindow();
    QWebEngineView * view = new QWebEngineView(window);
    QWebEngineProfile * profile = new QWebEngineProfile(view);
    window->setCentralWidget(view);
    window->resize(1024, 768);
    window->show();

    QWebEnginePage * page = new QWebEnginePage(profile, view);
    view->setPage(page);
    view->load(QUrl("https://www.richemont.com/"));

    return app.exec();
}

I still doubt this is related to proprietary codecs as QuickNanoBrowser has/does nothing special (a basic app).

@Ryan-S is there a way to avoid recompiling QtWebEngine with proprietary codecs and still get the proprietary codecs working with my app?

Recompiling everything is time consuming and require QT/system knowledge. If I can avoid this and still get the codecs working, it would be great.

Many thanks for your help.

[Zabarne]

@SGaist @Ryan-S

I tried with persistent cookies, same result. Can't load this video :-(

#include <QApplication>
#include <QMainWindow>
#include <QWebEngineProfile>
#include <QWebEngineView>
#include <QNetworkCookie>
#include <QStandardPaths>

int main(int argc, char **argv)
{
    QApplication app(argc, argv);

    QMainWindow* window = new QMainWindow();
    QWebEngineView * view = new QWebEngineView(window);

    QWebEngineProfile * profile = new QWebEngineProfile(view);
    profile->setHttpCacheType(QWebEngineProfile::DiskHttpCache);
    profile->setPersistentCookiesPolicy(QWebEngineProfile::ForcePersistentCookies);
    profile->setCachePath(QStandardPaths::writableLocation(QStandardPaths::CacheLocation));
    profile->setPersistentStoragePath(QStandardPaths::writableLocation(QStandardPaths::AppLocalDataLocation));

    window->setCentralWidget(view);
    window->resize(1024, 768);
    window->show();

    QWebEnginePage * page = new QWebEnginePage(profile, view);
    view->setPage(page);
    view->load(QUrl("https://www.richemont.com/"));

    return app.exec();
}

Can someone with good QtWebEngine skills help me understand why?
Many thanks

[JonB]

@Zabarne
First things first: please try a variety of web pages with videos. Does the bad behaviour always apply or only to the particular video/site you mention?

[Zabarne]

Hi @JonB

Most websites containing videos work as expected, but this one. This is why I asked for help.

When facing issues, I usually compare my app's behavior to QuickNanoBrowser. Till now, I was able to solve them all with my little QT knowledge. But this time, the Richemont video is perfectly working on QuickNanoBrowser but not in my app.

I followed @SGaist advice and I provided a minimalistic code to consistently reproduce this behavior on macOS, Windows and Linux (see above).

Finally, to my knowledge, QuickNanoBrowser doesn't rely on any proprietary codecs, and is still capable of loading this video.

Question: what QuickNanoBrowser does (in terms of enabled/disabled config) that my minimalistic app isn't doing?

I must be missing something.

Many thanks

[mpergand]

@Zabarne
It is a mp4 video, as I said earlier, you need to build the webengine yourself and I i'm afraid there's no escape.

Trying to read this video I have an error saying my browser is not compatible and needs an update.

[JonB]

@Zabarne
I don't know whether this helps, but under Ubuntu 22.04, Qt 5.15, which is all I have, the video from that site runs fine in your sample code. The Qt build comes from Ubuntu via apt-get, and I had to go apt-get install qtwebengine5-dev to get the QtWebEngine stuff. I don't know whether Ubuntu does a special build or does "codecs" for that.

[Zabarne]

@mpergand if it was really the case, how come QuickNanoBrowser can read .mp4 videos?

[JonB]

@Zabarne
I don't know, but compared to QML example do you need to (a) handle any errors (or redirections?) and (b) handle anything to do with SSL (https)?
If you run yours, can you press a function key or something to get any diagnostics from your page, e.g. Chrome Developer mode/tools, key F12?

[Zabarne]

Thanks @JonB. Gonna give a try.

I hope no breaking changes were introduced in Qt6.x if the video was loaded with old Qt5.15.

Keep you posted.

[SGaist]

@Zabarne I tested both your code and the Quick Nano Browser example with Qt 6.6.0 on macOS and neither shows the video.

[Zabarne]

Hi guys

Now, I'm 100% convinced that this issue was caused by video codecs H264 not supported by default in QtWebEngine.

Thanks for your support.