從 socket.io 收到消息時從客戶端播放音頻 - node.js

Question

我已經搜索了一段時間以尋找解決此問題的方法，但沒有找到太多。

我的目標是從 udp 客戶端接收消息，服務器接收該消息並將其轉發到 Web 客戶端，該客戶端在每次收到消息時播放音頻剪輯。 但是，由於某種原因，音頻將無法播放。 如果我直接從我的目錄打開頁面，可以播放音頻，但如果我嘗試通過 localhost 訪問它，則無法加載。 有誰知道解決方案？

這是客戶端javascript。

var mySound = new Audio('/public/audio/Bloom.mp3');
mySound.load();
var socket = io.connect('http://localhost');
socket.on('message', function(data){
    console.log(data);
    $('#content').text(data);
    mySound.play();
    //document.getElementById('audiotag1').play();
});

該頁面由 server.js 提供，這是一個使用 socket.io 和 express 的 node.js 文件。 我的 console.log 沒有收到任何錯誤。 這是 server.js

var app = require('express')()
    , server = require('http').Server(app)
    , io =require('socket.io')(server)
    , dgram = require('dgram');

var httpPort = 1234;
var udpPort = 5000;

server.listen(httpPort);

app.use(server.express.static( __dirname + '/public'));

app.get('/', function(request, response){
    var ipAddress = request.socket.remoteAddress;
    console.log("New express connection from: " + ipAddress);
    response.sendfile(__dirname + '/public/index.html');
});

var udpSocket = dgram.createSocket('udp4', function(msgBuffer){
    var jsonMessage = JSON.parse(msgBuffer);
    io.sockets.emit('message', JSON.stringify(jsonMessage));
});
udpSocket.bind(udpPort, '127.0.0.1');

您可以轉到此鏈接查看 chrome 的錯誤。 http://postimg.org/image/xkv7a2kwb/

有沒有人對如何解決這個問題有任何想法？

Answer 1

當靜態文件的Express配置不正確時，通常會發生此錯誤。

從您的客戶端JavaScript我可以看到你存儲在您的靜態文件public文件夾。

因此，在服務器端的某處，您應該具有以下內容：

app.use('/public', express.static('/path/to/public'));

這樣一來， http://localhost/public/audio/Bloom.mp3請求將與/path/to/public/audio/Bloom.mp3文件一起提供。

警告：

從Express 4開始， “不再有app.use（app.router）”和“將按照出現的順序添加所有路由方法”。 這意味着您必須將以上代碼行放在第一個app.get(...) ， app.post(...)等之前。

希望此信息對某人有幫助。

Answer 2

我們還可以將音調上傳到雲存儲並使用如下所示的源

playAudio() {
let audio = new Audio()
audio.src ='https://res.cloudinary.com/Apple_Notification.mp3'
audio.load()
audio.play()
 }

每當新消息進來時在客戶端觸發此功能