如何在Transformers.js中使用pyannote/speaker-diarization-3.0？

pyannote/speaker-diarization-3.0是整合了说话人分割与说话人嵌入的完整pipeline，相比单独的segmentation模型更适配说话人分音任务。以下是客户端JS中用Transformers.js处理它的具体步骤：

核心操作步骤 #

• 确认模型格式：使用适配ONNX格式的pyannote说话人分音模型（Transformers.js仅支持ONNX模型）。
• 引入Transformers.js：通过CDN或npm包在客户端项目中引入库。
• 加载分音Pipeline：直接调用Transformers.js的pipeline方法加载说话人分音任务模型。
• 处理音频输入：将客户端的音频文件（或实时音频）转换为模型可接受的格式。
• 运行推理并解析结果：执行推理后，从返回结果中提取说话人标签和对应时间段。

代码示例 #

// 方式1：通过CDN引入（适合快速测试）
<script src="https://cdn.jsdelivr.net/npm/@xenova/transformers@latest"></script>

<script>
async function initDiarization() {
  // 加载说话人分音pipeline
  const diarizationPipeline = await Transformers.pipeline('speaker-diarization', 'onnx-community/pyannote-speaker-diarization-3.0');
  
  // 绑定音频文件选择事件
  document.getElementById('audio-file').addEventListener('change', async (e) => {
    const audioFile = e.target.files[0];
    if (!audioFile) return;
    
    // 读取音频文件为ArrayBuffer
    const audioBuffer = await audioFile.arrayBuffer();
    
    // 运行分音推理
    const diarizationResult = await diarizationPipeline(audioBuffer);
    
    // 解析并展示结果
    const resultContainer = document.getElementById('result');
    resultContainer.innerHTML = '';
    diarizationResult.segments.forEach((segment, index) => {
      const item = document.createElement('div');
      item.textContent = `片段${index+1}：说话人${segment.speaker}，时间段 ${segment.start.toFixed(2)}s - ${segment.end.toFixed(2)}s`;
      resultContainer.appendChild(item);
    });
  });
}

// 页面加载完成后初始化
window.onload = initDiarization;
</script>

关键注意事项 #

• CORS问题：若模型托管在外部服务器，需确保服务器支持CORS，否则会触发跨域错误；也可将模型文件下载到本地托管。
• 模型加载速度：pyannote说话人分音模型包含两个子模型，总大小较大，首次加载可能耗时较长，建议用Service Worker缓存模型文件。
• 音频兼容性：Transformers.js支持MP3、WAV等常见音频格式，无需额外转换。
• 实时音频权限：若处理麦克风实时音频，需提前请求用户的麦克风访问权限。

内容的提问来源于stack exchange，提问作者Student