I have a C++ project that uses EMSDK to compile to WebAssembly. I have an asset that my project loads, a bundle.zip that I currently use the '--embed-file' flag from the SDK at compile time, and this works.
However, I would like to know if there is a way, in HTML or JavaScript, to pre-load this asset. So, instead of having to rebuild my project every time I change something in 'bundle.zip', I would just upload it and keep the same '.wasm'.
Is this option available? When searching online, I only found questions and answers related to C#'s Blazor, which is not related to what I want.
A crucial detail is that my application needs to read this file from the file system, as if it were on the native platform, not on the web (it does a fopen).
After the response of @VonC, this is my final HTML
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="preload" href="/bundle.zip" as="fetch" type="application/octet-stream" crossorigin="anonymous" />
<style>
*,
*::before,
*::after {
box-sizing: border-box;
}
* {
margin: 0;
}
body {
line-height: 1.5;
-webkit-font-smoothing: antialiased;
}
canvas {
display: block;
max-width: 100%;
}
.container {
display: flex;
align-items: center;
justify-content: center;
}
</style>
</head>
<body>
<div class="container">
<canvas id="canvas" oncontextmenu="event.preventDefault()"></canvas>
<script>
const canvas = document.getElementById("canvas");
var Module = {
canvas,
noInitialRun: true,
onRuntimeInitialized: () => {
fetch("/bundle.zip")
.then((response) => response.arrayBuffer())
.then((data) => {
const uint8View = new Uint8Array(data);
FS.writeFile("/bundle.zip", uint8View);
Module.callMain();
});
},
};
</script>
<script src="carimbo.js"></script>
</div>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With