"Feature Extractor Examples" from ml5.js website / TypeError: Failed to fetch

[hedlerhdm]

p5.js version

1.9.1

What is your operating system?

Windows 11

Web browser and version

Chrome 123.0.6312.106

Actual Behavior

the FeatureExtractor Examples for the "p5 web editor" from the ml5.js website raise an error: TypeError: Failed to fetch.

Here are the Examples:
FeatureExtractor_Image_Regression
FeatureExtractor_Image_Classification

a couple of days ago, the examples worked perfecty fine.

[davepagurek]

This is the error in the console for me:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.kaggle.com/models/google/mobilenet-v1/frameworks/tfJs/variations/025-224-classification/versions/1/model.json?tfjs-format=file&tfhub-redirect=true. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 302.

Looks like Kaggle recently made some API changes on April 8, so maybe it's related to that?

[hedlerhdm]

Besides the "Feature Extractor Examples", other sample codes are also affected: FaceMesh, Hand Pose, Image Classification, etc.

[jht9629-nyu]

I see cross-origin error on these two p5js sketches.
They worked fine a few weeks ago.

https://editor.p5js.org/ml5/sketches/Facemesh_Webcam

https://editor.p5js.org/ml5/sketches/Handpose_Webcam

Access to fetch at 'https://www.kaggle.com/models/mediapipe/facemesh/frameworks/tfJs/variations/default/versions/1/model.json?tfjs-format=file&tfhub-redirect=true'
(redirected from 'https://tfhub.dev/mediapipe/tfjs-model/facemesh/1/default/1/model.json?tfjs-format=file')
from origin 'https://preview.p5js.org' has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
If an opaque response serves your needs,
set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

[shiffman]

Hi everyone! We are working on a new version of the ml5.js with more up-to-date models, the release is coming very soon! Please see the following for newer examples that you can use right now in the meantime!

New examples: https://editor.p5js.org/ml5/collections/pUzWMkdmE
New library: https://unpkg.com/[email protected]/dist/ml5.min.js
Temporary documentation: https://github.com/ml5js/ml5-next-gen/blob/main/documentation.md

Please file any issues in this repo: https://github.com/ml5js/ml5-next-gen

[hedlerhdm]

Thanks, Daniel! Your work is highly appreciated.
Any chance to fix the problem anyway? I'm using ml5.js during ongoing lectures. Almost all examples are affected (e.g., feature extraction).

[shiffman]

Was this perhaps a temporary issue yesterday? Everything seems to be working for me, I tested the ones above as well as these three examples from my videos.

https://editor.p5js.org/codingtrain/sketches/qFZF7iDe
https://editor.p5js.org/codingtrain/sketches/5A_TJHA1
https://editor.p5js.org/codingtrain/sketches/ULA97pJXR

[jht9629-nyu]

Working for me ok today.

These sketches now run OK:
https://editor.p5js.org/ml5/sketches/Facemesh_Webcam
https://editor.p5js.org/ml5/sketches/Handpose_Webcam

[hedlerhdm]

all examples are now working again. Maybe a temporary problem with Kaggle.
Thanks anyway

[devihall]

Hey there! I can confirm this was a TensorFlow issue. I had raised this issue on their Github and they rolled out a fix. . They also provided some recommendations for how to avoid this in the future. See link attached.

tensorflow/hub#904 (comment)

[jht9629-nyu]

Similar failure today:

https://docs.ml5js.org/#/reference/bodypose
Access to fetch at 'https://www.kaggle.com/models/google/movenet/tfJs/multipose-lightning/1/model.json?tfjs-format=file&tfhub-redirect=true' (redirected from 'https://tfhub.dev/google/tfjs-model/movenet/multipose/lightning/1/model.json?tfjs-format=file') from origin 'https://docs.ml5js.org' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

https://docs.ml5js.org/#/reference/facemesh
Access to fetch at 'https://www.kaggle.com/models/mediapipe/face-landmarks-detection/tfJs/face-mesh/1/model.json?tfjs-format=file&tfhub-redirect=true' (redirected from 'https://tfhub.dev/mediapipe/tfjs-model/face_landmarks_detection/face_mesh/1/model.json?tfjs-format=file') from origin 'https://docs.ml5js.org' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

