当javascript移至外部文件时，文件不起作用

Question

我正在尝试socket.io并下载了它的GitHub 项目 。

它工作正常，但是当我尝试将内联js代码移动到外部文件时，它停止工作。 为什么会这样？ 我做错了什么？

在其index.html文件中，它具有：

<script src="/socket.io/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script>
  $(function () {
    var socket = io();
    $('form').submit(function(e){
      e.preventDefault(); // prevents page reloading
      socket.emit('chat message', $('#m').val());
      $('#m').val('');
      return false;
    });
  });
</script>

我试图将内联代码移至外部js文件。 我在“ script”标记之间复制了所有内容，并将其放入名为“ chat.js”的文件中。 index.html文件和chat.js处于同一级别。

因此，现在html文件中的相同部分如下所示：

<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script src="chat.js" charset="utf-8"></script>

chat.js文件如下所示：

$(function () {
    var socket = io();
    $('form').submit(function(e){
      e.preventDefault(); // prevents page reloading
      socket.emit('chat message', $('#m').val());
      $('#m').val('');
      return false;
    });
  });

Answer 1

根据讨论，您必须将以下内容添加到index.js中才能在Express中提供静态文件。

var app = require('express')();
var http = require('http').createServer(app);
var io = require('socket.io')(http);

app.use(require('express').static(__dirname)); // Add this to serve static files

否则，它将无法找到chat.js在哪里，从而得到404错误。

您可以在此处了解更多信息。