如何使用Transformers.js pipeline转录本地音频File/Blob？（JSON.parse错误）

我太懂你现在的困扰了——用Transformers.js的Whisper模型处理用户上传的本地WAV文件时，明明远程URL的例子跑得好好的，换成本地File对象就掉链子对吧？其实问题出在本地File/Blob对象不能直接传给transcriber函数，内部会误把它当成可解析的JSON或者字符串去处理，自然就报JSON.parse相关的错误了。

我之前踩过这个坑，给你两个亲测有效的解决方案：

方案一：将File/Blob转换为Object URL #

这是最贴近你原有代码的改法，利用浏览器的URL.createObjectURL()把File对象转换成一个临时的本地URL，用法和你之前用的远程URL完全一致：

import { pipeline } from '@xenova/transformers';

async function transcribe(file) {
  if (!file) return;
  console.log(file.name);

  // 1. 把File对象转成浏览器可识别的临时URL
  const audioUrl = URL.createObjectURL(file);

  try {
    const transcriber = await pipeline(
      'automatic-speech-recognition',
      'Xenova/whisper-tiny.en'
    );
    const result = await transcriber(audioUrl);
    console.log('转录结果:', result.text);
  } catch (err) {
    console.error('转录出错:', err);
  } finally {
    // 2. 用完记得释放临时URL，避免内存泄漏
    URL.revokeObjectURL(audioUrl);
  }
}

这个方法的好处是几乎不用改你原来的逻辑，只是多了URL的创建和释放步骤，非常省心。

方案二：直接读取File为ArrayBuffer #

如果你不想创建临时URL，也可以直接把File读成ArrayBuffer传给transcriber，模型同样能处理这种格式：

import { pipeline } from '@xenova/transformers';

async function transcribe(file) {
  if (!file) return;
  console.log(file.name);

  // 1. 把File读成ArrayBuffer
  const arrayBuffer = await file.arrayBuffer();

  try {
    const transcriber = await pipeline(
      'automatic-speech-recognition',
      'Xenova/whisper-tiny.en'
    );
    // 2. 直接传入ArrayBuffer
    const result = await transcriber(arrayBuffer);
    console.log('转录结果:', result.text);
  } catch (err) {
    console.error('转录出错:', err);
  }
}

为啥原来的远程URL能行？ #

因为远程URL是标准的HTTP/HTTPS地址，transcriber内部会自动用fetch去拉取音频数据；但本地File对象是浏览器的专属实例，直接传进去的话，内部的处理逻辑会混乱，就会触发JSON.parse的错误——这可不是你的问题，是API对输入类型的兼容细节没注意到而已。

你之前验证的点（导入正确、模型名拼写对、在线状态）都是对的，只要把File对象转成上面两种格式之一，就能正常转录了！

内容来源于stack exchange