PDF.js and QWebSecurityOrigin (Qt 5)

johnlamericain

Hi there,

I'm trying to embeed the last version of PDF.js viewer (http://mozilla.github.io/pdf.js/) in my custome application using webkit. I added the build version of PDF.js to my qrc file, and succeed to load the viewer.html.

The issue I have is when loading the pdf file which is using "file" scheme, it complains about cross origin problem:

@XMLHttpRequest cannot load file:///H:/Downloads/8R23987019162_18.pdf. Cross origin requests are only supported for HTTP.@

If I do load the PDF.js viewer.html from my file system and not from the resources (qrc), it works fine...

According to the documentation it should simply works : "By default local schemes like file:// and qrc:// are concidered to be in the same security origin, and can access each other's resources. ". It was also working on Qt4.

Here is my constructor that inherits from QWebView :

@
setRenderHint(QPainter::Antialiasing);
setRenderHint(QPainter::TextAntialiasing);
setRenderHint(QPainter::SmoothPixmapTransform);
setRenderHint(QPainter::HighQualityAntialiasing);

page()->settings()->setAttribute(QWebSettings::DeveloperExtrasEnabled,true);

page()->settings()->setAttribute(QWebSettings::AcceleratedCompositingEnabled,true);
page()->settings()->setAttribute(QWebSettings::LocalContentCanAccessRemoteUrls,true);
page()->settings()->setAttribute(QWebSettings::LocalContentCanAccessFileUrls,true);

page()->settings()->setAttribute(QWebSettings::JavascriptEnabled, true);

// Object that contains path
page()->mainFrame()->addToJavaScriptWindowObject("customPdfJsObject",m_loader,QWebFrame::QtOwnership);

page()->mainFrame()->load( QUrl("qrc:/pdf.js/web/viewer.html"));

@

What is also strange is that if I use the Open Menu inside the viewer and select the same file on disk, it open correctly.

Thanks for your help.

johnlamericain

Does someone got an idea how to use addAccessWhitelistEntry() to bypass this problem?

CharlieG

Hello John,

I have almost the same need (embed PDF.JS in a Qt app). Did you find a solution to your problem? Or someone else perhaps?

Thanks in advance.

coquetangler

Webworkers cannot be created when the content is loaded from file:// or a Qt resource file. PDF.js uses Webworkers. The solution is to run your own http server from within your application that can serve simple HTTP GET requests.

Hope that points you in the right direction.

johnlamericain

It works for me without using a webserver. Here is the constructor of my class:

PdfJsWidget::PdfJsWidget(const QUrl& res, QWidget *parent, bool isPrintable) :
    QWebView(parent)
{
    const QString path = QUrl::toPercentEncoding(res.toString());

    setRenderHint(QPainter::Antialiasing);
    setRenderHint(QPainter::TextAntialiasing);
    setRenderHint(QPainter::SmoothPixmapTransform);
    setRenderHint(QPainter::HighQualityAntialiasing);

#ifdef DSDEBUG
    page()->settings()->setAttribute(QWebSettings::DeveloperExtrasEnabled, true);
#else
    page()->settings()->setAttribute(QWebSettings::DeveloperExtrasEnabled, false);
#endif

    page()->settings()->setAttribute(QWebSettings::AcceleratedCompositingEnabled, true);
    page()->settings()->setAttribute(QWebSettings::LocalContentCanAccessRemoteUrls, true);
    page()->settings()->setAttribute(QWebSettings::LocalContentCanAccessFileUrls, true);
    page()->settings()->setAttribute(QWebSettings::JavascriptEnabled, true);

    page()->mainFrame()->load(QUrl("qrc:/pdf.js/web/viewer.html?file=" + path));

    if(isPrintable)
        dsconnect(page(), &QWebPage::printRequested, this, &PdfJsWidget::printPage);
}

You can also read the bug I opened at the time in Pdf.JS project: https://github.com/mozilla/pdf.js/issues/5057

CharlieG

Hello,

Thank you both for your answers.

In fact, in my case the purpose is to have PDF.JS in a QML app (with QtWebView), especially to have a viewer on android.

I managed to use PDF.JS on my PC with my application by stating the absolute path. The problem is ultimately not really done the same but I'll see if I can with your components advancing. And if you have an idea it will be welcome ;).

By the way if you're interested, I had already submitted this on a forum that you know well :) :
http://pyqt.developpez.com/actu/90650/Afficher-un-PDF-dans-une-application-QML-en-utilisant-la-visionneuse-par-defaut-de-pdf-js-un-billet-de-Jiyuu/
http://www.developpez.net/forums/d1542148/c-cpp/bibliotheques/qt/qt-quick/afficher-pdf-application-qml/