createError
追加のメタデータを持つエラーオブジェクトを作成します。
この関数を使用して、追加のメタデータを持つエラーオブジェクトを作成できます。これはアプリの Vue 部分と Nitro 部分の両方で使用可能で、スローすることを目的としています。
パラメータ
err
:string | { cause, data, message, name, stack, statusCode, statusMessage, fatal }
createError
関数には文字列またはオブジェクトを渡すことができます。文字列を渡すと、それがエラーの message
として使用され、statusCode
はデフォルトで 500
になります。オブジェクトを渡すと、statusCode
、message
、その他のエラーのプロパティを設定できます。
Vue アプリで
createError
で作成したエラーをスローすると:
- サーバーサイドでは、
clearError
でクリアできるフルスクリーンのエラーページが表示されます。 - クライアントサイドでは、処理するための非致命的なエラーがスローされます。フルスクリーンのエラーページを表示する必要がある場合は、
fatal: true
を設定することで実現できます。
例
pages/movies/[slug\
const route = useRoute()
const { data } = await useFetch(`/api/movies/${route.params.slug}`)
if (!data.value) {
throw createError({ statusCode: 404, statusMessage: 'Page Not Found' })
}
API ルートで
サーバー API ルートでエラーハンドリングをトリガーするために createError
を使用します。
例
server/api/error.ts
export default eventHandler(() => {
throw createError({
statusCode: 404,
statusMessage: 'Page Not Found'
})
})
API ルートでは、クライアントサイドでアクセスできるように短い statusMessage
を持つオブジェクトを渡して createError
を使用することが推奨されます。そうでない場合、API ルートで createError
に渡された message
はクライアントに伝播しません。代わりに、data
プロパティを使用してクライアントにデータを返すことができます。いずれの場合も、潜在的なセキュリティ問題を避けるために、動的なユーザー入力をメッセージに含めないように常に考慮してください。
※このページは Nuxt.js 公式ドキュメントの翻訳ページ(非公式)です。
公式ドキュメントの該当ページはこちら:
https://nuxt.com/docs/3.x/api/utils/create-error