createError

ソース
追加のメタデータを含むエラーオブジェクトを作成します。

この関数を使用して、追加のメタデータを含むエラーオブジェクトを作成できます。この関数は、アプリのVue部分とNitro部分の両方で使用でき、スローされることを意図しています。

パラメーター

  • err: string | { cause, data, message, name, stack, statusCode, statusMessage, fatal }

createError関数には、文字列またはオブジェクトを渡すことができます。文字列を渡した場合、それはエラーmessageとして使用され、statusCodeはデフォルトで500になります。オブジェクトを渡した場合、statusCodemessage、その他のエラープロパティなど、エラーの複数のプロパティを設定できます。

Vueアプリケーションの場合

createErrorで作成されたエラーをスローした場合

  • サーバーサイドでは、フルスクリーンエラーページがトリガーされ、clearErrorでクリアできます。
  • クライアントサイドでは、処理する必要がある致命的ではないエラーがスローされます。フルスクリーンエラーページをトリガーする必要がある場合は、fatal: trueを設定することでこれを実行できます。

app/pages/movies/[slug].vue
<script setup lang="ts">
const route = useRoute()
const { data } = await useFetch(`/api/movies/${route.params.slug}`)
if (!data.value) {
  throw createError({ statusCode: 404, statusMessage: 'Page Not Found' })
}
</script>

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プロパティを使用してデータをクライアントに渡すことができます。いずれの場合も、潜在的なセキュリティ問題を避けるため、動的なユーザー入力をメッセージに含めないように常に考慮してください。

Docs > 4 X > Getting Started > Error Handling で詳細をご覧ください。