webassembly does not display picture urls from web
-
Hi,
I am testing and developing a webassembly project. This week I upgrade from QT 6.4.3 to QT 6.5.1 and from emscripten 3.1.14 to 3.1.25 and also tried Emscripten 3.1.41.
The problem I encountered after updating is that only images from a weburl are no longer displayed. Compiling with QT 6.4.3 displays these images without any problems.
I created this little test QML to test and explain my problem. So embedding an image works perfectly, but from a web URL the image is not displayed.
Does anyone have an idea what is causing this. Thanks in advance.
import QtQuick Window { id: root width: Screen.width//1024 height: Screen.height//768 visible: true title: qsTr("Hello World") Image { id: pic width: 300 height: 300 anchors.centerIn: root //source: "https://www.intratuin.nl/media/Plantengids/Zonnebloem/Zonnebloem-helianthus-annuus.jpg" source: "qrc:/new/prefix1/images.jpg" } } -
@lorn-potter: Thank you for the reply.
In the application I load images from my own web server. It is true that the CORS header had to be added. I had to do this in QT6.4.3 also a while ago.About the sample source code: This is a picture from a random web server and indeed it is to be expected that they have not added this CORS header. So it might be a bad example.
However, it is still the case that when I compile an application with QT6.5.1, the images are loaded perfectly. If I build a webassembly in this version, the images won't load. In the Chrome develepor console I don't see any errors/warnings regarding this issue.
And as I noted already, in QT6.4.3 I have no problems at all.
@Jan-Bakker Problem solved in QT 6.5.2.
In the release notes I found this, but i couldn't find it reported in detail so far-> "QTBUG-111892 wasm: asynchronous image loading never ends" -
Hi,
i have observed the same. A deepter looking into whats happen (Brower debugger) shows that the image is not loaded via the network. At the moment I'm working on a solution on it.
@Joerg Hi. Thanks for your reply. Have you made any progress already? I not )-:
-
You can open the developer console and see any error messages.
I get one with that url:Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.intratuin.nl/media/Plantengids/Zonnebloem/Zonnebloem-helianthus-annuus.jpg. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 200.
see https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
If you use images on the same server, or use servers that allows Cross origin access, it will work.
-
You can open the developer console and see any error messages.
I get one with that url:Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.intratuin.nl/media/Plantengids/Zonnebloem/Zonnebloem-helianthus-annuus.jpg. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 200.
see https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
If you use images on the same server, or use servers that allows Cross origin access, it will work.
@lorn-potter: Thank you for the reply.
In the application I load images from my own web server. It is true that the CORS header had to be added. I had to do this in QT6.4.3 also a while ago.About the sample source code: This is a picture from a random web server and indeed it is to be expected that they have not added this CORS header. So it might be a bad example.
However, it is still the case that when I compile an application with QT6.5.1, the images are loaded perfectly. If I build a webassembly in this version, the images won't load. In the Chrome develepor console I don't see any errors/warnings regarding this issue.
And as I noted already, in QT6.4.3 I have no problems at all.
-
@lorn-potter: Thank you for the reply.
In the application I load images from my own web server. It is true that the CORS header had to be added. I had to do this in QT6.4.3 also a while ago.About the sample source code: This is a picture from a random web server and indeed it is to be expected that they have not added this CORS header. So it might be a bad example.
However, it is still the case that when I compile an application with QT6.5.1, the images are loaded perfectly. If I build a webassembly in this version, the images won't load. In the Chrome develepor console I don't see any errors/warnings regarding this issue.
And as I noted already, in QT6.4.3 I have no problems at all.
@Jan-Bakker Problem solved in QT 6.5.2.
In the release notes I found this, but i couldn't find it reported in detail so far-> "QTBUG-111892 wasm: asynchronous image loading never ends" -
J Jan Bakker has marked this topic as solved on
-
Hi,
I am testing and developing a webassembly project. This week I upgrade from QT 6.4.3 to QT 6.5.1 and from emscripten 3.1.14 to 3.1.25 and also tried Emscripten 3.1.41.
The problem I encountered after updating is that only images from a weburl are no longer displayed. Compiling with QT 6.4.3 displays these images without any problems.
I created this little test QML to test and explain my problem. So embedding an image works perfectly, but from a web URL the image is not displayed.
Does anyone have an idea what is causing this. Thanks in advance.
import QtQuick Window { id: root width: Screen.width//1024 height: Screen.height//768 visible: true title: qsTr("Hello World") Image { id: pic width: 300 height: 300 anchors.centerIn: root //source: "https://www.intratuin.nl/media/Plantengids/Zonnebloem/Zonnebloem-helianthus-annuus.jpg" source: "qrc:/new/prefix1/images.jpg" } }Hey, sorry for answering an answered qustion.
Justo happy to read it, so, it is possible to load external images in Your web app so your wasm file is smaller?
