如何在WebMScore中使用.sfz音色库渲染乐谱音频？

问题原因 #

你遇到的error 15424120报错由两个核心原因导致：

• 多数预编译的WebMscore版本默认未开启Zerberus（MuseScore官方SFZ播放器）模块，本身就不支持SFZ格式解析
• SFZ仅为配置文件，你当前直接传入SFZ文件Buffer的逻辑只适配单文件的SF2/SF3格式，WebMscore的WASM沙箱环境无法直接访问你本地的samples采样文件夹，找不到关联的音频文件就会抛出无message的底层错误

解决方案 #

1. 确认/编译带Zerberus支持的WebMscore #

首先检查你使用的WebMscore依赖是否开启了Zerberus编译选项，官方默认预编译包通常关闭了该功能，需要自行拉取源码，编译时将ENABLE_ZERBERUS参数设置为ON后重新构建。

2. 挂载所有关联文件到WASM虚拟文件系统 #

WebMscore基于Emscripten编译，运行在WASM沙箱中，无法直接读取本地文件系统，需要将SFZ配置和所有采样文件同步写入其暴露的虚拟文件系统（FS）中，再传入虚拟文件路径加载音色。

3. 调整代码逻辑 #

修改后的测试代码如下，适配你的现有文件结构，无需调整本地文件存放路径：

const WebMscore = require('webmscore');
const fs = require('fs');
const path = require('path');

const name = 'testScore.mscz';
const exportedPrefix = 'exported';
const filedata = fs.readFileSync(`./${name}`);

WebMscore.ready.then(async () => {
    // 写入SFZ配置到虚拟文件系统
    WebMscore.FS.writeFile('/mySFZ.sfz', fs.readFileSync('./mySFZ.sfz'));
    // 创建采样文件夹
    WebMscore.FS.mkdir('/samples');
    // 批量写入所有采样文件到虚拟文件系统
    const sampleDir = './samples';
    const sampleFiles = fs.readdirSync(sampleDir);
    for (const file of sampleFiles) {
        const filePath = path.join(sampleDir, file);
        WebMscore.FS.writeFile(`/samples/${file}`, fs.readFileSync(filePath));
    }

    const score = await WebMscore.load('mscz', filedata, [], false);
    // 传入虚拟文件系统中的SFZ路径，而非本地文件Buffer
    await score.setSoundFont('/mySFZ.sfz');
    
    try { 
        fs.writeFileSync(`./${exportedPrefix}.mp3`, await score.saveAudio('mp3')); 
    } catch (err) { 
        console.log(err) 
    } 
    score.destroy();
});

4. 校验SFZ内部路径 #

确保你的mySFZ.sfz配置中，所有sample字段的路径和虚拟文件系统中的路径一致，例如sample=samples/one.wav可以直接使用，和你本地的相对路径完全匹配即可。

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