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