From 2b01fcdfa9ee49a35b4daf2b821990315a6e2ada Mon Sep 17 00:00:00 2001 From: Ilya Suzdalnitskiy Date: Tue, 26 Dec 2023 12:35:20 -0500 Subject: [PATCH 1/4] supertokens integration fixes --- docs/docs/auth/supertokens.md | 53 +++++++++++++++++-- .../templates/api/lib/supertokens.ts.template | 4 +- .../setup/src/templates/web/auth.tsx.template | 2 +- .../templates/api/lib/supertokens.ts.template | 1 + 4 files changed, 54 insertions(+), 6 deletions(-) diff --git a/docs/docs/auth/supertokens.md b/docs/docs/auth/supertokens.md index f8267d095cff..6549de178015 100644 --- a/docs/docs/auth/supertokens.md +++ b/docs/docs/auth/supertokens.md @@ -23,13 +23,37 @@ For now, let's focus on SuperTokens's side of things. When you run the setup command it configures your app to support both email+password logins as well as social auth logins (Apple, GitHub and Google). Working with those social auth logins does require quite a few environment variables. And SuperTokens itself needs a couple variables too. Thankfully SuperTokens makes this very easy to setup as they provide values we can use for testing. -So just copy this to your project's `.env` file. +# Environment variables -```bash title=".env" +The environment variables have to be added either to your project's `.env` file (when running in development environment), or to the environment variables of your hosting provider (wher running in production). + +## Base setup + +```bash +SUPERTOKENS_APP_NAME="Redwoodjs App" SUPERTOKENS_JWKS_URL=http://localhost:8910/.redwood/functions/auth/jwt/jwks.json +SUPERTOKENS_CONNECTION_URI=https://try.supertokens.io # set to the correct connection uri +``` + +## Production setup + +Assuming that your web side is hosted on `https://myapp.com`: + +```bash +SUPERTOKENS_WEBSITE_DOMAIN=https://myapp.com +SUPERTOKENS_JWKS_URL=https://my.app.com/.redwood/functions/auth/jwt/jwks.json +``` + +## Managed Supertokens service setup + +```bash +SUPERTOKENS_API_KEY=your-api-key # The value can be omitted when self-hosting Supertokens +``` -SUPERTOKENS_CONNECTION_URI=https://try.supertokens.io +## Social login setup +The following environment variables have to be set up (depending on the social login options): +```bash SUPERTOKENS_APPLE_CLIENT_ID=4398792-io.supertokens.example.service SUPERTOKENS_APPLE_SECRET_KEY_ID=7M48Y4RYDL SUPERTOKENS_APPLE_SECRET_PRIVATE_KEY=-----BEGIN PRIVATE KEY-----\nMIGTAgEAMBMGByqGSM49AgEGCCqGSM49AwEHBHkwdwIBAQQgu8gXs+XYkqXD6Ala9Sf/iJXzhbwcoG5dMh1OonpdJUmgCgYIKoZIzj0DAQehRANCAASfrvlFbFCYqn3I2zeknYXLwtH30JuOKestDbSfZYxZNMqhF/OzdZFTV0zc5u5s3eN+oCWbnvl0hM+9IW0UlkdA\n-----END PRIVATE KEY----- @@ -40,7 +64,24 @@ SUPERTOKENS_GOOGLE_CLIENT_ID=1060725074195-kmeum4crr01uirfl2op9kd5acmi9jutn.apps SUPERTOKENS_GOOGLE_CLIENT_SECRET=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 ``` -That should be enough; now, things should just work. +## `redwood.toml` setup + +Make sure to modify `redwood.toml` to pass the required environment variables to the web side: + +```toml +[web] +... +includeEnvironmentVariables = [ + 'SUPERTOKENS_WEBSITE_DOMAIN', + 'SUPERTOKENS_API_DOMAIN', + 'SUPERTOKENS_API_GATEWAY_PATH', + 'SUPERTOKENS_APP_NAME' +] +``` + + +# Page setup + Let's make sure: if this is a brand new project, generate a home page. There we'll try to sign up by destructuring `signUp` from the `useAuth` hook (import that from `'src/auth'`). We'll also destructure and display `isAuthenticated` to see if it worked: @@ -72,3 +113,7 @@ Clicking sign up should navigate you to `/auth` where SuperToken's default login SuperTokens default UI After you sign up, you should be redirected back to your Redwood app, and you should see `{"isAuthenticated":true}` on the page. + +## Troubleshooting + +If going to `http://localhost:8910/auth` results in the plain Javascript file being served instead of the expected auth page, rename the `web/src/auth.tsx` file to `web/src/authentication.tsx`, and update the imports (related to https://github.com/redwoodjs/redwood/issues/9740). diff --git a/packages/auth-providers/supertokens/setup/src/templates/api/lib/supertokens.ts.template b/packages/auth-providers/supertokens/setup/src/templates/api/lib/supertokens.ts.template index 2f338efd1d30..474d4c4e06fb 100644 --- a/packages/auth-providers/supertokens/setup/src/templates/api/lib/supertokens.ts.template +++ b/packages/auth-providers/supertokens/setup/src/templates/api/lib/supertokens.ts.template @@ -9,10 +9,11 @@ const apiGatewayPath = process.env.SUPERTOKENS_API_GATEWAY_PATH || '/.redwood/functions' export const config: TypeInput = { + # The below options are ok here even if you're not running on top of AWS Lambda, since Redwood internally translates Fastify request/response objects to and from the AWS Lambda format. framework: 'awsLambda', isInServerlessEnv: true, appInfo: { - appName: 'SuperTokens RedwoodJS', + appName: process.env.SUPERTOKENS_APP_NAME, apiDomain, websiteDomain, apiGatewayPath, @@ -21,6 +22,7 @@ export const config: TypeInput = { }, supertokens: { connectionURI: process.env.SUPERTOKENS_CONNECTION_URI, + apiKey: process.env.SUPERTOKENS_API_KEY, }, recipeList: [ ThirdPartyEmailPassword.init({ diff --git a/packages/auth-providers/supertokens/setup/src/templates/web/auth.tsx.template b/packages/auth-providers/supertokens/setup/src/templates/web/auth.tsx.template index fcca1de813ba..8cd4dbb14a44 100644 --- a/packages/auth-providers/supertokens/setup/src/templates/web/auth.tsx.template +++ b/packages/auth-providers/supertokens/setup/src/templates/web/auth.tsx.template @@ -26,7 +26,7 @@ export const PreBuiltUI = [ThirdPartyEmailPasswordPreBuiltUI] isBrowser && SuperTokens.init({ appInfo: { - appName: 'SuperTokens RedwoodJS', + appName: process.env.SUPERTOKENS_APP_NAME, apiDomain, websiteDomain, apiGatewayPath, diff --git a/packages/cli-helpers/src/auth/__tests__/fixtures/supertokensSetup/templates/api/lib/supertokens.ts.template b/packages/cli-helpers/src/auth/__tests__/fixtures/supertokensSetup/templates/api/lib/supertokens.ts.template index 9d8727c3841d..4b0089a4a94e 100644 --- a/packages/cli-helpers/src/auth/__tests__/fixtures/supertokensSetup/templates/api/lib/supertokens.ts.template +++ b/packages/cli-helpers/src/auth/__tests__/fixtures/supertokensSetup/templates/api/lib/supertokens.ts.template @@ -26,6 +26,7 @@ export const config = { }, supertokens: { connectionURI: process.env.SUPERTOKENS_CONNECTION_URI, + apiKey: process.env.SUPERTOKENS_API_KEY, }, recipeList: [ ThirdPartyEmailPassword.init({ From d9c3c6b4ca1cdb50a06b7c3088efea47e2bc166c Mon Sep 17 00:00:00 2001 From: Ilya Suzdalnitskiy Date: Tue, 26 Dec 2023 12:37:02 -0500 Subject: [PATCH 2/4] supertokens integration fixes --- docs/docs/auth/supertokens.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/auth/supertokens.md b/docs/docs/auth/supertokens.md index 6549de178015..9af39518ad32 100644 --- a/docs/docs/auth/supertokens.md +++ b/docs/docs/auth/supertokens.md @@ -41,7 +41,7 @@ Assuming that your web side is hosted on `https://myapp.com`: ```bash SUPERTOKENS_WEBSITE_DOMAIN=https://myapp.com -SUPERTOKENS_JWKS_URL=https://my.app.com/.redwood/functions/auth/jwt/jwks.json +SUPERTOKENS_JWKS_URL=https://myapp.com/.redwood/functions/auth/jwt/jwks.json ``` ## Managed Supertokens service setup From 5ac3946c6b941787710030276cabe1b0984a1989 Mon Sep 17 00:00:00 2001 From: David Thyresson Date: Wed, 27 Dec 2023 12:07:56 -0500 Subject: [PATCH 3/4] Update docs/docs/auth/supertokens.md Co-authored-by: Rishabh Poddar --- docs/docs/auth/supertokens.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/auth/supertokens.md b/docs/docs/auth/supertokens.md index 9af39518ad32..eda88bc646a0 100644 --- a/docs/docs/auth/supertokens.md +++ b/docs/docs/auth/supertokens.md @@ -25,7 +25,7 @@ When you run the setup command it configures your app to support both email+pass # Environment variables -The environment variables have to be added either to your project's `.env` file (when running in development environment), or to the environment variables of your hosting provider (wher running in production). +The environment variables have to be added either to your project's `.env` file (when running in development environment), or to the environment variables of your hosting provider (where running in production). ## Base setup From a5c54e9db03c5d016e001422fd6e9df05f386adf Mon Sep 17 00:00:00 2001 From: David Thyresson Date: Wed, 27 Dec 2023 12:08:24 -0500 Subject: [PATCH 4/4] Update docs/docs/auth/supertokens.md Co-authored-by: Rishabh Poddar --- docs/docs/auth/supertokens.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/auth/supertokens.md b/docs/docs/auth/supertokens.md index eda88bc646a0..e8d84b09f42e 100644 --- a/docs/docs/auth/supertokens.md +++ b/docs/docs/auth/supertokens.md @@ -30,7 +30,7 @@ The environment variables have to be added either to your project's `.env` file ## Base setup ```bash -SUPERTOKENS_APP_NAME="Redwoodjs App" +SUPERTOKENS_APP_NAME="Redwoodjs App" # this will be used in the email template for password reset or email verification emails. SUPERTOKENS_JWKS_URL=http://localhost:8910/.redwood/functions/auth/jwt/jwks.json SUPERTOKENS_CONNECTION_URI=https://try.supertokens.io # set to the correct connection uri ```