JavaScript、Node.js、Express を使用してプログラム的に 404 レスポンスを送信する方法

2024-07-27

Express は、Node.js 用の Web アプリケーションフレームワークです。迅速で効率的な Web アプリケーションを構築するために広く使用されています。Express を使用して、さまざまな種類の HTTP レスポンスを送信できます。404 レスポンスは、リクエストされたリソースが見つからない場合に送信される一般的な応答です。

404 レスポンスを送信する手順

Express アプリケーションを作成する

最初に、Express アプリケーションを作成する必要があります。これを行うには、次のコマンドを実行します。

npm init
npm install express

Express アプリケーションを構成するには、app.js または index.js などのファイルを作成し、次のコードを追加します。

const express = require('express');
const app = express();

// ...

app.listen(3000, () => {
  console.log('Server listening on port 3000');
});

404 エラーハンドラーを作成する

404 レスポンスを送信するには、404 エラーハンドラーを作成する必要があります。これを行うには、次のコードを追加します。

app.use((req, res, next) => {
  const err = new Error('Not Found');
  err.status = 404;
  next(err);
});

app.use((err, req, res, next) => {
  if (err.status === 404) {
    res.status(404).send('Not Found');
  } else {
    next(err);
  }
});

このコードは、リクエストされたリソースが見つからない場合に Not Found メッセージを返す 404 エラーハンドラーを作成します。

例

const express = require('express');
const app = express();

app.get('/users/:id', (req, res) => {
  const userId = req.params.id;

  // ユーザーをデータベースから取得する
  const user = getUserById(userId);

  if (!user) {
    // ユーザーが見つからない場合は 404 レスポンスを送信する
    res.status(404).send('User not found');
  } else {
    // ユーザーが見つかった場合はユーザー情報を返す
    res.json(user);
  }
});

app.listen(3000, () => {
  console.log('Server listening on port 3000');
});

この例では、/users/:id エンドポイントに GET リクエストを行うと、ユーザー情報を返します。ユーザーが見つからない場合は、404 レスポンスが送信されます。

JavaScript、Node.js、Express を使用してプログラム的に 404 レスポンスを送信するには、404 エラーハンドラーを作成する必要があります。このエラーハンドラーは、リクエストされたリソースが見つからない場合に適切な応答を返します。

404 エラーハンドラーは、アプリケーションの最後に配置する必要があります。これにより、他のルートハンドラーが最初に実行されます。

const express = require('express');
const app = express();

app.get('/users/:id', (req, res) => {
  const userId = req.params.id;

  // ユーザーをデータベースから取得する
  const user = getUserById(userId);

  if (!user) {
    // ユーザーが見つからない場合は 404 レスポンスを送信する
    res.status(404).send('User not found');
  } else {
    // ユーザーが見つかった場合はユーザー情報を返す
    res.json(user);
  }
});

app.listen(3000, () => {
  console.log('Server listening on port 3000');
});

説明

express モジュールをインポートして、Express アプリケーションを作成します。
app 変数に Express アプリケーションインスタンスを格納します。
app.get('/users/:id', (req, res) => {...}) 行は、/users/:id エンドポイントへの GET リクエストを処理するルートハンドラーを定義します。
req 変数は、リクエストオブジェクトを格納します。このオブジェクトには、リクエストヘッダー、パラメーター、ボディなどの情報が含まれます。
res 変数は、レスポンスオブジェクトを格納します。このオブジェクトを使用して、クライアントにレスポンスを返します。
const userId = req.params.id; 行は、リクエストパラメーター id の値を取得します。
const user = getUserById(userId); 行は、ユーザー ID に基づいてユーザー情報を取得します。
if (!user) { ... } ブロックは、ユーザーが見つからない場合の処理を行います。
res.status(404).send('User not found'); 行は、404 レスポンスを送信し、User not found メッセージを返します。
res.json(user); 行は、ユーザー情報を JSON として返します。
app.listen(3000, () => { ... }); 行は、サーバーをポート 3000 で起動します。

この例は、ユーザー情報をデータベースから取得する関数 getUserById が存在することを想定しています。この関数は、実際のアプリケーションで実装する必要があります。
404 レスポンスの代わりに、カスタムエラーメッセージや HTML ページを返すこともできます。

res.send() 関数は、さまざまな種類のデータをクライアントに送信するために使用できます。404 レスポンスを送信するには、次のように使用できます。

app.get('/users/:id', (req, res) => {
  const userId = req.params.id;

  // ユーザーをデータベースから取得する
  const user = getUserById(userId);

  if (!user) {
    // ユーザーが見つからない場合は 404 レスポンスを送信する
    res.status(404).send('ユーザーが見つかりません');
  } else {
    // ユーザーが見つかった場合はユーザー情報を返す
    res.json(user);
  }
});

この例は、前述の例と同じように動作します。ただし、res.send() 関数を使用して 404 メッセージを送信しています。

res.json() 関数とカスタムエラーオブジェクトを使用する

app.get('/users/:id', (req, res) => {
  const userId = req.params.id;

  // ユーザーをデータベースから取得する
  const user = getUserById(userId);

  if (!user) {
    // ユーザーが見つからない場合は 404 レスポンスを送信する
    const error = {
      message: 'ユーザーが見つかりません',
      status: 404
    };
    res.json(error);
  } else {
    // ユーザーが見つかった場合はユーザー情報を返す
    res.json(user);
  }
});

この例は、前述の例と同じように動作します。ただし、res.json() 関数を使用してカスタムエラーオブジェクトを送信しています。このオブジェクトには、エラーメッセージとステータスコードが含まれています。

エラーミドルウェアを使用する

Express には、エラー処理を簡素化するためのミドルウェアが用意されています。404 エラーを処理するには、次のようにエラーミドルウェアを使用できます。

app.get('/users/:id', (req, res, next) => {
  const userId = req.params.id;

  // ユーザーをデータベースから取得する
  const user = getUserById(userId);

  if (!user) {
    // ユーザーが見つからない場合はエラーを発生させる
    const err = new Error('ユーザーが見つかりません');
    err.status = 404;
    next(err);
  } else {
    // ユーザーが見つかった場合はユーザー情報を返す
    res.json(user);
  }
});

app.use((err, req, res, next) => {
  if (err.status === 404) {
    // 404 エラーの場合はカスタム エラー メッセージを送信する
    res.status(404).send('ユーザーが見つかりません');
  } else {
    // その他のエラーの場合はデフォルトのエラー ハンドラーに処理を渡す
    next(err);
  }
});

この例は、前述の例と同じように動作します。ただし、エラー処理を簡素化するためにエラーミドルウェアを使用しています。

javascript node.js express

Prototype を使用してテキストエリアを自動サイズ変更するサンプルコード

以下のものが必要です。テキストエリアを含む HTML ファイルHTML ファイルに Prototype ライブラリをインクルードします。テキストエリアに id 属性を設定します。以下の JavaScript コードを追加します。このコードは、以下の処理を行います。...

javascript html css

JavaScriptにおける数値検証 - IsNumeric()関数の代替方法

JavaScriptでは、入力された値が数値であるかどうかを検証する際に、isNaN()関数やNumber. isInteger()関数などを利用することが一般的です。しかし、これらの関数では小数点を含む数値を適切に検出できない場合があります。そこで、小数点を含む数値も正しく検証するために、IsNumeric()関数を実装することが有効です。...

javascript validation numbers