2016-05-27 1 views
0

ページが読み込まれたときに曲を自動再生するHTMLページがあります(曲ファイルは.mp3)。私はそれを私のMac上のファイルとして開くと、その曲を再生しますが、node.jsファイルでsocket.ioを実行すると、まったく再生されません。サーバーではHTMLファイルではないが、HTMLファイルではない場合、HTMLオーディオファイルエラー404 - Node.js

コンソールでのエラーメッセージ: "リソースの読み込みに失敗しました:サーバーは、404の状態で応答(見つかりません)"

(スタイルタグなし)HTML

<!doctype html> 
<html> 
    <head> 
     <title>Lucas Chat</title> 
    </head> 
    <body> 
     <div id="top"> 
      <h1>Welcome to the chat!</h1> 
      <audio autoplay> 
       <source src="onedance.ogg" type="audio/ogg"> 
      </audio> 
      <br> 
      <p> 
       Enter in a nickname and a message to get started 
      </p> 
      <br> 
      <p id="drop"> 
       Scroll up or down to view newer/older messages 
      </p> 
     </div> 
     <ul id="messages"></ul> 
     <form action=""> 
      <input id="u" autocomplete="off" placeholder="Nickname"/> 
      <input id="m" autocomplete="off" placeholder="Message"/> 
      <button> 
       Send 
      </button> 
     </form> 
     <script src="https://cdn.socket.io/socket.io-1.2.0.js"></script> 
     <script src="http://code.jquery.com/jquery-1.11.1.js"></script> 
     <script> 
      var socket = io(); 
      $('form').submit(function() { 
       var username = "<span style='font-weight:600;color:#006cff;font-size:18px;'>" + $('#u').val() + "</span>"; 
       var message = "<span style='color:#000000;'>" + $('#m').val() + "</span>"; 
       if ($('#m').val() != '' && $('#u').val() != '') { 
        socket.emit('send message', { 
         msg : message, 
         user : username 
        }); 
        $('#u').css("display", "none"); 
        $('#m').css("width", "90%"); 
        $("#u").css("box-shadow", "0px 0px 0px rgba(0, 0, 0, 0)"); 
        $("#m").css("box-shadow", "0px 0px 0px rgba(0, 0, 0, 0)"); 
        $('#m').val(''); 

       } else if ($('#u').val() === '' && $('#m').val() === '') { 
        $("#u").css("box-shadow", "0px 0px 15px #ff8989"); 
        $("#m").css("box-shadow", "0px 0px 15px #ff8989"); 
       } else if ($('#u').val() === '' && $('#m').val() != '') { 
        $("#u").css("box-shadow", "0px 0px 15px #ff8989"); 
        $("#m").css("box-shadow", "0px 0px 0px rgba(0, 0, 0, 0)"); 
       } else if ($('#m').val() === '' && $('#u').val() != '') { 
        $("#m").css("box-shadow", "0px 0px 15px #ff8989"); 
        $("#u").css("box-shadow", "0px 0px 0px rgba(0, 0, 0, 0)"); 
       } 
       return false; 
      }); 
      socket.on('receive message', function(msg) { 
       $('#messages').append($('<li>').html(msg)); 
      }); 
     </script> 

    </body> 
</html> 

JS

var app = require('express')(); 
var http = require('http').Server(app); 
var io = require('socket.io')(http); 
var peopleCount = 0; 
app.get('/', function(req, res) { 
    res.sendFile(__dirname + '/index.html'); 
}); 
io.on('connection', function(socket) { 
    peopleCount++; 
    console.log('a user connected | connections: ' + peopleCount); 
    socket.on('disconnect', function() { 
     peopleCount--; 
     console.log('a user disconnected | connections: ' + peopleCount); 
    }); 
}); 
io.on('connection', function(socket) { 
    socket.on('send message', function(data) { 
     io.emit('receive message', data.user + ': ' + data.msg); 
    }); 
}); 
http.listen(3000, function() { 
    console.log('listening on *:3000'); 
}); 
+0

エラーが発生すると、ローカルシステムには 'onedance.ogg'がありますが、サーバ上には存在していないようです。オーディオファイルがサーバーとパスで指定された場所に存在していますか? – user2570380

答えて

1

まだ静的ファイルを提供していないと思います。あなたは

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

ような何かどこでもあなたのapp.jsで

あなた.OGGファイルは/静的/にする必要がありますが必要と表現します。

+0

私はその行を自分のコードにどこに入れますか? – Lxs29

+0

これはあなたのapp.jsのどこにでもあるはずです http://expressjs.com/en/starter/static-files.html – faster

関連する問題