有问题让Tone Player播放任何东西,这里是我的简单VueJs代码:
<template>
<div>
<h1>Simple Tone.js Demo</h1>
<button style="background-color: cadetblue; padding: 4px 10px;" @click="play">Play</button>
</div>
</template>
<script>
import * as Tone from "tone";
export default {
data() {
return {
player: null,
};
},
methods: {
async play() {
try {
console.log("Tone.js context state:", Tone.context.state);
if (Tone.context.state !== "running") {
await Tone.start();
console.log("audio context started");
}
this.player.start();
} catch (error) {
console.error("Error during playback:", error.message, error);
}
},
async initializePlayer() {
console.log(Tone.context.state);
try {
this.player = await new Tone.Player({
url: "/sounds/rain.wav",
loop: true,
autostart: false,
}).toDestination();
this.player.loaded;
} catch (error) {
console.error("Error loading audio file:", error);
}
console.log("Audio file loaded", this.player.loaded);
},
},
created() {
this.initializePlayer();
},
};
</script>
我加载的声音位于正确的位置sound/rain.wav,如果我在chrome中输入其路径http://localhost:5173/sounds/rain.wav x1c 0d1x,浏览器能够正确打开它
我从运行应用程序中获得的输出:
有人能用Tone.js的知识帮助我让播放器播放一个单一的文件吗?我花了一整天的时间在这上面,甚至从事与GPT 4,但我得到了同样的问题,播放器是无法播放一个简单的文件.
1条答案
按热度按时间qpgpyjmq1#
我猜发生错误是因为
Player
还没有完成音频的下载。构造函数不返回promise。如果你想等待
Player
准备好,你需要传递一个onload
函数。它可以用来等待Player
准备好,方法是将它 Package 在promise中。