mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-26 15:42:09 +00:00
feat(docs): addRouteMiddleware
This commit is contained in:
parent
bb69c0ef30
commit
1f0e400705
@ -1397,7 +1397,97 @@ export default defineNuxtModule({
|
||||
})
|
||||
```
|
||||
|
||||
- `addRouteMiddleware (input: NuxtMiddleware | NuxtMiddleware[], options: AddRouteMiddlewareOptions)`
|
||||
### `addRouteMiddleware`
|
||||
|
||||
Route middleware functions within the Vue section of your Nuxt application. Distinct from server middleware, these middlewares are specifically for the Vue side. They enable you to incorporate specific logic to your routes, such as authentication and authorization. You can define these middlewares within a Nuxt module via this utility.
|
||||
|
||||
::alert{type=info icon=👉}
|
||||
Read more about route middlewares in the [Route middleware documentation](/docs/getting-started/routing#route-middleware).
|
||||
::
|
||||
|
||||
#### Type
|
||||
|
||||
```ts
|
||||
function addRouteMiddleware (input: NuxtMiddleware | NuxtMiddleware[], options: AddRouteMiddlewareOptions)
|
||||
|
||||
type NuxtMiddleware = {
|
||||
name: string
|
||||
path: string
|
||||
global?: boolean
|
||||
}
|
||||
|
||||
interface AddRouteMiddlewareOptions {
|
||||
override?: boolean
|
||||
}
|
||||
```
|
||||
|
||||
#### Parameters
|
||||
|
||||
##### `input`
|
||||
|
||||
**Type**: `NuxtMiddleware | NuxtMiddleware[]`
|
||||
|
||||
**Required**: `true`
|
||||
|
||||
A middleware object or an array of middleware objects with the following properties:
|
||||
|
||||
- `name` (required)
|
||||
|
||||
**Type**: `string`
|
||||
|
||||
Middleware name.
|
||||
|
||||
- `path` (required)
|
||||
|
||||
**Type**: `string`
|
||||
|
||||
Path to the middleware.
|
||||
|
||||
- `global` (optional)
|
||||
|
||||
**Type**: `boolean`
|
||||
|
||||
If enabled, registers middleware to be available for all routes.
|
||||
|
||||
##### `options`
|
||||
|
||||
**Type**: `AddRouteMiddlewareOptions`
|
||||
|
||||
**Default**: `{}`
|
||||
|
||||
Options to pass to the middleware. If `override` is set to `true`, it will override the existing middleware with the same name.
|
||||
|
||||
#### Examples
|
||||
|
||||
::code-group
|
||||
|
||||
```ts [runtime/auth.ts]
|
||||
export default defineNuxtRouteMiddleware((to, from) => {
|
||||
// isAuthenticated() is an example method verifying if a user is authenticated
|
||||
if (isAuthenticated() === false) {
|
||||
return navigateTo('/login')
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
```ts
|
||||
import { createResolver, defineNuxtModule, addRouteMiddleware } from '@nuxt/kit'
|
||||
|
||||
export default defineNuxtModule({
|
||||
setup() {
|
||||
const resolver = createResolver(import.meta.url)
|
||||
|
||||
addRouteMiddleware({
|
||||
name: 'auth',
|
||||
path: resolver.resolve('runtime/auth.ts'),
|
||||
global: true
|
||||
})
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
::
|
||||
|
||||
|
||||
## Plugins
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user