服务器响应状态为 404（未找到）答案

【问题标题】：The server responded with a status of 404 (Not Found)服务器响应状态为 404（未找到）
【发布时间】：2018-06-30 00:30:51
【问题描述】：

我正在尝试在另一个 HTML 文件中的一个 JavaScript 文件中实例化一个类，但我不断收到此错误。

这是 JavaScript 文件的代码：

class Puzzle {
  constructor(fenStart, pgnEnd) {
    this.fenStart = fenStart;
    this.pgnEnd = pgnEnd;
  }
}

这是 HTML 的代码。需要注意的是，我也在使用 chessboard.js 和 chess.js，并且所有内容都保存在同一个文件夹中。

<!DOCTYPE html>
<html>
  <head>
    <title>Chess</title>
    <base href="http://chessboardjs.com/" />
  <link rel="stylesheet" href="css/chessboard.css" />
  </head>
  <body>
  <script src="js/chess.js"></script>
  <div id="board" style="width: 400px"></div>
  <p>PGN: <span id="pgn"></span></p>
  <script src="js/json3.min.js"></script>
  <script src="js/jquery-1.10.1.min.js"></script>
  <script src="js/chessboard.js"></script>
  <script src="class.js"></script>

    <script>
      var pgnEl = $('#pgn');

      const x = new Puzzle("test", "test");

      pgnEl.html(x.fenStart);
    </script>
  </body>
</html>

是什么导致了这个错误，我该如何解决？

【问题讨论】：

路径应该是js/class.js吗？
您缺少起始标签
更改为 'js/class.js' 并添加了起始正文标记，但错误仍然存在

标签： javascript html http-status-code-404

【解决方案1】：

这可能是文件位置不正确造成的，例如 @sideroxylon 所说的 js/class.js 而不是 class.js。

“HTML <base> 标记用于指定相对链接的基本 URI 或 URL。” https://www.tutorialspoint.com/html/html_base_tag.htm这可能是您的文件无法访问的另一个原因。

也可能来自某些 URL 被阻止。尝试打开开发者控制台（CTRL-SHIFT-I 或 F12）并查找页面上的任何错误。

如果您通过 HTTPS 加载来自 HTTP 源的任何内容，则可能会被阻止。这是您的确切代码（使用每个库的在线版本），但 class.js 文件作为常规脚本标记加载并包括起始 <body> 标记。 https://jsfiddle.net/ckazwozg/ 正如您应该看到的，它运行良好。

编辑：为方便起见，这里是来自 JSFiddle 的原始源代码。

<!DOCTYPE html>
<html>
  <head>
    <title>Chess</title>
  <link rel="stylesheet" href="https://rawgit.com/oakmac/chessboardjs/master/src/chessboard.css" />
  </head>
  <body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/chess.js/0.10.2/chess.js"></script>
  <div id="board" style="width: 400px"></div>
  <p>PGN: <span id="pgn"></span></p>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/json3/3.3.2/json3.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://rawgit.com/oakmac/chessboardjs/master/src/chessboard.js"></script>
  <script>
  // class.js
  class Puzzle {
    constructor(fenStart, pgnEnd) {
        this.fenStart = fenStart;
        this.pgnEnd = pgnEnd;
    }
    }
  </script>

    <script>
      var pgnEl = $('#pgn');

      const x = new Puzzle("test", "test");

      pgnEl.html(x.fenStart);
    </script>
  </body>
</html>

【讨论】：

感谢您的回复！我尝试将其从“class.js”更改为“js/class.js”，但错误仍然存在。开发者控制台中的错误是“加载资源失败：服务器响应状态为 404（未找到）”和“未捕获的 ReferenceError：未定义拼图”。
表示找不到“class.js”。资源的位置不正确或资源不存在。首先验证“class.js”相对于您的 index.html 文件的位置，然后输入有关其位置的正确信息。
我创建了一个新文件夹，其中复制了 chessboard.js 和 chess.js 文件。然后我在其中创建了一个新的class.js 文件，并使用上面显示的代码创建了一个index.html 文件。但是，前面提到的错误仍然存在。这是文件夹的截图：link
index.html 应该能够获取“class.js”，文件的 src 只是“class.js”
我把它改回class.js 但是这两个errors 仍然出现

【解决方案2】：

我遇到了同样的错误，但是我所做的是确保我的所有文件都保存到根文件夹中给它 javascript 扩展名 (.js) 后的文件名，例如..

【讨论】：