QtLoader is deprecated in qt6.6.0
-
Hello everyone.
I was normally using
QtLoader
function from qtloader.js.
And then callloadEmscriptenModule
.
With this, I could load several Qt applications on the same page, just setting the URL and the APP's name to loadhttps://URL/APP.js
andhttps://URL/APP.wasm
.But this API is deprecated in qt6.6.0.
Now the API is asking me about aentryFunction
that if not given takes by defaultwindow.createQtAppInstance
defined inAPP.js
file.But this function has hardcoded the name of the
APP.wasm
to be downloaded and loaded by the module.Does anyone know how to load a qt wasm application from the internet, like setting the path of
wasmBinaryFile
tohttps://URL/APP.wasm
.Or, how to load several Qt applications on the same page.
Many thanks for your time.
-
@lorn-potter Many thanks.
But that does not help.with the previous API I could do
qtLoader = QtLoader({ path: wasm_url, canvasElements : [canvas], ... }); qtLoader.loadEmscriptenModule(app_name);
So I could set the different canvases for different qt applications, and download qt applications from the web by just setting
wasm_url
andapp_name
.But now with the new API I presume(If I manage to make it work) there will be a name clash with the
window.createQtAppInstance
function.But this is more a problem of my poor javascript knowledge :) than a Qt API problem.
-
Hi! I'm having the same issue that the wasm binary is not in the same path as the html file. In Qt 5.15 I used to modify the loadEmscriptenModule line:
qtLoader.loadEmscriptenModule("/path/to/app_binary");
Could you give me a code example of how it should be done in the latest Qt? I'm not sure how to correctly modify the new
createQtAppInstance
. -
Ok, after some trial and error I managed to figure it out how to get it to work like I need. Basically, in the html file, look for the line:
entryFunction: window.createQtAppInstance,
and replace it with:
entryFunction: (config) => { config['locateFile'] = (path, scriptDirectory) => scriptDirectory + path; window.createQtAppInstance(config); },
What this does, is it restores the default behavior of app_name.js locateFile which is to load the .wasm file from the same directory as the app_name.js script file directory. Why I am saying "restores" is because the following code in qtloader.js seems to override the locateFile to ignore the second scriptDirectory argument:
config.locateFile = filename => { const originalLocatedFilename = originalLocateFile ? originalLocateFile(filename) : filename; if (originalLocatedFilename.startsWith('libQt6')) return `${config.qt.qtdir}/lib/${originalLocatedFilename}`; return originalLocatedFilename; }
Is that an intentional behavior change @lorn-potter or a bug? Note the app_name.js calls the function as:
if (Module['locateFile']) { return Module['locateFile'](path, scriptDirectory); } return scriptDirectory + path;
So it now the qtloader.js override silently discards the second scriptDirectory argument
which means while in older Qt the wasm binary was loaded from the same directory as app_name.js script, now newer Qt loads it from the directory where the html file is located.EDIT: For a completely custom directory, one could replace the
config['locateFile'] = (path, scriptDirectory) => scriptDirectory + path;
in my example with any other path. In my previous post I said I want to load the binary from "/path/to/app_binary" but for me the app_name.js was in the same directory next to the binary, so thescriptDirectory + path;
worked for me as well.EDIT2: Sorry, if I look my older html files, seems I misremembered. By default, older Qt also loaded the wasm binary from next to the html file, so I guess the current behavior is correct. It just used to be easier to change the directory.
-
If you want to fetch your wasm file from a server using the new Qt 6.6 qt loader api you can do it like this:
const wasmPromise = WebAssembly.compileStreaming(fetch(url)); const instance = await qtLoad({ qt: { onLoaded: () => { loadingScreen.style.display = "none"; }, onExit: exitData => { console.log(exitData); }, entryFunction: window.createQtAppInstance, containerElements: [mainScreen], module: wasmPromise, } });