Node.js 使用 express 和 react，fs.readdir 找不到文件

Question

在我的应用程序中，我使用 Node.js、React 和 Express。我想从我的光盘目录加载图片。假设我要加载的文件位于 //localhost:3000/images/own/

（当我键入 ex. //localhost:3000/images/own/my_pic.jpg 浏览器 returns 某些图片时）

我以前是用 ajax 调用的：

$.ajax({
        url: '/images/own',
        dataType: 'text',
        success: function (data){
         //some actions here
        }
 });

但现在我收到 404 错误 'GET http://localhost:3000/images/own/ 404 (Not Found)'。

我知道用 node 加载文件通常是用 fs 完成的，但是由于我的脚本是用 babel 编写的（React 需要）我不能使用 require('fs')。我找到了可以使用的 https://github.com/OptimalBits/fs.js（通过将其包含在我的 html 文件中），但是在示例中使用它时：

FSFactory(1024*1024, 'images/own', function(err, fs){
        if(err){
            console.log(err);
        }

        fs.readdir('/', function(err, entries){
            if(err)
                console.log(err);

            console.log(entries);

        });
    });

fs 对象为空且 readdir returns 为空 table.

我应该以不同的方式给出目录路径还是有其他方式来加载文件？我是节点的新手，所以任何帮助将不胜感激。

Answer 1

使用 express 时，您可以告诉 express 您有一个目录需要通过 http(s) 直接访问。

例如，如果您的 public 文件有一个 public 目录，您可以这样 "visible" ：

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

因此，如果您有文件 public/images/own/my_pic.jpg，可以通过 http://localhost:3000/images/own/my_pic.jpg

访问它

唯一需要注意的是，您没有在 http://localhost:3000/images/own 上列出文件 - 您需要确切地知道您需要哪些文件。

Answer 2

从你的问题和评论来看，我认为你混淆了前端和后端代码。

尽管两者都是用 Javascript 编写的，但前端（浏览器）代码对其施加了更多限制。此类限制之一是读取文件或目录的能力。这解释了为什么你不能使用 fs.

此外，require() 不是 Javascript（如 "part of the language"）命令，而是 Node（= 后端）提供的东西加载模块。因此，您也不能（直接）在浏览器中使用它。

有多种方法可以编写针对浏览器的 Node-like 代码，其中对 require() 的调用会被翻译成浏览器可以理解的内容。一种这样的方式是 browserify。但是，这仍然不允许您在浏览器中运行特定的后端功能（换句话说，require('fs') 不会被转换成任何有用的东西）。

现在，回到您的实际问题：如果您想读取服务器上包含图像文件的目录，并从中构建一个图片库，您需要在您的服务器上执行 directory-reading服务器。

它可以像这样工作：

您的前端代码将查询服务器（例如，使用 AJAX 调用）；
服务器读取目录内容，正确格式化它们（例如，JSON），returns它们到前端；
前端获取数据并动态生成图库。

Node.js 使用 express 和 react，fs.readdir 找不到文件

Node.js with express and react, fs.readdir can't find files

javascript

fs

node.js

express

babeljs