googlecreativelab / teachablemachine-community

Example code snippets and machine learning code for Teachable Machine
https://g.co/teachablemachine
Apache License 2.0
1.5k stars 666 forks source link

[FEATURE REQUEST]: Chrome Extension Integration - Content Security Policy issue #233

Open mistyhx opened 3 years ago

mistyhx commented 3 years ago

Is your feature request related to a problem? Please describe. I am not able to loadteachablemachine-image.min.js in a Chrome Extension that I am building. It throws this error. I would like to use teachable machine to build interesting interactions in the browser.

Screen Shot 2021-08-02 at 8 23 08 PM

However, I was not able to overwrite the content security policy either.

Describe the solution you'd like Find a way to fix this Content Security Policy issue for teachablemachine-image.min.js so it loads into Chrome Extensions.

Describe alternatives you've considered Other ways to make the teachablemachine js easier to integrate

Additional context I can successfully load tensorflow.js to Chrome Extension and make api calls without any warning

PLtier commented 1 year ago

Hi @mistyhx. I encountered the same issue developing my own chrome extension and I think I've found the solution. tl;dr; Assuming you have at least npm version 8.3.0 override teachable machine seedrandomdepedency to the newest version (it's 3.0.5) in package.json

"overrides": {
    "@teachablemachine/image": {
      "seedrandom": "^3.0.5",
      "@tensorflow/tfjs": "^3.20.0"
    }

(Additionaly if you have some error jumping out that dependencies aren't resolved try overriding @tensorflow/tfjs version to the one you're currently using). long Teachablemachine image depends on dependency called seedrandom which in version 2.4.3 uses eval. You can check it here: https://github.com/googlecreativelab/teachablemachine-community/blob/master/libraries/image/package.json. And as noted here https://github.com/davidbau/seedrandom/issues/75 seedrandom have only abandoned eval since version 3.0.5. So if your project doesn't depend on any additional libraries that might be using eval it should do the job. "Error" section in your extension in chrome://extensions/ should give you insight on that.