[Question] Error in getModelJSON with React

[ajaykrupalk]

Hey, I am trying to transcribe audio to speech using transformers.js. I tried two ways

1. https://huggingface.co/docs/transformers.js/api/pipelines#pipelinesautomaticspeechrecognitionpipeline
2. https://huggingface.co/docs/transformers.js/tutorials/react

But seem to get an error like this

Files for your reference: https://filebin.net/88munmsfk4u0127m

Please do let me know if I am doing something wrong or what is the best way using ReactJS

[xenova]

The error you are getting is most likely because it can't find the model files, and some page is being rendered (not of status=404), so, it's attempting to parse something which isn't JSON.

Could you share the code you are using to load the model? Also, are you trying to access the model files from the HF hub, or rather, are they locally hosted?

[ajaykrupalk]

I tried this locally now with the same set of code https://huggingface.co/docs/transformers.js/tutorials/react and seem to be getting the same error. Also, I am trying to use models from HF, wanted to use OpenAI's whisper.

The code is attached in this filebin: https://filebin.net/tqvjg8d3f3wnxtm4

The above is the only code that I am using. Please do let me know if there is anything more that has to be added.

[ajaykrupalk]

@xenova Is there any update on this? Awaiting your response.

[maudnals]

Hey folks, I'm experiencing a similar issue.
My setup isn't React-based though so I've filed an issue separately for clarity (in case the root cause is actually different):
#366

Thanks!

[xenova]

@ajaykrupalk Could you try what I suggested here?

TLDR: Skip the local file check and add

import { pipeline, env } from '@xenova/transformers';
env.allowLocalModels = false;

[ajaykrupalk]

Hi @xenova I think the issue gets fixed if I start using vite + react. I guess I should migrate my app to vite now 😢😅