From ea4a11c934d2cce4145e0f4c99176e799e402a24 Mon Sep 17 00:00:00 2001 From: Pasquale De Lucia Date: Sun, 19 Nov 2023 10:28:54 +0100 Subject: [PATCH 1/3] fix: add credentuals example for auth.js --- .../routes/docs/integrations/authjs/index.mdx | 45 +++++++++++++++++++ 1 file changed, 45 insertions(+) diff --git a/packages/docs/src/routes/docs/integrations/authjs/index.mdx b/packages/docs/src/routes/docs/integrations/authjs/index.mdx index 7ca486ecd4c..da0762df33a 100644 --- a/packages/docs/src/routes/docs/integrations/authjs/index.mdx +++ b/packages/docs/src/routes/docs/integrations/authjs/index.mdx @@ -251,6 +251,51 @@ AUTH_SECRET= 4. The application is now ready to implement authentication using Auth.js. 5. Enjoy! +### Credentials + +> Warning: This functionality is discourage by authjs. +> +> https://next-auth.js.org/providers/credentials +> +> - The functionality provided for credentials based authentication is intentionally limited to discourage use of passwords due to the inherent security risks associated with them and the additional complexity associated with supporting usernames and passwords. + +1. Since the default `plugin@auth.ts` uses GutHub as an example, we need to replace it with Credentials. +```ts title="src/routes/plugin@auth.ts" +import { serverAuth$ } from '@builder.io/qwik-auth'; +import Credentials from "@auth/core/providers/credentials"; +import type { Provider } from '@auth/core/providers'; + +export const { onRequest, useAuthSession, useAuthSignin, useAuthSignout } = serverAuth$( + ({ env }) => ({ + secret: env.get("AUTH_SECRET"), + trustHost: true, + providers: [ + Credentials({ + async authorize(credentials, req) { + // Add logic here to look up the user from the credentials supplied + const user = { + id: 1, + name: "Mike", + email: "mike@example.com", + }; + + return user; + }, + }), + ] as Provider[], + }) +); +``` + +2. Create or edit the `.env.local` file at the root of your project to store secrets + +```bash title=".env.local" +AUTH_SECRET= +``` + +3. The application is now ready to implement authentication using Auth.js. +4. Enjoy! + ### Route Protection Session data can be accessed via the route `event.sharedMap`. So a route can be protected and redirect using something like this located in a `layout.tsx` or page `index.tsx`: From 60b5653d045382dbdc06e7fddb6940762a0a77d3 Mon Sep 17 00:00:00 2001 From: Pasquale De Lucia Date: Sun, 19 Nov 2023 10:52:59 +0100 Subject: [PATCH 2/3] docs(authjs index.mdx): add credentials example for auth.js integration --- packages/docs/src/routes/api/qwik/index.md | 2 +- packages/docs/src/routes/docs/integrations/authjs/index.mdx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/docs/src/routes/api/qwik/index.md b/packages/docs/src/routes/api/qwik/index.md index 71674cd86fd..4cdb14e4fcf 100644 --- a/packages/docs/src/routes/api/qwik/index.md +++ b/packages/docs/src/routes/api/qwik/index.md @@ -1924,7 +1924,7 @@ At times it is necessary to store values on a store that are non-serializable. N You can use `noSerialize()` to mark a value as non-serializable. The value is persisted in the Store but does not survive serialization. The implication is that when your application is resumed, the value of this object will be `undefined`. You will be responsible for recovering from this. -See: [noSerialize Tutorial](https://qwik.builder.io/tutorial/store/no-serialize) +See: [noSerialize Tutorial](http://qwik.builder.io/tutorial/store/no-serialize) ```typescript noSerialize: (input: T) => NoSerialize; diff --git a/packages/docs/src/routes/docs/integrations/authjs/index.mdx b/packages/docs/src/routes/docs/integrations/authjs/index.mdx index da0762df33a..29841f64c77 100644 --- a/packages/docs/src/routes/docs/integrations/authjs/index.mdx +++ b/packages/docs/src/routes/docs/integrations/authjs/index.mdx @@ -253,7 +253,7 @@ AUTH_SECRET= ### Credentials -> Warning: This functionality is discourage by authjs. +> Warning: This functionality is discourage by Auth.js. > > https://next-auth.js.org/providers/credentials > From c2bd26853eb158c40971511b03e4482e25668559 Mon Sep 17 00:00:00 2001 From: Pasquale De Lucia Date: Sun, 19 Nov 2023 11:02:11 +0100 Subject: [PATCH 3/3] add important warning to use env variables --- packages/docs/src/routes/docs/integrations/authjs/index.mdx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/docs/src/routes/docs/integrations/authjs/index.mdx b/packages/docs/src/routes/docs/integrations/authjs/index.mdx index 29841f64c77..524f2b82dfe 100644 --- a/packages/docs/src/routes/docs/integrations/authjs/index.mdx +++ b/packages/docs/src/routes/docs/integrations/authjs/index.mdx @@ -293,6 +293,8 @@ export const { onRequest, useAuthSession, useAuthSignin, useAuthSignout } = serv AUTH_SECRET= ``` +> *IMPORTANT*: Please read the Qwik documentation about [Environment Variables](/docs/env-variables/) to ensure you are using them safely. Many provider secrets should be kept secure and not exposed to the client/browser. + 3. The application is now ready to implement authentication using Auth.js. 4. Enjoy!