From 345a8799f7f58def4723e4c9156e268f70e5c1af Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Yusuf=20Mansur=20=C3=96zer?= Date: Sat, 15 Jun 2024 22:14:27 +0300 Subject: [PATCH] docs: string vs object errors + accessing data of server-thrown errors (#27398) --- docs/1.getting-started/8.error-handling.md | 4 ++-- docs/3.api/3.utils/create-error.md | 6 +++++- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/docs/1.getting-started/8.error-handling.md b/docs/1.getting-started/8.error-handling.md index c4b44a438d..3c898508fc 100644 --- a/docs/1.getting-started/8.error-handling.md +++ b/docs/1.getting-started/8.error-handling.md @@ -150,10 +150,10 @@ Read more about `useError` composable. ### `createError` ```ts [TS Signature] -function createError (err: { cause, data, message, name, stack, statusCode, statusMessage, fatal }): Error +function createError (err: string | { cause, data, message, name, stack, statusCode, statusMessage, fatal }): Error ``` -Create an error object with additional metadata. It is usable in both the Vue and Server portions of your app, and is meant to be thrown. +Create an error object with additional metadata. You can pass a string to be set as the error `message` or an object containing error properties. It is usable in both the Vue and Server portions of your app, and is meant to be thrown. If you throw an error created with `createError`: - on server-side, it will trigger a full-screen error page which you can clear with [`clearError`](#clearerror). diff --git a/docs/3.api/3.utils/create-error.md b/docs/3.api/3.utils/create-error.md index ecdc7e7386..6d49a54410 100644 --- a/docs/3.api/3.utils/create-error.md +++ b/docs/3.api/3.utils/create-error.md @@ -12,7 +12,9 @@ You can use this function to create an error object with additional metadata. It ## Parameters -- `err`: `{ cause, data, message, name, stack, statusCode, statusMessage, fatal }` +- `err`: `string | { cause, data, message, name, stack, statusCode, statusMessage, fatal }` + +You can pass either a string or an object to the `createError` function. If you pass a string, it will be used as the error `message`, and the `statusCode` will default to `500`. If you pass an object, you can set multiple properties of the error, such as `statusCode`, `message`, and other error properties. ## In Vue App @@ -48,4 +50,6 @@ export default eventHandler(() => { }) ``` +In API routes, using `createError` by passing an object with a short `statusMessage` is recommended because it can be accessed on the client side. Otherwise, a `message` passed to `createError` on an API route will not propagate to the client. Alternatively, you can use the `data` property to pass data back to the client. In any case, always consider avoiding to put dynamic user input to the message to avoid potential security issues. + :read-more{to="/docs/getting-started/error-handling"}