プログラミング

Express ルーティングの基本

Expressを使用したブログ作成 (第2部): Expressにおけるルーティングの設定

Expressは、Node.js環境で動作する柔軟で軽量なWebアプリケーションフレームワークです。この記事では、Expressを使用してブログを作成する過程の2回目として、ルーティングの設定について詳しく説明します。前回の記事では、基本的なExpressアプリケーションのセットアップを行いましたが、今回はルーティングの設定と、どのようにしてリクエストに対するレスポンスを適切に処理するかを学びます。

ルーティングの基本概念

ルーティングは、ユーザーのリクエストに対してどの処理を行うかを決定する仕組みです。Expressでは、app.get(), app.post(), app.put(), app.delete()などのメソッドを使用して、特定のHTTPメソッドに基づいたルート(経路)を設定できます。

例えば、ユーザーが「/home」や「/about」のようなURLを訪れた際に、どのような処理を行うかを指定します。これをルーティングと呼びます。

ルーティングの設定

Expressでルーティングを設定する方法を具体的に見ていきましょう。

1. 単一のルート

まず、単一のルートを設定してみましょう。以下のコードは、/(ホームページ)へのGETリクエストに対するレスポンスを処理します。

javascript
const express = require('express'); const app = express(); // ホームページへのルート app.get('/', (req, res) => { res.send('ブログへようこそ!'); }); // サーバーの起動 app.listen(3000, () => { console.log('サーバーがポート3000で稼働中...'); });

このコードは、ユーザーがhttp://localhost:3000にアクセスすると、「ブログへようこそ!」というメッセージが表示されるという単純なルーティングです。

2. パラメータを使用したルート

次に、URLパラメータを使用したルートを設定してみましょう。URLパラメータを利用すると、動的に異なる情報を扱うことができます。例えば、ユーザーが特定の記事にアクセスする場合、記事IDをURLに含めてリクエストできます。

javascript
// 記事ページへのルート app.get('/post/:id', (req, res) => { const postId = req.params.id; res.send(`この記事のIDは ${postId} です`); });

ここでは、/post/1/post/2のように、idが動的に変化するルートを設定しています。req.params.idを使って、指定された記事のIDを取得し、それに基づいた処理を行います。

3. クエリパラメータを使用したルート

URLのクエリパラメータを使用することで、リクエストに対して追加の情報を送信できます。例えば、ユーザーが検索を行う際に、クエリパラメータを使って検索キーワードを渡すことができます。

javascript
// 検索結果ページへのルート app.get('/search', (req, res) => { const query = req.query.q; res.send(`検索キーワード: ${query}`); });

この例では、/search?q=expressのように検索キーワードをクエリパラメータqとして渡すことができます。req.query.qでその値を取得し、レスポンスに表示します。

ルートのグループ化

Expressでは、ルートをグループ化して、より整理された構造にすることができます。例えば、/postsというベースURLの下に、複数のルートをまとめることができます。

javascript
const postRouter = express.Router(); // 記事の一覧を表示するルート postRouter.get('/', (req, res) => { res.send('記事の一覧'); }); // 特定の記事を表示するルート postRouter.get('/:id', (req, res) => { const postId = req.params.id; res.send(`記事ID: ${postId}`); }); // ベースURLにpostRouterをマウント app.use('/posts', postRouter);

このように、/postsに関連するルートをpostRouterにまとめて、app.use('/posts', postRouter)でアプリケーションにマウントしています。これにより、/posts以下のすべてのリクエストをまとめて処理できます。

ミドルウェアを使用したルート処理

Expressでは、リクエストが処理される前に実行される「ミドルウェア」を設定することができます。ミドルウェアは、リクエストオブジェクトやレスポンスオブジェクトに対して操作を行い、次の処理へと渡す役割を果たします。

javascript
// ミドルウェアの設定 app.use((req, res, next) => { console.log('リクエストが来ました'); next(); // 次の処理に進む }); // ルート設定 app.get('/', (req, res) => { res.send('ホームページ'); });

上記の例では、app.use()でリクエストが来るたびに「リクエストが来ました」というメッセージをコンソールに出力しています。このように、ミドルウェアを利用することで、リクエストの前処理や共通処理をまとめて行うことができます。

まとめ

Expressにおけるルーティングは非常に直感的であり、URLに基づいて適切な処理を行う方法を提供します。単純なGETリクエストから、パラメータやクエリを使った動的なルート設定まで、さまざまな方法でリクエストを処理できます。また、ルートのグループ化やミドルウェアの活用により、より高度なアプリケーション構造を作成することも可能です。

次回は、Expressでのデータベースの操作方法や、データを使った動的なコンテンツの表示について詳しく学びます。

Back to top button