load wasm binary manually

This commit is contained in:
ading2210 2024-01-18 20:14:11 -05:00
parent 0b14c32b25
commit 5ecb30d5ed
6 changed files with 41 additions and 8 deletions

View file

@ -22,10 +22,10 @@ Make sure you have emscripten, git, and the various C build tools installed. The
## Javascript API:
### Importing the Library:
To import the library, follow the build instructions in the previous section, and copy `client/out/libcurl.js` a directory of your choice. Then you can simply link to it using a script tag and you will be able to use libcurl.js in your projects. Deferring the script load is recommended because the JS file is too large to download immediately.
To import the library, follow the build instructions in the previous section, and copy `client/out/libcurl.js` and `client/out/libcurl.wasm` to a directory of your choice. After the script is loaded, call `libcurl.load_wasm`, specifying the url of the `libcurl.wasm` file.
```html
<script defer src="./out/libcurl.js"></script>
<script defer src="./out/libcurl.js" onload="libcurl.load_wasm('/out/emscripten_compiled.wasm');"></script>
```
To know when libcurl.js has finished loading, you can use the `libcurl_load` DOM event.

View file

@ -2,15 +2,19 @@
set -e
#path definitions
INCLUDE_DIR="build/curl-wasm/include/"
LIB_DIR="build/curl-wasm/lib/"
OUT_FILE="out/libcurl.js"
ES6_FILE="out/libcurl_module.mjs"
MODULE_FILE="out/emscripten_compiled.js"
COMPILED_FILE="out/emscripten_compiled.wasm"
WASM_FILE="out/libcurl.wasm"
FRAGMENTS_DIR="fragments"
WRAPPER_SOURCE="main.js"
WISP_CLIENT="wisp_client"
#compile options
EXPORTED_FUNCS="_init_curl,_start_request,_tick_request,_active_requests,_free"
RUNTIME_METHODS="addFunction,removeFunction,allocate,ALLOC_NORMAL"
COMPILER_OPTIONS="-o $MODULE_FILE -lcurl -lssl -lcrypto -lcjson -lz -lbrotlidec -lbrotlicommon -lnghttp2 -I $INCLUDE_DIR -L $LIB_DIR"
@ -18,7 +22,7 @@ EMSCRIPTEN_OPTIONS="-lwebsocket.js -sASSERTIONS=1 -sALLOW_TABLE_GROWTH -sALLOW_M
if [ "$1" = "release" ]; then
COMPILER_OPTIONS="-Oz -flto $COMPILER_OPTIONS"
EMSCRIPTEN_OPTIONS="-sSINGLE_FILE $EMSCRIPTEN_OPTIONS"
#EMSCRIPTEN_OPTIONS="-sSINGLE_FILE $EMSCRIPTEN_OPTIONS"
else
COMPILER_OPTIONS="$COMPILER_OPTIONS --profiling"
fi
@ -47,7 +51,7 @@ sed -i "/__extra_libraries__/r $WISP_CLIENT/wisp.js" $OUT_FILE
sed -i "/__extra_libraries__/r ./messages.js" $OUT_FILE
#apply patches
python3 patcher.py $FRAGMENTS_DIR $OUT_FILE
python3 scripts/patcher.py $FRAGMENTS_DIR $OUT_FILE
#generate es6 module
cp $OUT_FILE $ES6_FILE

View file

@ -0,0 +1,8 @@
/* REPLACE
var asm ?= ?createWasm\(\);
*/
var asm = null;
/* DELETE
run\(\);\n\n
*/

View file

@ -3,11 +3,11 @@
<head>
<link rel="icon" href="data:;base64,=">
<script defer src="./out/libcurl.js"></script>
<script defer src="./out/libcurl.js" onload="libcurl.load_wasm('/out/emscripten_compiled.wasm');"></script>
<script>
document.addEventListener("libcurl_load", ()=>{
console.log("libcurl.js ready!");
})
});
</script>
</head>
<body>

View file

@ -10,6 +10,13 @@ window.libcurl = (function() {
var websocket_url = `wss://${location.hostname}/ws/`;
var event_loop = null;
var active_requests = 0;
var wasm_ready = false;
function check_loaded() {
if (!wasm_ready) {
throw new Error("wasm not loaded yet, please call libcurl.load_wasm first");
}
}
//a case insensitive dictionary for request headers
class HeadersDict {
@ -135,8 +142,12 @@ function create_response(response_data, response_info) {
//create headers object
Object.defineProperty(response_obj, "headers", {
writable: false,
value: new Headers(response_info.headers)
value: new Headers()
});
for (let header_name in response_info.headers) {
let header_value = response_info.headers[header_name];
response_obj.headers.append(header_name, header_value);
}
return response_obj;
}
@ -224,11 +235,13 @@ function perform_request_async(url, params, body) {
}
async function libcurl_fetch(url, params={}) {
check_loaded();
let body = await create_options(params);
return await perform_request_async(url, params, body);
}
function set_websocket_url(url) {
check_loaded();
if (!Module.websocket) {
document.addEventListener("libcurl_load", () => {
set_websocket_url(url);
@ -239,6 +252,7 @@ function set_websocket_url(url) {
function main() {
console.log("emscripten module loaded");
wasm_ready = true;
_init_curl();
set_websocket_url(websocket_url);
@ -246,10 +260,17 @@ function main() {
document.dispatchEvent(load_event);
}
function load_wasm(url) {
wasmBinaryFile = url;
createWasm();
run();
}
Module.onRuntimeInitialized = main;
return {
fetch: libcurl_fetch,
set_websocket: set_websocket_url,
load_wasm: load_wasm,
wisp: _wisp_connections
}

View file

@ -18,7 +18,7 @@ for fragment_file in fragments_path.iterdir():
for mode, patch_regex, patch_text, _ in matches:
fragment_matches = re.findall(patch_regex, target_text)
if not fragment_matches:
print(f"warning: regex did not match anything - '{patch_regex}'");
print(f"warning: regex did not match anything for '{patch_regex}'");
if mode == "DELETE":
target_text = re.sub(patch_regex, "", target_text)
elif mode == "REPLACE":