0

我正在构建我的第一个 Node.js MVC 应用程序(本机节点,不使用 Express),并且无法通过相对路径显示来自我的 html 文件的图像。

我将为您省去我的 server.js 和 router.js 代码,但这是我的控制器代码,它基本上是我加载视图的方式:

var fs = require("fs");
var controller = require("controller"); 

var load_view = 'view_home';
var context = { foo : 'bar' };

controller.load_view(res, req, fs, load_view, context);

这被传递给...

var url         = require('url');
var Handlebars  = require('handlebars');

function load_view(res, req, fs, view, context, session){

    // Files to be loaded, in order
    var files = [
        'view/elements/head.html',
        'view/elements/header.html',
        'view/' + view +'.html',
        'view/elements/footer.html'
    ];      

    // Start read requests, each with a callback that has an extra
    // argument bound to it so it will be unshifted onto the callback's
    // parameter list
    for(var i=0; i<files.length; ++i) 
        fs.readFile(files[i], handler.bind(null, i));

    var count = 0;

    function handler(index, err, content) {

        // Make sure we don't send more than one response on error
        if(count < 0) return;
        if(err) {
            count = -1;
            console.log('Error for file: ' + files[index]);
            console.log(err);
            res.writeHead(500);
            return res.end();
        }

        // Reuse our `files` array by simply replacing filenames with
        // their respective content
        files[index] = content;


        // Check if we've read all the files and write them in order if
        // we are finished
        if(++count===files.length) {
            res.writeHead(200, { 'Content-Type': 'text/html' });
            for(var i = 0; i < files.length; ++i) {

                var source = files[i].toString('utf8');

                // Handlebars
                var template = Handlebars.compile(source);
                var html = template(context);   

                res.write(html); /* WRITE THE VIEW (FINALLY) */

            }
            res.end();
        }

    } // handler()

} // load()

最后,这是我的 src 属性中带有标签和相对路径的 html:

<div class="help">

    <img src="../public/img/test.jpg" />

</div>

与上述相关的我的文件系统如下:

我确定相对​​路径是正确的,但尝试了相对路径甚至绝对路径的所有组合。仍然没有显示图像。

来自 LAMP 背景,访问文件树中的图像是微不足道的,但我意识到这里的服务器设置有很大不同(因为我是设置它的人)。

我通过创建一个单独的控制器来显式加载这些文件并使用 URI 访问该控制器来访问文件系统中的其他文件(如样式表)。但是这种方法对于不确定数量的图像是不切实际的。

如何使用 Node.js 在文件系统中访问和显示我的图像?

4

1 回答 1

2

我通过创建一个单独的控制器来显式加载这些文件并使用 URI 访问该控制器来访问文件系统中的其他文件(如样式表)。

你需要有一个控制器。这就是代码如何将浏览器请求的 URL 转换为响应的方式。

但是这种方法对于不确定数量的图像是不切实际的。

那就写一个通用的吧。将所有与另一个控制器不匹配的 URL,或以特定路径开头,或以 结尾.jpg,或任何您喜欢的逻辑的 URL 转换为基于 URL 的文件路径。

读取文件的内容并输出合适的 HTTP 标头(包括正确的内容类型),然后是数据。

于 2016-11-16T23:21:55.150 回答