https://github.com/tachibana-shin/vue-auth3
This plugin is a combination of @websanova/vue-auth and Vue3 and Axios!
https://github.com/tachibana-shin/vue-auth3
auth axios quasar-framework vue vue-auth vue-auth3 vue-router4 vue3
Last synced: 3 days ago
JSON representation
This plugin is a combination of @websanova/vue-auth and Vue3 and Axios!
- Host: GitHub
- URL: https://github.com/tachibana-shin/vue-auth3
- Owner: tachibana-shin
- License: mit
- Created: 2022-05-07T00:48:49.000Z (almost 3 years ago)
- Default Branch: master
- Last Pushed: 2024-11-04T12:57:34.000Z (4 months ago)
- Last Synced: 2025-02-11T09:29:36.038Z (10 days ago)
- Topics: auth, axios, quasar-framework, vue, vue-auth, vue-auth3, vue-router4, vue3
- Language: TypeScript
- Homepage: https://vue-auth3.js.org
- Size: 2.87 MB
- Stars: 38
- Watchers: 2
- Forks: 14
- Open Issues: 21
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
![]()
# vue-auth3
This plugin is a combination of @websanova/vue-auth and Vue3 and Axios!
[View docs](https://vue-auth3.js.org)[](https://github.com/tachibana-shin/vue-auth3/actions/workflows/docs.yml)
[](http://badge.fury.io/js/vue-auth3)## Installation
NPM / Yarn / Pnpm:
```bash
pnpm add vue-auth3
```CDN:
```html
```
## Example boot/auth.ts for Quasar Framework
```ts
import { createAuth } from "vue-auth3"
import { boot } from "quasar/wrappers"
import driverAuthBearer from "vue-auth3/drivers/auth/bearer"export default boot(({ app, router, store }) => {
const auth = createAuth({
rolesKey: "type",
notFoundRedirect: "/",
fetchData: {
enabled: true,
cache: true,
},
refreshToken: {
enabled: false,
},plugins: {
router,
},
drivers: {
http: {
request: app.config.globalProperties.$api,
},
auth: driverAuthBearer,
},
})app.use(auth)
})
```## Options
Options.d.ts
```ts
type HttpData = AxiosRequestConfig & {
redirect?: RouteLocationRaw
}
type Options = {
//var
rolesKey?: string
rememberKey?: string
userKey?: string
staySignedInKey?: string
tokenDefaultKey?: string
tokenImpersonateKey?: string
stores?: (
| "cookie"
| "storage"
| {
set: (key: string, value: T, expires: boolean, auth: Auth) => void
get: (key: string) => T
remove: (key: string) => void
}
)[]
cookie?: CookieOptions// Redirects
authRedirect?: RouteLocationRaw
forbiddenRedirect?: RouteLocationRaw
notFoundRedirect?: RouteLocationRaw// Http
registerData?: HttpData & {
keyUser?: string
autoLogin?: boolean
fetchUser?: boolean
staySignedIn?: boolean
remember?: boolean
}
loginData?: HttpData & {
keyUser?: string
fetchUser?: boolean
staySignedIn?: boolean
remember?: boolean
cacheUser?: boolean
}logoutData?: HttpData & {
makeRequest?: boolean
}
fetchData?: HttpData & {
keyUser?: string
enabled?: boolean
cache?: boolean
}
refreshToken?: Omit & {
enabled?: boolean
interval?: number | false
}
impersonateData?: HttpData & {
fetchUser?: boolean
cacheUser?: boolean
}
unimpersonateData?: HttpData & {
fetchUser?: boolean
makeRequest?: boolean
cacheUser?: boolean
}
oauth2Data?: HttpData & {
fetchUser?: true
}// Plugin
plugins?: {
router?: Router
}// Driver
drivers: {
auth: AuthDriver
http: {
request: AxiosInstance
invalidToken?: (auth: Auth, response: AxiosResponse) => boolean
}
oauth2?: OAuth2Driver
}
}
```### rolesKey