静的 HTML を使用した Node + Express。すべてのリクエストを index.html にルーティングするにはどうすればよいでしょうか? 質問する

静的 HTML を使用した Node + Express。すべてのリクエストを index.html にルーティングするにはどうすればよいでしょうか? 質問する

私は、テンプレートに Node + Express と Handlebars を使用して、シングル ページ Web アプリを開発しています。現在、index.html からはすべて正常に動作しており、これは標準的な server.js ファイルから提供されています。

var express = require('express');

var server = express();
server.use(express.static(__dirname + '/public'));

var port = 10001;
server.listen(port, function() {
    console.log('server listening on port ' + port);
});

これは、 から読み込むときに完璧に機能しますhttp://localhost:10001/。私の問題は、アプリでプッシュ状態を使用しているため、ブラウザに のような URL が表示され、ページを更新すると、これにはルートがないためhttp://localhost:10001/foo/barエラーが発生することです。Cannot GET /foo/bar

そこで質問なのですが、Node に関しては私の信じられないほどの初心者ぶりをお許しください。すべてのリクエストを index.html にルーティングするようにできますか? 私のアプリの JavaScript は、ページの読み込み時に URL パラメータに基づいて適切なコンテンツを表示できます。カスタム ルートは数が多くなり、パスが動的に変更される可能性があるため、定義したくありません。

ベストアンサー1

const express = require('express')
const server = express()

/* route requests for static files to appropriate directory */
server.use('/public', express.static(__dirname + '/static-files-dir'))

/* other routes defined before catch-all */
server.get('/some-route', (req, res) => {
  res.send('ok')
})

/* final catch-all route to index.html defined last */
server.get('/*', (req, res) => {
  res.sendFile(__dirname + '/index.html');
})

const port = 8000;
server.listen(port, function() {
  console.log('server listening on port ' + port)
})

おすすめ記事