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 に基づくファイル パスに変換します。

ファイルのコンテンツを読み取り、適切な HTTP ヘッダー (適切なコンテンツ タイプを含む) とそれに続くデータを出力します。

于 2016-11-16T23:21:55.150 に答える