Draco Loader violates CSP in Chrome Extension because of "unsafe eval"

Hi Guys,

I marked this one as urgent as it is currently breaking our popular game in chrome extensions.

Refused to load the script '<URL>' because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

Refused to load the script 'https://preview.babylonjs.com/draco_wasm_wrapper_gltf.js' because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

Chrome extensions (under Manifest v3) have a very restrictive CSP, they dont allow any usage of “eval” also you are not allowed to load any remote JS.

So I thought it would be a simple matter of changing the DracoCompression config to load from disk as suggested in the docs.

Unfortunately that doesnt solve the problem.

I believe this is because the loading of the draco decoder happens inside a worker via importScripts() which maybe be what is causing the issue.

What im thinking of doing is to instead import (ESM) the draco decoder from npm (GitHub - google/draco: Draco is a library for compressing and decompressing 3D geometric meshes and point clouds. It is intended to improve the storage and transmission of 3D graphics.) and then somehow override the GLTF2 loader to use the imported decoder rather than using the worker.

Has anyone else had issues around this, any suggestions?

Okay some progress. Looking through the Draco decompression source I discovered this which lets you disable web worker draco decompression.

Doing that results in a different but expected error:

failed to asynchronously prepare wasm: CompileError: WebAssembly.instantiate(): Refused to compile or instantiate WebAssembly module because neither 'wasm-eval' nor 'unsafe-eval' is an allowed source of script in the following Content Security Policy directive: "script-src 'self'"

Aborted(CompileError: WebAssembly.instantiate(): Refused to compile or instantiate WebAssembly module because neither 'wasm-eval' nor 'unsafe-eval' is an allowed source of script in the following Content Security Policy directive: "script-src 'self'")

So it is as expected. Ill see if I can disable WASM…

HUZZAH! It works!

For those that might be stumbling across this from a google search. The magic I needed to apply was:

DracoCompression.Configuration = {
  decoder: {
    fallbackUrl: "3d/draco/draco_decoder_gltf.js",
  },
};
DracoCompression.DefaultNumWorkers = 0;

This disables remote loading of the decompressor, disabled web workers AND disables WASM decompression.

3 Likes

thanks for sharing the solution :wink: