search

tsibg / react-background-remover

Image Background Remover built with ReactJS
https://react-background-remover-seven.vercel.app/
8 stars 2 forks source link

Runtime error #1

Closed md-rifatkhan closed 8 months ago

md-rifatkhan commented 10 months ago 
ERROR
Resource /models/medium not found. Ensure that the config.publicPath is configured correctly.
    at loadAsBlob (http://localhost:3000/static/js/bundle.js:74170:11)
    at async initInference (http://localhost:3000/static/js/bundle.js:74370:16)
    at async removeBackground (http://localhost:3000/static/js/bundle.js:74404:7)
    at async load (http://localhost:3000/static/js/bundle.js:231:23)
tsibg commented 10 months ago 
ERROR
Resource /models/medium not found. Ensure that the config.publicPath is configured correctly.
    at loadAsBlob (http://localhost:3000/static/js/bundle.js:74170:11)
    at async initInference (http://localhost:3000/static/js/bundle.js:74370:16)
    at async removeBackground (http://localhost:3000/static/js/bundle.js:74404:7)
    at async load (http://localhost:3000/static/js/bundle.js:231:23)

Could you confirm that after npm install the model files are copied in /public/static/model?

md-rifatkhan commented 10 months ago

yes, here are log


<!--StartFragment-->
$ copyfiles -f -V ./node_modules/@imgly/background-removal/dist/* ./public/static/model/   && echo 'Model files copied.'
--
23:25:34.752 | unglobed path: ./node_modules/@imgly/background-removal/dist/codecs.d.ts
23:25:34.754 | unglobed path: ./node_modules/@imgly/background-removal/dist/codecs.d.ts.map
23:25:34.755 | unglobed path: ./node_modules/@imgly/background-removal/dist/index.cjs
23:25:34.755 | unglobed path: ./node_modules/@imgly/background-removal/dist/index.cjs.map
23:25:34.756 | unglobed path: ./node_modules/@imgly/background-removal/dist/index.d.ts
23:25:34.756 | unglobed path: ./node_modules/@imgly/background-removal/dist/index.d.ts.map
23:25:34.757 | unglobed path: ./node_modules/@imgly/background-removal/dist/index.mjs
23:25:34.757 | copy from: ./node_modules/@imgly/background-removal/dist/codecs.d.ts
23:25:34.757 | copy to: public/static/model/codecs.d.ts
23:25:34.758 | unglobed path: ./node_modules/@imgly/background-removal/dist/index.mjs.map
23:25:34.758 | unglobed path: ./node_modules/@imgly/background-removal/dist/inference.d.ts
23:25:34.759 | unglobed path: ./node_modules/@imgly/background-removal/dist/inference.d.ts.map
23:25:34.759 | unglobed path: ./node_modules/@imgly/background-removal/dist/onnx.d.ts
23:25:34.760 | copy from: ./node_modules/@imgly/background-removal/dist/codecs.d.ts.map
23:25:34.760 | copy to: public/static/model/codecs.d.ts.map
23:25:34.760 | unglobed path: ./node_modules/@imgly/background-removal/dist/onnx.d.ts.map
23:25:34.761 | unglobed path: ./node_modules/@imgly/background-removal/dist/resource.d.ts
23:25:34.761 | unglobed path: ./node_modules/@imgly/background-removal/dist/resource.d.ts.map
23:25:34.762 | copy from: ./node_modules/@imgly/background-removal/dist/index.cjs
23:25:34.763 | copy to: public/static/model/index.cjs
23:25:34.764 | unglobed path: ./node_modules/@imgly/background-removal/dist/resources.json
23:25:34.764 | unglobed path: ./node_modules/@imgly/background-removal/dist/schema.d.ts
23:25:34.765 | unglobed path: ./node_modules/@imgly/background-removal/dist/schema.d.ts.map
23:25:34.765 | unglobed path: ./node_modules/@imgly/background-removal/dist/url.d.ts
23:25:34.766 | copy from: ./node_modules/@imgly/background-removal/dist/index.cjs.map
23:25:34.766 | copy to: public/static/model/index.cjs.map
23:25:34.766 | unglobed path: ./node_modules/@imgly/background-removal/dist/url.d.ts.map
23:25:34.767 | unglobed path: ./node_modules/@imgly/background-removal/dist/utils.d.ts
23:25:34.767 | unglobed path: ./node_modules/@imgly/background-removal/dist/utils.d.ts.map
23:25:34.768 | copy from: ./node_modules/@imgly/background-removal/dist/index.d.ts
23:25:34.768 | copy to: public/static/model/index.d.ts
23:25:34.769 | copy from: ./node_modules/@imgly/background-removal/dist/index.d.ts.map
23:25:34.769 | copy to: public/static/model/index.d.ts.map
23:25:34.769 | copy from: ./node_modules/@imgly/background-removal/dist/index.mjs
23:25:34.770 | copy to: public/static/model/index.mjs
23:25:34.770 | copy from: ./node_modules/@imgly/background-removal/dist/index.mjs.map
23:25:34.770 | copy to: public/static/model/index.mjs.map
23:25:34.771 | copy from: ./node_modules/@imgly/background-removal/dist/inference.d.ts
23:25:34.771 | copy to: public/static/model/inference.d.ts
23:25:34.772 | copy from: ./node_modules/@imgly/background-removal/dist/inference.d.ts.map
23:25:34.772 | copy to: public/static/model/inference.d.ts.map
23:25:34.773 | copy from: ./node_modules/@imgly/background-removal/dist/onnx.d.ts
23:25:34.778 | copy to: public/static/model/onnx.d.ts
23:25:34.778 | copy from: ./node_modules/@imgly/background-removal/dist/onnx.d.ts.map
23:25:34.778 | copy to: public/static/model/onnx.d.ts.map
23:25:34.780 | copy from: ./node_modules/@imgly/background-removal/dist/resource.d.ts
23:25:34.780 | copy to: public/static/model/resource.d.ts
23:25:34.780 | copy from: ./node_modules/@imgly/background-removal/dist/resource.d.ts.map
23:25:34.780 | copy to: public/static/model/resource.d.ts.map
23:25:34.780 | copy from: ./node_modules/@imgly/background-removal/dist/resources.json
23:25:34.780 | copy to: public/static/model/resources.json
23:25:34.780 | copy from: ./node_modules/@imgly/background-removal/dist/schema.d.ts
23:25:34.780 | copy to: public/static/model/schema.d.ts
23:25:34.780 | copy from: ./node_modules/@imgly/background-removal/dist/schema.d.ts.map
23:25:34.780 | copy to: public/static/model/schema.d.ts.map
23:25:34.782 | copy from: ./node_modules/@imgly/background-removal/dist/url.d.ts
23:25:34.782 | copy to: public/static/model/url.d.ts
23:25:34.782 | copy from: ./node_modules/@imgly/background-removal/dist/url.d.ts.map
23:25:34.782 | copy to: public/static/model/url.d.ts.map
23:25:34.782 | copy from: ./node_modules/@imgly/background-removal/dist/utils.d.ts
23:25:34.782 | copy to: public/static/model/utils.d.ts
23:25:34.782 | copy from: ./node_modules/@imgly/background-removal/dist/utils.d.ts.map
23:25:34.782 | copy to: public/static/model/utils.d.ts.map
23:25:34.789 | Model files copied.

<!--EndFragment-->
tsibg commented 10 months ago

Thanks for the issue, it seems imgly has update the README and the recommendations for serving the model files as they are now provided as another npm package @imgly/background-removal-data.

https://github.com/imgly/background-removal-js/tree/main/packages/web#custom-asset-serving

I will update soon this repo to match the recommendations for custom asset serving.

@md-rifatkhan Meanwhile, you could remove this line from the lib's initialization src/components /BackgroundRemover.js:22: publicPath: MODEL_ASSETS_URL,

( https://github.com/tsibg/react-background-remover/blob/c5ffe95a65edc287630f428efb8f3ca468660bc8/src/components/BackgroundRemover.js#L22C7-L22C17 ).

In this way the files will be served from the official imgly's CDN.

dylie-eth commented 9 months ago

Did you manage to push the changes to this repo to fix this issue? I have a use case that I think can be served by what you have done here with this library.

tsibg commented 8 months ago

@dylie-eth Still WIP. I expect next weekend to have time for this issue.

Meanwhile, using imgly's library before v1.4.0 should work. Or serving the assets from their CDN.

If you have time to check it up, contributes are welcomed :)

tsibg commented 8 months ago

Update: It should be fixed now. Updating dependencies and copying the model assets from @imgly/background-removal-data solved the problem easily.

Please, reopen this issue if the problem persists.