Express.jsを使用してシングルページアプリケーションのルートを正しく設定するにはどうすればよいですか？

Question

私はExpress.jsを使用して単一のページアプリケーションを構築しようとしています。私のindex.htmlページには、基本的なフォームがあります。このフォームは、送信時にAPIにリクエストしてデータを取得し、解析した後、解析されたデータをリンクのリストとしてレンダリングします。今ではインデックスページをレンダリングすることができ、ページに追加したフォームからAPIへのサブミットコールを行うことができます。私が混乱しているのは、API呼び出しから取得したデータを適切にリダイレクトして、同じページにレンダリングする方法です。私は、複数のビューが存在する前にExpressを使用してシンプルなアプリケーションを構築しましたが、1つのページアプリではありません。これらのアプリケーションでは、レスポンスのためにres.render（「レンダリングするビューの名前」、データ）を呼び出すことができますが、この場合は機能しません。私はこのサイトとExpressドキュメントを使っていくつかのソリューションを見つけようとしましたが、Angularのような別のフレームワークを使用していないものは見ていません。このアプリの目的のために、私は追加のフレームワークを含める必要はなく、私は少し失われています。

APIを呼び出すための私の関数は、今のところこのようになります。それが呼び出されると、私はちょうどあなたがしなければならない基本的なことがある

app.use(express.static(path.join(__dirname, '/public'))); 
app.use(bodyParser.urlencoded({ extended: false })); 
app.use(bodyParser.json()); 

app.use('/', express.static(path.join(__dirname, 'public'))); 

app.get('/search', function(req, res) { 
    var title = req.query.movieTitle; 
    var url = 'http://www.omdbapi.com/?s=' + title; 

    request(url, function (err, response, body) { 
    var results = JSON.parse(body); 
    var movieTitles = results.Search; 
    console.log(movieTitles); 
    res.send(movieTitles); 
    }); 
}); 

Answer 1

表示JSONを持っているページに移動しています：

• は、バックエンドアプリケーションが応答しているルートを定義スパで
• はそのルート上の応答にあなたの「スケルトン」ファイルを送信

例コード：

let handler = (req, res) => res.send(path.join(__dirname, "path/to/your/index.html")) 

let routes = ["/", "/hello", "/world"] 

routes.forEach(route => app.get(route, handler)) 

これはあなたが始めるはずです