[shiffman]

I just checked and it's working for me right now? Did it resolve for you @jht9629-nyu?

I think, unfortunately, we are at the mercy of the google/kaggle/tfhub servers and if something is down, then loading the model in ml5.js breaks. Maybe it would be good to document this better and/or have a back-up solution?

Feel free to file an issue in ml5-next-gen, that's where we are tracking ongoing development now!

https://github.com/ml5js/ml5-next-gen/

[jht9629-nyu]

Working for me now. Appears to be a temporary problem.

https://docs.ml5js.org/#/reference/bodypose
https://docs.ml5js.org/#/reference/facemesh

[jht9629-nyu]

Since there is a hidden dependency on google servers to load models it would be great to have an example showing how to download those models and use them locally. ie. I would like to use facemesh without a web connection. Be well, -[ john-henry ]-[ thompson ]

…

On Tue, Aug 13, 2024 at 9:52 PM Daniel Shiffman ***@***.***> wrote: I just checked and it's working for me right now? Did it resolve for you @jht9629-nyu <https://urldefense.proofpoint.com/v2/url?u=https-3A__github.com_jht9629-2Dnyu&d=DwMCaQ&c=slrrB7dE8n7gBJbeO0g-IQ&r=UCFvUQurfK8Qyy8EfTquZw&m=dm-rM_jSgyPlxtcthfNt2uKBSzCs3Lgd0lUrd9-4uE6NUB4r9AqKz3b-BapMWN1r&s=hEAQEgMkSRxbJ3J6uTv8JNhExu9mdtMgaZFlfAtY7eg&e=> ? I think, unfortunately, we are at the mercy of the google/kaggle/tfhub servers and if something is down, then loading the model in ml5.js breaks. Maybe it would be good to document this better and/or have a back-up solution? Feel free to file an issue in ml5-next-gen, that's where we are tracking ongoing development now! https://github.com/ml5js/ml5-next-gen/ <https://urldefense.proofpoint.com/v2/url?u=https-3A__github.com_ml5js_ml5-2Dnext-2Dgen_&d=DwMCaQ&c=slrrB7dE8n7gBJbeO0g-IQ&r=UCFvUQurfK8Qyy8EfTquZw&m=dm-rM_jSgyPlxtcthfNt2uKBSzCs3Lgd0lUrd9-4uE6NUB4r9AqKz3b-BapMWN1r&s=MZ8ixm-LwETg1D7wBDpl0ZgHNpdMV1ecjUQ2vRH22HY&e=> — Reply to this email directly, view it on GitHub <https://urldefense.proofpoint.com/v2/url?u=https-3A__github.com_ml5js_ml5-2Dlibrary_issues_1483-23issuecomment-2D2287681798&d=DwMCaQ&c=slrrB7dE8n7gBJbeO0g-IQ&r=UCFvUQurfK8Qyy8EfTquZw&m=dm-rM_jSgyPlxtcthfNt2uKBSzCs3Lgd0lUrd9-4uE6NUB4r9AqKz3b-BapMWN1r&s=viJ2HDrwtQpqpYtiJsEd0Gdc_dYomr5hraUMcoaDU_8&e=>, or unsubscribe <https://urldefense.proofpoint.com/v2/url?u=https-3A__github.com_notifications_unsubscribe-2Dauth_ASZWD3KELP5EOI3WY7JA25DZRKZ5RAVCNFSM6AAAAABF6T7W2WVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDEOBXGY4DCNZZHA&d=DwMCaQ&c=slrrB7dE8n7gBJbeO0g-IQ&r=UCFvUQurfK8Qyy8EfTquZw&m=dm-rM_jSgyPlxtcthfNt2uKBSzCs3Lgd0lUrd9-4uE6NUB4r9AqKz3b-BapMWN1r&s=K0TSj9iwD6GRgSp71YgQ2jsYURvNqX4e2fe7HPuxbDg&e=> . You are receiving this because you were mentioned.Message ID: ***@***.***>