将本地文件导入 AudioWorkletProcessor 文件时出现意外的标识符错误
Unexpected Identifier Error when Importing a local file into AudioWorkletProcessor File
我目前正在使用 Angular 构建视频会议应用程序。在我的一项服务中,我尝试合并网络音频 api。问题是当我尝试使用 addModule(AudioWorkletProcessorFileName.js)
函数将脚本添加到音频工作集时,它会抛出 SyntaxError: Unexpected Identifier
。我发现只有当我尝试将另一个文件导入 AudioWorkletProcessorFileName.js
时才会发生这种情况。当我删除 import
语句时,一切正常。我想导入更复杂的代码,但我想从更简单的 test.js
版本(我要导入的文件)开始。我不确定为什么会这样。我是否缺少 Angular 或其他内容中的某些配置设置?
在audio.service.ts中:
import { Injectable } from '@angular/core';
import { AudioContext, AudioWorkletNode } from 'standardized-audio-context';
@Injectable()
export class AudioService {
audioCtx = new AudioContext();
constructor() {}
async createNewSetting(track) {
// We need an audio context for the sound
const srcNode = this.audioCtx.createMediaStreamTrackSource(track);
const destNode = this.audioCtx.createMediaStreamDestination();
// This will be the processor node
await this.audioCtx.audioWorklet.addModule(
'./assets/worklet/audio-worklet-processor.js'
);
const spatialNode = new AudioWorkletNode(
this.audioCtx,
'spatial-processor'
);
// Connect the nodes
srcNode.connect(spatialNode);
spatialNode.connect(destNode);
// Return the updated audio stream
return destNode.stream.getTracks()[0];
}
}
在audio-worklet-processor.js:
import TEST_VAR from './test.js'; // Will throw exception when I include this
class SpatialProcessor extends AudioWorkletProcessor {
constructor() {
super();
console.log("In Constructor");
}
process (inputs, outputs, parameters) {
console.log("In Process");
return true;
}
}
registerProcessor("spatial-processor", SpatialProcessor);
在test.js中:
const TEST_VAR = 1;
export default {
TEST_VAR
};
正如上面评论中提到的,这是标准化音频上下文中的一个错误,它没有正确解析 AudioWorklet 内部的相对路径。 25.1.7及以上版本应该会修复。
我目前正在使用 Angular 构建视频会议应用程序。在我的一项服务中,我尝试合并网络音频 api。问题是当我尝试使用 addModule(AudioWorkletProcessorFileName.js)
函数将脚本添加到音频工作集时,它会抛出 SyntaxError: Unexpected Identifier
。我发现只有当我尝试将另一个文件导入 AudioWorkletProcessorFileName.js
时才会发生这种情况。当我删除 import
语句时,一切正常。我想导入更复杂的代码,但我想从更简单的 test.js
版本(我要导入的文件)开始。我不确定为什么会这样。我是否缺少 Angular 或其他内容中的某些配置设置?
在audio.service.ts中:
import { Injectable } from '@angular/core';
import { AudioContext, AudioWorkletNode } from 'standardized-audio-context';
@Injectable()
export class AudioService {
audioCtx = new AudioContext();
constructor() {}
async createNewSetting(track) {
// We need an audio context for the sound
const srcNode = this.audioCtx.createMediaStreamTrackSource(track);
const destNode = this.audioCtx.createMediaStreamDestination();
// This will be the processor node
await this.audioCtx.audioWorklet.addModule(
'./assets/worklet/audio-worklet-processor.js'
);
const spatialNode = new AudioWorkletNode(
this.audioCtx,
'spatial-processor'
);
// Connect the nodes
srcNode.connect(spatialNode);
spatialNode.connect(destNode);
// Return the updated audio stream
return destNode.stream.getTracks()[0];
}
}
在audio-worklet-processor.js:
import TEST_VAR from './test.js'; // Will throw exception when I include this
class SpatialProcessor extends AudioWorkletProcessor {
constructor() {
super();
console.log("In Constructor");
}
process (inputs, outputs, parameters) {
console.log("In Process");
return true;
}
}
registerProcessor("spatial-processor", SpatialProcessor);
在test.js中:
const TEST_VAR = 1;
export default {
TEST_VAR
};
正如上面评论中提到的,这是标准化音频上下文中的一个错误,它没有正确解析 AudioWorklet 内部的相对路径。 25.1.7及以上版本应该会修复。