29

私は隕石で鉄のルーターを使い始めました。ホームページに画像を表示する必要があります。クライアント側のルーティングを使用して「ホーム」のルートを構成できました。静的ファイルについては、グーグルで検索したところ、サーバー側のルートを追加すると役立つことがわかりました。そこで、サーバーの router.js に以下のコードを追加しました。

Router.map(function() {
    this.route('files', {
        path: '/files/:path(*)',
        action: function() {
            var path = this.params.path;

            console.log('will serve static content @ '+path);
            this.response.sendfile(path);
        }
    });
});

にアクセスしようとするとhttp://localhost:3000/files/someImage.png、 にルートが定義されていませんと表示され/files/someImage.pngます。私は何か間違ったことをしていますか？Iron Router を使用して静的ファイルを提供する他の方法はありますか?

4

3 に答える 3

61

これをすべて行う代わりに、ファイルをディレクトリの下に置くことができますpublic。ファイルを追加する場合:

myApp/public/images/kitten.png

次のようなテンプレートからアクセスできます。

<img src="/images/kitten.png">

それを機能させるためにルートは必要ありません。

リードスラッシュの見落としにご注意ください。

<img src="images/kitten.png">

上記の例は /books のようなトップ レベルのルートから機能するため、簡単に見逃してしまいますが、/books/pages では失敗します。

于 2014-01-24T19:57:51.657 に答える
5

おそらく、ルートがクライアントとサーバーの両方で表示される共通領域にあることを確認し (このルートは実際にはサーバー上で実行されます)、指定する必要があるだけwhere: 'server'です。さらに、ディスクから実際のファイルをロードする必要があります。つまり、ファイルへのサーバー上の実際のパスが必要であり、「fs」をロードする必要があります。

var fs = Npm.require('fs');

Router.map(function() {
  this.route('files', {
    path: '/files/:path(*)',
    where: 'server',
    action: function() {
        var path = this.params.path;
        var basedir = '~/app/';

        console.log('will serve static content @ '+ path);

        var file = fs.readFileSync(basedir + path);

      var headers = {
        'Content-type': 'image/png',
        'Content-Disposition': "attachment; filename=" + path
      };

      this.response.writeHead(200, headers);
      return this.response.end(file);
    }
  });
});

いくつかの注意事項: おそらく、実際のダウンロード コードをサーバーのみの関数に移動し、代わりにそれを呼び出して、関数に応答を渡す必要があります。

また、サーバー上のファイルを任意にダウンロードすることを許可しないように、パスの検証も行う必要があります。

さらに、これはコンテンツ タイプを明示的に設定しています。これは、おそらく画像に対しては行いたいと思うでしょうが、他のコンテンツ タイプに対してはそうではないかもしれません。ジェネリック型の場合は、次のように設定できますapplication/octet-stream

もちろん、前述したように、展開時に静的コンテンツを利用できるようにすることが唯一の目的である場合は、/publicディレクトリを使用する必要があります。

于 2014-07-17T22:10:48.443 に答える