On Brave browser Version 1.61.101 Chromium: 120.0.6099.71 (Official Build) (x86_64)
(on Chrome Version 120.0.6099.62 (Official Build) (x86_64)
I don't see this or any other errors) I run into a JSON parsing error when trying to run in development mode the client-side example from Hugging Face's Next.JS tutorial: https://huggingface.co/docs/transformers.js/tutorials/next#client-side-inference. Because of this error the text classification cannot run.
The error is as follows:
This is my TransformerWorker.js which is taken directly from the tutorial linked above, no changes:
import { pipeline, env } from "@xenova/transformers";
// Skip local model check and cache
env.allowLocalModels = false;
// Use the Singleton pattern to enable lazy construction of the pipeline.
class PipelineSingleton {
static task = 'text-classification';
static model = 'Xenova/distilbert-base-uncased-finetuned-sst-2-english';
static instance = null;
static async getInstance(progress_callback = null) {
if (this.instance === null) {
this.instance = pipeline(this.task, this.model, { progress_callback });
}
return this.instance;
}
}
// Listen for messages from the main thread
self.addEventListener('message', async (event) => {
// Retrieve the classification pipeline. When called for the first time,
// this will load the pipeline and save it for future use.
let classifier = await PipelineSingleton.getInstance(x => {
// We also add a progress callback to the pipeline so that we can
// track model loading.
self.postMessage(x);
});
// Actually perform the classification
let output = await classifier(event.data.text);
// Send the output back to the main thread
self.postMessage({
status: 'complete',
output: output,
});
});
Looking through the Github issues for transformers.js I found https://github.com/xenova/transformers.js/issues/366 in which one user suggested adding the following line to the worker file:
env.useBrowserCache = false;
Turning the browser cache option off I no longer receive this error in the Brave browser and, in fact, the Next.js client-side example code Hugging Face provides in their tutorial works without any further issues for me.
That said, browser caching is a significant feature, so this could indicate an underlying bug that needs to be fixed in transformers.js. See the link to the transformers.js Github issue above.