Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-25 23:22:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

[autofix.ci] apply automated fixes

Browse Source
This commit is contained in:
autofix-ci[bot] 2024-06-16 17:03:10 +00:00 committed by GitHub
parent f38cf6b65f
commit e9e6c1b142
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 2 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/2.guide/4.recipes/4.sessions-and-authentication.md
View File

@ -20,10 +20,8 @@ Additionally, we'll use [nuxt-aut-utils](https://github.com/Atinux/nuxt-auth-uti
### 1. Install nuxt-auth-utils
Install the [auth-utils](https://github.com/Atinux/nuxt-auth-utils) module using the `nuxi` CLI.
```bash
npx nuxi@latest module add auth-utils
```
@ -38,7 +36,7 @@ NUXT_SESSION_PASSWORD=password-with-at-least-32-characters
### 2. Create a registration page
The first page we'll need is a page for users to register and create new accounts. Create a new Vue page in your Nuxt app at `/pages/register.vue` for user registration. This page should have a form with fields for email and password. We'll intercept the form submission using `@submit.prevent` and use the [`$fetch`](/docs/getting-started/data-fetching#fetch) utility to post the data to `/api/register`. This form POST will be received by Nuxt in an API route which we will set up next.
The first page we'll need is a page for users to register and create new accounts. Create a new Vue page in your Nuxt app at `/pages/register.vue` for user registration. This page should have a form with fields for email and password. We'll intercept the form submission using `@submit.prevent` and use the [`$fetch`](/docs/getting-started/data-fetching#fetch) utility to post the data to `/api/register`. This form POST will be received by Nuxt in an API route which we will set up next.
If the request is successful, we'll navigate to the (soon to be created) `/users` page, which will be guarded and only be visible to logged in users.
@ -398,6 +396,6 @@ const { data: users } = await useFetch("/api/users");
</template>
```
### Complete!
### Complete
We've successfully set up user registration and authentication in our Nuxt app. Users can now register, log in, and log out. We've also protected sensitive routes on the server and client side to ensure that only authenticated users can access them.