在我的应用程序中,我使用了 Node.js、React 和 Express。我想从我的光盘目录加载图片。 假设我要加载的文件位于//localhost:3000/images/own/
(当我输入 ex.//localhost:3000/images/own/my_pic.jpg 浏览器返回特定图片时)
我以前用 ajax 调用来做到这一点:
$.ajax({
url: '/images/own',
dataType: 'text',
success: function (data){
//some actions here
}
});
但现在我收到 404 错误 'GET http://localhost:3000/images/own/ 404(未找到)'。
我知道用 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 返回空表。
我应该以不同的方式给出目录路径还是有任何其他方式来加载文件?我是 Node 的新手,所以任何帮助将不胜感激。
最佳答案
从你的问题和评论来看,我认为你混淆了前端和后端代码。
尽管两者都是用 Javascript 编写的,但前端(浏览器)代码对其施加了更多限制。此类限制之一是读取文件或目录的能力。这解释了为什么您不能使用 fs
。
此外,require()
不是 Javascript(如 “语言的一部分”)命令,而是 Node(= 后端)提供的用于加载模块的东西.因此,您也不能(直接)在浏览器中使用它。
有一些方法可以编写针对浏览器的类似 Node 的代码,其中对 require()
的调用会被翻译成浏览器可以理解的内容。一种这样的方式是 browserify
.但是,这仍然不允许您在浏览器中运行特定的后端功能(换句话说,require('fs')
不会被转换成任何有用的东西)。
现在,回到您的实际问题:如果您想读取服务器上包含图像文件的目录,并从中构建一个图片库,您需要在服务器上执行目录读取。
它可以像这样工作:
- 您的前端代码将查询服务器(例如使用 AJAX 调用);
- 服务端读取目录内容,适当格式化(比如JSON格式),返回给前端;
- 前端获取数据并动态生成图库。
关于javascript - 带有 express 和 react 的 Node.js,fs.readdir 找不到文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34535550/