NuxtのserverMiddlewareを使用してAPIエンドポイントを作成する方法

Nuxtプロジェクトのルートディレクトリに、middlewareという名前のディレクトリを作成します。
middlewareディレクトリ内に、APIエンドポイントのロジックを含むJavaScriptファイルを作成します。例えば、api.jsという名前のファイルを作成しましょう。
api.jsファイル内で、Express.jsスタイルのルーターを作成します。以下は、簡単な例です。

const express = require('express')
const router = express.Router()
router.get('/api/posts', (req, res) => {
  // APIのロジックを実装する
  const posts = [
    { id: 1, title: '記事1' },
    { id: 2, title: '記事2' },
    { id: 3, title: '記事3' }
  ]
  res.json(posts)
})
module.exports = router

api.jsファイルを作成したら、nuxt.config.jsファイルを開きます。
nuxt.config.jsファイル内のserverMiddlewareプロパティに、作成したAPIエンドポイントのモジュールを追加します。以下は例です。

module.exports = {
  // ...
  serverMiddleware: [
    '~/middleware/api'
  ],
  // ...
}

これで、Nuxtアプリケーション内で/api/postsというエンドポイントが作成されました。このエンドポイントにGETリクエストを送信すると、api.jsファイル内のロジックが実行され、サンプルの記事データがJSON形式で返されます。

以上が、NuxtのserverMiddlewareを使用してAPIエンドポイントを作成する方法です。この方法を使用すると、Nuxtアプリケーション内で独自のAPIを簡単に作成できます。必要に応じて、他のHTTPメソッドや複数のエンドポイントを追加することも可能です。詳細な実装例については、Nuxt.jsの公式ドキュメントを参照してください。