54.9K

DocsAPIUtils

abortNavigation

Source Code

abortNavigation is a helper function that prevents navigation from taking place and throws an error if one is set as a parameter.

abortNavigation is only usable inside a route middleware handler.

Type

abortNavigation(err?: Error | string): false

Parameters

err

  • Type: Error | string
    Optional error to be thrown by abortNavigation.

Examples

The example below shows how you can use abortNavigation in a route middleware to prevent unauthorized route access:

middleware/auth.ts
export default defineNuxtRouteMiddleware((to, from) => {  const user = useState('user')  if (!user.value.isAuthorized) {    return abortNavigation()  }   if (to.path !== '/edit-post') {    return navigateTo('/edit-post')  }})

err as a String

You can pass the error as a string:

middleware/auth.ts
export default defineNuxtRouteMiddleware((to, from) => {  const user = useState('user')  if (!user.value.isAuthorized) {    return abortNavigation('Insufficient permissions.')  }})

err as an Error Object

You can pass the error as an Error object, e.g. caught by the catch-block:

middleware/auth.ts
export default defineNuxtRouteMiddleware((to, from) => {  try {    /* code that might throw an error */  } catch (err) {    return abortNavigation(err)  }})

$fetch

Nuxt uses ofetch to expose globally the $fetch helper for making HTTP requests.

addRouteMiddleware

addRouteMiddleware() is a helper function to dynamically add middleware in your application.