Skip to content

Commit cf7376f

Browse files
doc: adjust docs for the 0.10.0 release (#963)
* Adjusted docs to match new origin env system * Began writing upgrade guide for 0.10.0 * added external backend section back to docs * Finished 0.10.0 upgrade guide * Added 0.10.0 release bannner * Added version tag to hero * fix: lint * Apply suggestions from code review * docs: write a dedicated guide for path logic * docs: minor adjustment --------- Co-authored-by: Marsel Shaikhin <[email protected]> Co-authored-by: Marsel Shaikhin <[email protected]>
1 parent b5af548 commit cf7376f

File tree

9 files changed

+284
-68
lines changed

9 files changed

+284
-68
lines changed

docs/.vitepress/routes/navbar.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,12 @@ export const routes: DefaultTheme.Config['nav'] = [
4444
],
4545
},
4646
{
47-
text: '0.9.4',
47+
text: '0.10.0',
4848
items: [
49+
{
50+
text: '0.9.4',
51+
link: 'https://github.com/sidebase/nuxt-auth/tree/0.9.4/docs',
52+
},
4953
{
5054
text: '0.8.2',
5155
link: 'https://github.com/sidebase/nuxt-auth/tree/0.8.2/docs',

docs/.vitepress/routes/sidebar/guide.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,7 @@ export const routes: DefaultTheme.SidebarItem[] = [
9696
],
9797
},
9898
{ text: 'Caching', link: '/caching' },
99+
{ text: 'Pathing logic and baseURL', link: '/url-resolutions' },
99100
],
100101
},
101102
]

