Zeronet: Wasm file

[krzysztof113]

Currently when loading wasm file from wrapper js it's blocked due to CORS.

I guess it's enough to adjust headers. Unless not supported by design.

[ghost]

Hey @krzysztof113 !

You solutions is here: https://github.com/HelloZeroNet/ZeroNet/pull/2356 (see "Update UiRequest.py")

@imachug @filips123 and @HelloZeroNet (Tamas Kocsis) are just a piece of shit closing pull requests (but copy and merge code in his name), violating licenses, criminal copyright infringers! They are neo-Nazis @krzysztof113 they don't give a shit about you or people who want to improve ZeroNet, they are pretending they shit the "Spanyol Viasz". Trust me is better for you if you replace your license to GPLv3+ in your copy of ZeroNet and develop it alone!

Here:
if noscript: headers["Content-Security-Policy"] = "frame-ancestors 'self'; img-src *; font-src * data:; media-src *; style-src *;" elif script_nonce and self.isScriptNonceSupported(): headers["Content-Security-Policy"] = "frame-ancestors 'self'; script-src 'nonce-{0}'; img-src 'self' blob: data:; style-src 'self'; connect-src *;".format(script_nonce)

If you want you can send me an email to [email protected], I watching you for a while and we can be better than this idiots here in this repository.

[ghost]

Use the frame-ancestors 'self'; you can even delete more from the list of Content-Security-Policy if you don't need. frame-ancestors doesn't support unsafe-inline etc... You can remove them. I'm more than sure will work! Also you need to delete from UiRequest.py this: headers["X-Frame-Options"] = "SAMEORIGIN" just simply delete that line and implement frame-ancestors 'self'; how you see above!

Like this: https://github.com/HelloZeroNet/ZeroNet/pull/2356/commits/b1772a1427e341c957c6b7226dbd63b81d314a26

[HelloZeroNet]

To avoid cors security problems you need ajax_key to load files with fetch/ajax api. Here is an example how to use it:

class Page extends ZeroFrame {
    async onOpenWebsocket() {
        var ajax_key = await this.cmdp("wrapperGetAjaxKey")
        fetch('hello-world.wasm?ajax_key=' + ajax_key).then(response =>
            response.arrayBuffer()
        ).then(bytes =>
            WebAssembly.instantiate(bytes)
        ).then(obj => {
            console.log(obj.instance.exports.add(24, 24));
        });
    }
}
page = new Page()

(The ajax key does not changes, so you only need to get it once.)

[krzysztof113]

That's a little problematic as wrapper js is provided by vendor and minimized. So I would have to apply customization to each release.
But I guess there is no other way as js fetches additional file by itself.

[filips123]

I think that ZeroFrame has a function to monkey-patch all fetch requests to include AJAX key.

[krzysztof113]

Yes, there is monkeyPatchAjax. Thanks

[HelloZeroNet]

I have made a modification to the ajax patch to make it awaitable: https://github.com/HelloZeroNet/ZeroHello/commit/a24c137a656bff1523599a368e4431102c5433f4
And added content type for wasm files to allow streaming loading: https://github.com/HelloZeroNet/ZeroNet/commit/2fd337bb55097bf0187dee85ba8866f1ef333e30

So you can do this:

await this.monkeyPatchAjax();
var wasm_obj = await WebAssembly.instantiateStreaming(fetch('hello-world.wasm'));
console.log(wasm_obj.instance.exports.add(24, 24));

But the streaming will only for for client who has been updated, so it's recommended to use the non-streaming method.

[krzysztof113]

monkeyPatchAjax works nice
I was lucky that library has build-in fallback when streaming not available.
3 sec load time versus 0,5 sec with wasm! Thanks!

[filips123]

Just out of interest, which library are you using and what are you building?