createNamedFunction in Emscripten compiled js is unsafe and doesn't work when enabling CSP

[stevedj]

System information
tfjs-tflite 0.0.1-alpha.10

Describe the current behavior
When setting CSP policy, we get "Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script". We traced this to createNamedFunction() which seems to come from emscripten and uses new Function(). Seemingly it can be disabled at compilation.

Reference:
https://stackoverflow.com/a/64814360
https://github.com/emscripten-core/emscripten/blob/1bc49003b9a5310362d2e4a6334a62be9cd56dc2/src/settings.js#L1282
#7144 (comment)

Describe the expected behavior
Please don't use this code
function createNamedFunction(name, body) {
name = makeLegalFunctionName(name);
return new Function("body","return function " + name + "() {\n" + ' "use strict";' + " return body.apply(this, arguments);\n" + "};\n")(body)
}

when compiling the wasm (if using emscripten), please use this
-s NO_DYNAMIC_EXECUTION=1

If the code has been open sourced, please give us the link so we can build it,
if not updating the library will be helpful for us,

Thank you so much

[stevedj]

I found a comment about using the old version of tfjs,
#7554 (comment)

But when I checked, it gave me an error in tflite_web_api_cc_simd_threaded.js (or tflite_web_api_cc_simd.js),
stating that
function createNamedFunction(name, body) {
name = makeLegalFunctionName(name);
return new Function("body","return function " + name + "() {\n" + ' "use strict";' + " return body.apply(this, arguments);\n" + "};\n")(body)
}
it seems it is using regenerator-runtime for polyfills.

maybe we can rebuild using NO_DYNAMIC_EXECUTION=1?

if anyone has a solution please let me know,
I'd love to hear what @mattsoulanille thinks about this.

Best regards
Steve

[shmishra99]

Hi @stevedj ,

I tested the workaround shared by @mattsoulanille in my Chrome extension, and it's not throwing any errors.

Could you tell us how you're using the ES2017 TFJS bundle in your code?

It would be helpful to know which specific part of the TFJS code is causing the problem. If possible, please provide a minimal reproducible code example.

Thank You!!

[stevedj]

Hi @shmishra99

Thank you for your reply,
I will create a Minimum Reproducible Code example,
I am using tfjs-tflite 0.0.1-alpha.10, and tried to load the tflite model,
but it is showing an error,

Please allow me some time to create the MRC,

Best regards
Steve

[stevedj]

Hi @shmishra99

Thank you for your patience,
Please find the Minimum Reproducible Code in this link

[shmishra99]

Hi @stevedj ,

I have tested the chrome-extension you shared. It seems that even after converting all used dependencies to ES2017, the issue persists with WASM dependencies. The error message indicates that the tflite_web_api_cc_simd_threaded.js file is not found, and the unsafe-eval directive in the Content Security Policy is causing the issue.

I think we need to use es2017 bundle for wasm dependencies as well. I will investigate more on this issue and update you soon.

Thank You!!

[stevedj]

Hi @shmishra99,

Thank you so much,
but in this comment, #7144 (comment)
@mattsoulanille 's comment indicates that we need to update the wasm and javascript generated by the Emscripten (in my opinion we need to update using -s NO_DYNAMIC_EXECUTION=1 flag)

Let me know your thoughts,

Thank you

[stevedj]

Hi @shmishra99,

please feel free to message me if there is anything I can do to clarify,

Thank you

[stevedj]

Hi @shmishra99

if you need any help investigating the issue, please feel free to inform me,
I will be here, and try your suggestion

Thank you

[shmishra99]

Sure @stevedj , we will investigate this issue further and give you an update soon.

[stevedj]

Hi @shmishra99
Thank you so much,
I appreciate it, if there is anything that I can do, I will be glad to help,

[stevedj]

Hi @shmishra99,
good day to you,
Is there any news regarding this issue? If not, an ETA would be helpful.

[stevedj]

Hi @shmishra99

I agree that the issue persists when we are using the ES2017 bundle,
and I believe it is because of the WASM Dependencies, is there anything that I can do to make the WASM dependencies work (maybe building the tfjs-tflite code mentioned by @mattsoulanille)?

Thanks for the issue report, @dinu-marina-typewise. At the moment, the WASM binaries are built on Google's internal build infrastructure, so you won't be able to build them yourself. One of our goals for Q1 2023 is to open-source this part of the build process.

Hi @stevedj ,

I have tested the chrome-extension you shared. It seems that even after converting all used dependencies to ES2017, the issue persists with WASM dependencies. The error message indicates that the tflite_web_api_cc_simd_threaded.js file is not found, and the unsafe-eval directive in the Content Security Policy is causing the issue.

I think we need to use es2017 bundle for wasm dependencies as well. I will investigate more on this issue and update you soon.

Thank You!!

[stevedj]

Hi @shmishra99

Just to clarify, did you get this error?

the error is showing on the Chrome Extension.

it is fetching correctly but the unsafe-eval prevents the execution

Is there any solution to make it work on Chrome Extension?
because we need the tflite works on the Chrome Extension,

Thank you!

[shmishra99]

Hi @stevedj ,

I'm also encountering the same error. I can't provide an ETA for a resolution yet, but I'll discuss this internally and update you soon.

Thank You!!

[stevedj]

Hi @shmishra99
Thank you so much,
I will wait for any news after your internal discussion,

I have tried to use tensorflow.js with the Coco SSD model,
but it gave me the same error

The Tensor Flow Lite library works fine (I guess the TF.js will also work fine) when I am using the Visual Studio Live Server Extension

I hope the above information helps,
and if you need to clarify anything please feel free to message me,

Thank you!