-
-
Notifications
You must be signed in to change notification settings - Fork 168
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Feature: Option to remove server side auth (#610)
* feat: Added option to remove server * lint: remove extra semicolon. * docs: Added disableServerSideAuth to Nuxt Config docs. * doc: Added consistent spacing in disableServerSideAuth JSDoc. * Added route-based rules for cache-support. * Made port a variable on nuxt config base url. * Capitalize PORT on Authjs Playground Nuxt Config (oops, I hope this fixes the problem). * Change `playground-authjs` CI port to 3000. * Remove cache on a route that wasn't supposed to be cached * Store route matcher between sessions. * fix: Typo referencing token when retrieving cookie. * fix(docs): Typo with incorrect spelling of false in route config page Co-authored-by: Marsel Shayhin <[email protected]> * fix(playground): Fixed created at variable being used for cached at. Co-authored-by: Marsel Shayhin <[email protected]> * fix(docs): Clarified what disable server side fetching does behind the scenes. Co-authored-by: Marsel Shayhin <[email protected]> * fix(docs): Added JSDoc example and fix misspelling on route rules types. Co-authored-by: Marsel Shayhin <[email protected]> * fix(docs): Clarified that global setting results in caching. Co-authored-by: Marsel Shayhin <[email protected]> * fix(playground): On SWR pages, display time. * fix: Fixed route rules incorrectly referenced. * fix: import from `#import` in route matcher to fix CI error * fix: import from `#import` in route matcher to fix CI error * fix: Prevent auth from route rules from erroring when undefined. Co-authored-by: Marsel Shayhin <[email protected]> * fix: Reverted CI changes. * fix(CI): Add env variable to AuthJS example on build. --------- Co-authored-by: Zoey <[email protected]> Co-authored-by: Marsel Shayhin <[email protected]>
- Loading branch information
1 parent
42b99e2
commit 11a22c5
Showing
22 changed files
with
331 additions
and
14 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,85 @@ | ||
--- | ||
description: "Learn how to configure your project to support caching" | ||
--- | ||
|
||
::alert{type="info"} | ||
If you are using the following routeRules (`swr`, `isr`, `prerender`), you will need to read this. When prerendering your entire site using `nuxi generate`, this is done automatically. | ||
:: | ||
|
||
# Caching Content | ||
|
||
Often hosting providers offer caching on the edge. Most websites can experience incredible speeds (and cost savings) by taking advantage of caching. No cold start, no processing requests, no parsing Javascript... just HTML served immediately from a CDN. | ||
|
||
By default we send the user's authentication data down to the client in the HTML. This might not be ideal if you're caching your pages. Users may be able to see other user's authentication data if not handled properly. | ||
|
||
To add caching to your Nuxt app, follow the [Nuxt documentation on hybrid rendering](https://nuxt.com/docs/guide/concepts/rendering#hybrid-rendering). | ||
|
||
## Configuration | ||
|
||
::alert{type="warning"} | ||
If you find yourself needing to server-rendered auth methods like `getProviders()`, you must set the `baseURL` option on the `auth` object. This applies in development too. | ||
:: | ||
|
||
### Page Specific Cache Rules | ||
|
||
If only a few of your pages are cached. Head over to the Nuxt config `routeRules`, add the `auth` key to your cached routes. Set `disableServerSideAuth` to `true`. | ||
|
||
```ts | ||
export default defineNuxtConfig({ | ||
modules: ['@sidebase/nuxt-auth'], | ||
auth: { | ||
// Optional - Needed for getProviders() method to work server-side | ||
baseURL: 'http://localhost:3000', | ||
}, | ||
routeRules: { | ||
'/': { | ||
swr: 86400000, | ||
auth: { | ||
disableServerSideAuth: true, | ||
}, | ||
}, | ||
}, | ||
}) | ||
``` | ||
|
||
### Module Cache Rules | ||
|
||
If all/most pages on your site are cached. Head over to the Nuxt config, add the `auth` key if not already there. Set `disableServerSideAuth` to `true`. | ||
|
||
```ts | ||
export default defineNuxtConfig({ | ||
modules: ['@sidebase/nuxt-auth'], | ||
auth: { | ||
disableServerSideAuth: true, | ||
// Optional - Needed for getProviders() method to work server-side | ||
baseURL: 'http://localhost:3000', | ||
}, | ||
}) | ||
``` | ||
|
||
### Combining Configurations | ||
|
||
Route-configured options take precedent over module-configured options. If you disabled server side auth in the module, you may still enable server side auth back by setting `auth.disableServerSideAuth` to `false`. | ||
|
||
For example: It may be ideal to add caching to every page besides your profile page. | ||
|
||
```ts | ||
export default defineNuxtConfig({ | ||
modules: ['@sidebase/nuxt-auth'], | ||
auth: { | ||
disableServerSideAuth: true, | ||
}, | ||
routeRules: { | ||
// Server side auth is disabled on this page because of global setting | ||
'/': { | ||
swr: 86400000, | ||
} | ||
// Server side auth is enabled on this page - route rules takes priority. | ||
'/profile': { | ||
auth: { | ||
disableServerSideAuth: false, | ||
}, | ||
}, | ||
}, | ||
}) | ||
``` |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
# Route Rules | ||
|
||
Use the `auth`-key inside the `nuxt.config.ts` `routeRules` to configure page-specific settings. | ||
|
||
```ts | ||
interface RouteOptions { | ||
/** | ||
* Forces your server to send a "loading" status on a route, prompting the client to fetch on the client. If a specific page has caching, this prevents the server from caching someone's authentication status. | ||
* | ||
* @default false | ||
*/ | ||
disableServerSideAuth: boolean; | ||
} | ||
``` |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
<script setup lang="ts"> | ||
import { definePageMeta, ref, useState } from '#imports' | ||
const clientRenderTime = ref<Date>(new Date()) | ||
const serverRenderTime = useState('server-render-date', () => new Date()) | ||
definePageMeta({ auth: false }) | ||
</script> | ||
|
||
<template> | ||
<div> | ||
<p>Server Render Time: {{ serverRenderTime?.toISOString() }}</p> | ||
<p>Client Render Time: {{ clientRenderTime?.toISOString() }}</p> | ||
</div> | ||
</template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
<script setup lang="ts"> | ||
import { definePageMeta, ref, useState } from '#imports' | ||
const clientRenderTime = ref<Date>(new Date()) | ||
const serverRenderTime = useState('server-render-date', () => new Date()) | ||
definePageMeta({ auth: false }) | ||
</script> | ||
|
||
<template> | ||
<div> | ||
<p>Server Render Time: {{ serverRenderTime?.toISOString() }}</p> | ||
<p>Client Render Time: {{ clientRenderTime?.toISOString() }}</p> | ||
</div> | ||
</template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
<script setup lang="ts"> | ||
import { definePageMeta, ref, useState } from '#imports' | ||
const clientRenderTime = ref<Date>(new Date()) | ||
const serverRenderTime = useState('server-render-date', () => new Date()) | ||
definePageMeta({ auth: false }) | ||
</script> | ||
|
||
<template> | ||
<div> | ||
<p>Server Render Time: {{ serverRenderTime?.toISOString() }}</p> | ||
<p>Client Render Time: {{ clientRenderTime?.toISOString() }}</p> | ||
</div> | ||
</template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.