JS 文件得到一个 net::ERR_ABORTED 404 (Not Found)

Posted 2023-03-15

【中文标题】JS 文件得到一个 net::ERR_ABORTED 404 (Not Found)

【英文标题】：JS file gets a net::ERR_ABORTED 404 (Not Found)

【发布时间】：2019-06-07 23:12:15

【问题描述】：

我正在尝试创建一个简单的 Io-web-chat。 我最近想将我的 html 文件中的 <script> 分离到一个外部 js 文件中。

这是我非常简单的文件夹结构：

Chat
|-- index.html
|-- index.js
`-- server.js

html文件的相关部分：

<script src="/socket.io/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script src="index.js"></script>
</body>
</html>

index.js 文件的相关部分：

$(function() 

  //Initialize variables
  var $messageArea = $('#messages');
  var $InputMessage = $('#InputMessage');
  var $InputName = $('#InputName');

  //Initialize Socket
  var socket = io();

  //Send server Your message
  socket.emit('chat message', $InputMessage.val());

);

server.js 文件的相关部分：

app.get('/', function(req, res)
  res.sendFile(__dirname + '/index.html');
);

我还尝试将我的文件放在他们在 socket.io 示例中的这种公共类型结构中：

Chat
|-- Public
|   |-- index.html
|   `-- index.js
`-- server.js

在那种情况下，我改变了： src="/index.js" 在 html 中 将/public/index.html 添加到 server.js 文件中 但没有运气。

这一切都在 localhost 中运行。 我在这里做错了什么？

【问题讨论】：

您是否有反向代理，例如 Apache 或 nginx？如果没有，你就没有任何服务于“index.js”文件的东西：没有反向代理，没有路由，什么都没有。看看使用 express.static() 在开发模式下提供静态文件，并最终在生产模式下使用 Nginx。

“服务 index.js 文件”到底是什么意思？我不认为我有代理，我只是用“节点服务器”运行本地主机。正如你所说的apache，这是否意味着我在开发时需要一个始终运行的专用服务器？那么我应该在 apache 下的 xampp 上使用整个演出吗？

查看您如何在“/”路由中发送“index.html”文件？好吧，您的 .js 文件也不例外：您还需要以某种方式发送它。我将起草一个不涉及安装 Apache 或 Nginx 的快速答案。

【参考方案1】：

正如 cmets 中提到的：您需要一种将静态文件发送到客户端的方法。这可以通过像 Nginx 这样的反向代理来实现，或者简单地使用express.static()。

将所有“静态”（css、js、图像）文件放在专用的文件夹中，与放置“视图”（在您的情况下为 html 文件）的位置不同。例如，我将其称为static。完成后，在您的服务器代码中添加这一行：

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

这将通过 /static 路由有效地为您的“静态”文件夹中的每个文件提供服务。

在客户端查询你的 index.js 文件就变成了：

<script src="static/index.js"></script>

【讨论】：

所以我添加了 'var express = require('express'); var app = express(); app.use('/static', express.static('./static/')); '

“Cannot GET /”也显示在Dom上

我假设你已经在使用你的符号 app.get("/ 的 express，如果不是 express 对象，那么在这种情况下“app”指的是什么？

好吧，我仍然以这种方式使用 express -> "var app = require('express')();"按照socketsio页面上的说明。另外，我注意到我之前提到的错误是“语法上”我的扩展错误。我禁用了它，但我仍然只在 DOM 错误中得到“无法获取 /”

等一下，它首先应该如何访问 Html 文件？我将它路由到静态文件夹，但我的 html 保持不变。 .哈扎！！我错过了你的帖子！我不得不“..添加这一行..”没有完全摆脱我最后的代码..问题解决了！

【参考方案2】：

我有一个类似的问题，通过在我的代码中省略前导斜杠得到了解决。例如。将/js/script.js 替换为js/script.js。