docs/.vitepress/routes/sidebar/upgrade.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ export const routes: DefaultTheme.SidebarItem[] = [
55
text: 'Versions',
66
base: '/upgrade',
77
items: [
8+
{
9+
text: 'Version 0.10.0',
10+
link: '/version-0.10.0'
11+
},
812
{
913
text: 'Version 0.9.0',
1014
link: '/version-0.9.0'

docs/.vitepress/theme/components/Layout.vue

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,17 @@
22
import DefaultTheme from 'vitepress/theme'
33
import GithubStarsButton from './GithubStarsButton.vue'
44
import Banner from './Banner.vue'
5+
import Tag from './Tag.vue'
56
67
const { Layout } = DefaultTheme
78
89
// Banner Configuration
9-
const isBannerEnabled = false
10+
const isBannerEnabled = true
1011
const bannerConfig = {
1112
// Leave text empty to disable the banner
12-
text: '🚀 NuxtAuth v0.9.0 has been released!',
13+
text: '🚀 NuxtAuth v0.10.0 has been released!',
1314
button: {
14-
href: '/upgrade/version-0.9.0',
15+
href: '/upgrade/version-0.10.0',
1516
text: 'View upgrade guide',
1617
},
1718
}
@@ -26,5 +27,11 @@ const bannerConfig = {
2627
<template v-if="isBannerEnabled" #home-hero-before>
2728
<Banner v-bind="bannerConfig" />
2829
</template>
30+
31+
<template #home-hero-info-before>
32+
<a href="/upgrade/version-0.10.0">
33+
<Tag text="Version 0.10.0" />
34+
</a>
35+
</template>
2936
</Layout>
3037
</template>
Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
# Pathing logic in NuxtAuth
2+
3+
This page is here to clarify how the pathing logic works in `@sidebase/nuxt-auth`.
4+
You can find a full overview of how URLs are handled [in the issue comment](https://github.com/sidebase/nuxt-auth/pull/913#issuecomment-2359137989) and in spec files for [`authjs` provider](https://github.com/sidebase/nuxt-auth/blob/main/tests/authjs.url.spec.ts) and [`local` provider](https://github.com/sidebase/nuxt-auth/blob/main/tests/local.url.spec.ts).
5+
6+
## `baseURL` is a prefix
7+
8+
It will be prepended to a path before making a call. For example,
9+
10+
```ts
11+
export default defineNuxtConfig({
12+
auth: {
13+
baseURL: 'https://example.com/api/auth',
14+
15+
provider: {
16+
type: 'local',
17+
endpoints: {
18+
// The call would be made to `https://example.com/api/auth/login`
19+
signIn: { path: '/login', method: 'post' },
20+
}
21+
}
22+
}
23+
})
24+
```
25+
26+
## Use URL provided in `endpoints` if it is fully specified
27+
28+
If you provide a full URL to `endpoints`, it will be used when making calls to an endpoint:
29+
30+
```ts {9}
31+
export default defineNuxtConfig({
32+
auth: {
33+
baseURL: 'https://your.website/api',
34+
35+
provider: {
36+
type: 'local',
37+
endpoints: {
38+
// This will call `https://example.com/user`
39+
getSession: { path: 'https://example.com/user' },
40+
41+
// This will call `https://your.website/api/login`
42+
signIn: { path: '/login', method: 'post' },
43+
},
44+
}
45+
}
46+
})
47+
```
48+
49+
## `runtimeConfig`
50+
51+
Value of `baseURL` is always located at `runtimeConfig.public.auth.baseURL`. You cannot change it directly as of the moment of writing, but you can read the value in your application:
52+
53+
```ts
54+
const runtimeConfig = useRuntimeConfig()
55+
const baseURL = runtimeConfig.public.auth.baseURL
56+
```
57+
58+
This value is generally the [source of truth](https://github.com/sidebase/nuxt-auth/blob/b5af548c1fc390ae00496e19ad7a91d308af9b12/src/runtime/utils/url.ts#L37-L38). It is being [set in the plugin](https://github.com/sidebase/nuxt-auth/blob/b5af548c1fc390ae00496e19ad7a91d308af9b12/src/runtime/plugin.ts#L20-L24) to also be available on the client.
59+
60+
## Changing `baseURL`
61+
62+
Read next to understand how it can be changed.
63+
64+
### 1. Environment variables
65+
66+
You have multiple ways of changing the `baseURL` via env variables:
67+
- use `NUXT_PUBLIC_AUTH_BASE_URL`;
68+
- use `AUTH_ORIGIN` if `originEnvKey` is not set;
69+
- use the environment variable name set in [`originEnvKey`](/guide/application-side/configuration#originenvkey)
70+
71+
Environment variables should work in both build-time and runtime.
72+
73+
### 2. `baseURL`
74+
75+
If you didn't set an environment variable, NuxtAuth will look for [`auth.baseURL`](/guide/application-side/configuration#baseurl) inside the `nuxt.config.ts`.
76+
77+
Note that this variable is always **static**, will only be set during runtime and can still be overriden in runtime using env variables.
78+
79+
Not setting `baseURL` will default to `/api/auth`.
80+
81+
### 3. `authjs` only: determine origin automatically from the incoming `HTTP` request
82+
83+
When the server is running in **development mode**, NuxtAuth can automatically infer `baseURL` from the incoming request.
84+
85+
---
86+
87+
We recommend the following setup to configure your `AUTH_ORIGIN` or `baseURL`:
88+
89+
::: code-group
90+
91+
```ts diff [nuxt.config.ts]
92+
export default defineNuxtConfig({
93+
// ... other configuration
94+
auth: {
95+
baseUrl: 'https://my-backend.com/api/auth', // [!code --]
96+
// This is technically not needed as it is the default, but it's here for illustrative purposes
97+
originEnvKey: 'AUTH_ORIGIN', // [!code ++]
98+
}
99+
})
100+
```
101+
102+
```env diff [.env]
103+
AUTH_ORIGIN="https://my-backend.com/api/auth" // [!code ++]
104+
```
105+
106+
:::

docs/guide/application-side/configuration.md

Lines changed: 5 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ export default defineNuxtConfig({
5151
```
5252
:::
5353

