Javascript html文件找不到上载目录_Javascript_Jquery_Html_Node.js

Javascript html文件找不到上载目录

javascript jquery html node.js

Javascript html文件找不到上载目录,javascript,jquery,html,node.js,Javascript,Jquery,Html,Node.js,我有一个html文件，应该显示uploads目录中的每个图片，但是它不能识别uploads目录。我正在使用nodejs服务器。这是我的html文件： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content

我有一个html文件，应该显示uploads目录中的每个图片，但是它不能识别uploads目录。我正在使用nodejs服务器。这是我的html文件：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>gummy bear</title>
  <link href='https://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <link href="css/styles.css" rel="stylesheet">
</head>
<body>

  <script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
  <script>
  var dir = "/uploads/";
  var fileextension = ".jpg";
  $.ajax({
      url: dir,
      success: function (data) {
          $(data).find("a:contains(" + fileextension + ")").each(function () {
              var filename = this.href.replace(window.location.host, "").replace("http://", "");
              $("body").append("<img src='" + dir + filename + "'>");
          });
      }
  });
  </script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</body>
</html>

上传内容包括：

➜  uploads ls
1.jpg

提前谢谢

查看示例代码，HTML文件似乎希望从中返回一些HTMLhttp://localhost:3000/uploads.

问题是为什么/uploads端点不返回任何内容，而是返回404响应

答案在于node.js应用程序中的主可执行Javascript文件。可能是一个名为server.js或index.js的文件

下面是一个示例，说明如何为HTML文件创建正确的node.js应用程序：

server.js

这段代码迭代uploads目录中的所有文件，并将它们包装在a标记中，然后由服务器返回

index.html

要使索引HTML文件正常工作，需要进行一些小更改：

将$data.find更改为$data.filter 从映像源中删除该目录。改为完整工作样本

您也可以在这里找到完整的工作示例：

我不知道node.js，但我认为您不能只向目录发送请求。必须有一个脚本返回文件。node.js中有fs模块。当您自己在浏览器中打开该url时会发生什么？很抱歉，我不明白，是什么url？@DennisKoch您的假设是正确的，jQuery的ajax函数需要用于调用脚本以返回数据（如果有的话）。查看有关函数的文档。查看以下问题：非常感谢！这无疑是有人给过我的最好的答案。非常感谢你的帮助！

➜  uploads ls
1.jpg

app.all('/uploads', function (req, res) {
    var folder = './public/uploads',
        html = '<html><body>##files##</body></html>';

    fs.readdir(folder, (err, files) => {
        var fileHrefs = '';

        files.forEach(function (file) {
            fileHrefs += '<a href="http://localhost:3000/uploads/' + file + '">' + file + '</a>';
        });

        html = html.replace('##files##', fileHrefs);

        res.send(err || html);
    })
});