[nks (baumemo)]

Hi,

I have a question. How can I open a downloaded pdf by the DownloadableResource Component when using WASM. I tried differend things but can’t get access to the pdf. What I’m doing wrong?

import Felgo 3.0
import QtQuick 2.0

App {
    id: app

    Page {
        DownloadableResource {
            source: "http://localhost:6931/Source.pdf"
            storageName: "DestPDF.pdf"
            extractAsPackage: false

            Component.onCompleted: {
                if(status === DownloadableResource.UnAvailable) {
                    download()
                } else {
                    openDownloadedFile()
                }
            }

            onStatusChanged: openDownloadedFile()

            function openDownloadedFile() {
                if(status === DownloadableResource.Available) {
                    // Can't open it here!!!
                    //nativeUtils.openUrl(storagePath)
                    //fileUtils.openFile(storagePath)
                    console.log(storagePath)
                }
            }
        }
    }
}

 

[Miguel Rodriguez]

Hello Sergej

 

If you are running it from the Web Live Client some browser restrictions might apply due to it being loaded using HTTPS and from the felgo.com domain, check the browser console to see if there are any CORS or mixed content errors during the request.

There’s support for an emulated file system provided by emscripten library IndexedDB File System (IDBFS), this FS is only accessible from the wasm context or the browser javascript that loaded the wasm module, not from your host OS.

 

Running a simple example from the code you provided the downloaded resource path looks something like:

file:///home/web_user/.local/share/Felgo Live Client/_packages/sample.pdf

            DownloadableResource {
                source: "https://cors-anywhere.herokuapp.com/https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf"
                storageName: "sample.pdf"
                extractAsPackage: false

                Component.onCompleted: {
                    if(status === DownloadableResource.UnAvailable) {
                        download()
                    } else {
                        openDownloadedFile()
                    }
                }

                onStatusChanged: openDownloadedFile()

                function openDownloadedFile() {
                    if(status === DownloadableResource.Available) {
                        console.log(storagePath)
                    }
                }
            }

Note: I’ve used the cors anywhere proxy to get rid of CORS errors due to missing headers from the file server.

Regards.

[nks (baumemo)]

Hi Miguel,

thank you very much for your fast and detailed answer.

There is no CORS error because I did a deployment build and hosted for testing purposes the pdf and the application on the same server.

I have not found a way how to open this pdf in my browser or if not possible download it.

I tried nativeUtils.openUrl and fileUtils.openFile. Any idea?

Thank you.

[Miguel Rodriguez]

Hello Sergej

To open your PDF file in a new tab I would advise to use the Qt.openUrlExternally method with the remote URL, not the local emulated file system. You might get a blocked popup warning on your browser but after allowing it you should be able to view your file in a new tab.

We are working on a better and direct communication from QML to the Browser Javascript so this would be supported by default using the nativeUtils.openUrl in a near future.

Regards.

[nks (baumemo)]

Hello Miguel,

again thank you very much for your answer. The reason why I’m using

DownloadableResource

is the headerParameters Feature which allows me to set the Authorization Headers (Basic + username + pw).

This is unfortunately not possible with Qt.openUrlExternally.

Any other idea?

Regards,

Sergej