54-
You can read additional information on `origin` determining [here](/resources/error-reference#auth-no-origin).
54+
You can read additional information on `origin` and `baseURL` determining [here](/resources/error-reference#auth-no-origin).
5555

5656
## `disableServerSideAuth`
5757

@@ -63,33 +63,13 @@ Forces your server to send a "loading" authentication status on all requests, th
6363
## `baseURL`
6464

6565
- **Type**: `string | undefined`
66-
- **Default**:
67-
- AuthJS Provider:
68-
- _Development_: `http://localhost:3000/api/auth`
69-
- _Production_: `undefined`
70-
- Local / Refresh Provider: `/api/auth`
7166

72-
The full url at which the app will run combined with the path to authentication. You can set this differently depending on your selected authentication-provider:
67+
The full URL at which the app will run combined with the path to authentication. You should only use `baseURL` if you want to set it statically for your application.
7368

74-
- `authjs`: You must set the full URL, with origin and path in production. You can leave this empty in development
75-
- `local`: You can set a full URL, but can also leave this empty to fallback to the default value of `/api/auth` or set only the path.
69+
You can read additional information on `origin` and `baseURL` determining [here](/resources/error-reference#auth-no-origin).
7670

77-
### `authjs` Provider
78-
79-
`baseURL` can be `undefined` during development but _must_ be set to the combination of origin + path that points to your `NuxtAuthHandler` for production. The origin consists out of:
80-
- **scheme**: http / https
81-
- **host**: e.g., localhost, example.org, google.com
82-
- **port**: _empty_ (implies `:80` for http and `:443` for https), :3000, :8888
83-
- **path**: the path that directs to the location of your `NuxtAuthHandler` e.g. `/api/auth`
84-
85-
### `local` Provider
86-
87-
Defaults to `/api/auth` for both development and production. Setting this is optional, if you set it you can set it to either:
88-
- just a path: Will lead to `nuxt-auth` using `baseURL` as a relative path appended to the origin you deploy to. Example: `/backend/auth`
89-
- an origin and a path: Will lead to `nuxt-auth` using `baseURL` as an absolute request path to perform requests to. Example: `https://example.com/auth`
90-
91-
:::warning
92-
If you point to a different origin than the one you deploy to you likely have to take care of CORS: Allowing cross origin requests.
71+
::: tip
72+
If you would like to overwrite the `baseURL` at the runtime you can use the [`originEnvKey`](#originenvkey).
9373
:::
9474

9575
## `provider`

docs/guide/local/quick-start.md

Lines changed: 23 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,6 @@
22

33
This guide is for setting up `@sidebase/nuxt-auth` with the Local Provider, which is best suited for when you already have a backend that accepts username + password as a login or want to build a static application. The Local Provider also supports refresh tokens since `v0.9.0`.
44

5-
:::warning Breaking change
6-
In `v0.9.0` the `refresh` provider was integrated into the `local` provider. Read the [upgrade guide](/upgrade/version-0.9.0).
7-
:::
8-
95
## Configuration
106

117
The entire configuration for the `local` provider is contained inside the `nuxt.config.ts`. Inside the `auth` options, set your provider to `local`.
@@ -14,27 +10,25 @@ The entire configuration for the `local` provider is contained inside the `nuxt.
1410
export default defineNuxtConfig({
1511
modules: ['@sidebase/nuxt-auth'],
1612
auth: {
17-
baseURL: '/api/auth',
1813
provider: {
1914
type: 'local'
2015
}
2116
}
2217
})
2318
```
2419

25-
:::tip
26-
Ensure that your `baseURL` is properly configured to match your backend API. Read more [here](/guide/application-side/configuration#local-and-refresh).
27-
:::
28-
2920
## API endpoints
3021

3122
Afterwards, you can define the endpoints to which the authentication requests will be made:
3223

3324
```ts
3425
export default defineNuxtConfig({
3526
// ...Previous configuration
27+
runtimeConfig: {
28+
baseURL: '/api/auth'
29+
},
3630
auth: {
37-
baseURL: '/api/auth',
31+
originEnvKey: 'NUXT_BASE_URL',
3832
provider: {
3933
type: 'local',
4034
endpoints: {
@@ -50,23 +44,18 @@ export default defineNuxtConfig({
5044

5145
Each endpoint, consists of an object, with a `path` and `method`. When a user triggers an action inside your application a request will be made to each endpoint. When a request is made to the `getSession` endpoint, a token will be sent as a header. You can configure the headers and token below.
5246

53-
In the example above requests would be made to the following URLs:
47+
In the example above, we define a [runtime config](https://nuxt.com/docs/guide/going-further/runtime-config) value with the `baseURL` using the `originEnvKey`, which results in requests being made to the following URLs:
5448

5549
- **Sign in:** `/api/auth/login` (POST)
5650
- **Sign out** `/api/auth/logout` (POST)
5751
- **Sign up:** `/api/auth/register` (POST)
5852
- **Get Session:** `/api/auth/session` (GET)
5953

60-
:::info
61-
Relative paths starting with a `/` (e.g. `/login`) will be treated as a part of your Nuxt application. If you want to use an external backend, please provide fully-specified URLs instead. Read more [here](#using-an-external-backend).
62-
:::
63-
6454
You can customize each endpoint to fit your needs or disable it by setting it to `false`. For example you may want to disable the `signUp` endpoint.
6555

66-
```ts{7}
56+
```ts{6}
6757
export default defineNuxtConfig({
6858
auth: {
69-
baseURL: '/api/auth',
7059
provider: {
7160
type: 'local',
7261
endpoints: {
@@ -83,33 +72,29 @@ You cannot disable the `getSession` endpoint, as NuxtAuth internally uses it to
8372

8473
### Using an external backend
8574

86-
When using the `local` provider to access an external backend, please consider that the module will attempt to resolve the API endpoints by using internal Nuxt 3 relative URLs or an external call.
75+
You can also set your endpoints to query an external backend:
8776

88-
To ensure that the module can properly identify that your endpoints point to an external URL, please ensure the following:
89-
90-
1. `auth.baseURL` **includes** a trailing `/` at the end
91-
2. `auth.endpoints` **do not** include a leading `/` at the start
92-
93-
```ts{7}
77+
```ts
9478
export default defineNuxtConfig({
95-
auth: {
96-
baseURL: 'https://external-api.com', // [!code --]
97-
baseURL: 'https://external-api.com/', // [!code ++]
98-
provider: {
99-
type: 'local',
100-
endpoints: {
101-
signIn: { path: '/login', method: 'post' }, // [!code --]
102-
signIn: { path: 'login', method: 'post' }, // [!code ++]
103-
getSession: { path: '/session', method: 'get' }, // [!code --]
104-
getSession: { path: 'session', method: 'get' }, // [!code ++]
105-
}
106-
}
79+
// ...Previous configuration
80+
runtimeConfig: {
81+
baseURL: 'https://example.com/api'
82+
},
83+
auth: {
84+
originEnvKey: 'NUXT_BASE_URL',
85+
provider: {
86+
type: 'local',
87+
endpoints: {
88+
signIn: { path: '/auth/login', method: 'post' },
89+
signOut: { path: '/auth/logout', method: 'post' },
90+
signUp: { path: '/auth/register', method: 'post' },
91+
getSession: { path: '/user/session', method: 'get' },
92+
}
10793
}
94+
}
10895
})
10996
```
11097

111-
You can read more about the path resolving logic in `@sidebase/nuxt-auth` [here](https://github.com/sidebase/nuxt-auth/issues/782#issuecomment-2223861422).
112-
11398
## Token
11499

115100
The `local` and `refresh` providers are both based on exchanging access tokens with your backend. NuxtAuth expects an access token to be provided by the `signIn` endpoint, which will then be saved into the session to authenticate further requests to e.g. `getSession`.

docs/upgrade/index.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,4 @@ title: 'Redirecting'
33
editLink: false
44
---
55

6-
<meta http-equiv="refresh" content="0;URL='/upgrade/version-0.9.0'" />
6+
<meta http-equiv="refresh" content="0;URL='/upgrade/version-0.10.0'" />

0 commit comments

Comments
 (0)