Loading...
; + } + + const handleLogout = useCallback(() => { + sdk.logout(); + }, [sdk]); + + if (isAuthenticated) { + return ( + <> +Hello {user.name}
+ + + ); + } + + returnYou are not logged in
; +}; +``` + +#### Server Side Usage + +##### Require authentication for application (Middleware) + +You can use NextJS Middleware to require authentication for a page/route or a group of pages/routes. + +Descope SDK provides a middleware function that can be used to require authentication for a page/route or a group of pages/routes. + +```js +// src/middleware.ts +import { authMiddleware } from '@descope/nextjs-sdk/server' + +export default authMiddleware({ + // The Descope project ID to use for authentication + // Defaults to process.env.DESCOPE_PROJECT_ID + projectId: 'your-descope-project-id' + + // The URL to redirect to if the user is not authenticated + // Defaults to process.env.SIGN_IN_ROUTE or '/sign-in' if not provided + redirectUrl?: string + + // An array of public routes that do not require authentication + // In addition to the default public routes: + // - process.env.SIGN_IN_ROUTE or /sign-in if not provided + // - process.env.SIGN_UP_ROUTE or /sign-up if not provided + publicRoutes?: string[] +}) + +export const config = { + matcher: ['/((?!.+\\.[\\w]+$|_next).*)', '/', '/(api|trpc)(.*)'] +} +``` + +##### Read session information in server side + +use the `session()` helper to read session information in Server Components and Route handlers. + +Note: `session()` requires the `authMiddleware` to be used for the Server Component or Route handler that uses it. + +Server Component: + +```js +// src/app/page.tsx + +import { session } from '@descope/nextjs-sdk/server'; + +async function Page() { + const sessionRes = session(); + if (!sessionRes) { + // ... + } + // Use the session jwt or parsed token + const { jwt, token } = sessionRes; +} +``` + +Route handler: + +```js +// src/pages/api/routes.ts +export async function GET() { + const currSession = session(); + if (!currSession.isAuthenticated) { + // ... + } + + // Use the session jwt or parsed token + const { jwt, token } = currSession; +} +``` + +#### Access Descope SDK in server side + +Use `createSdk` function to create Descope SDK in server side. + +Refer to the [Descope Node SDK](https://github.com/descope/node-sdk/?tab=readme-ov-file#authentication-functions) for a list of available functions. + +Usage example in Route handler: + +```js +// src/pages/api/routes.ts +import { createSdk } from '@descope/nextjs-sdk/server'; + +const sdk = createSdk({ + // The Descope project ID to use for authentication + // Defaults to process.env.DESCOPE_PROJECT_ID + projectId: 'your-descope-project-id', + + // The Descope management key to use for management operations + // Defaults to process.env.DESCOPE_MANAGEMENT_KEY + managementKey: 'your-descope-management-key' +}); + +export async function GET(req) { + const { searchParams } = new URL(req.url); + const loginId = searchParams.get('loginId'); + + const { ok, data: user } = await sdk.management.user.load(loginId); + if (!ok) { + // ... + } + // Use the user data ... +} +``` + +### Pages Router + +This section is Working in progress :-) +In the meantime, you can see the example in the [Pages Router](/examples/pages-router/) folder. + +## Code Example + +You can find an example react app in the [examples folder](./examples). - [App Router](/examples/app-router/) - [Pages Router](/examples/pages-router/) + +## Learn More + +To learn more please see the [Descope Documentation and API reference page](https://docs.descope.com/). + +## Contact Us + +If you need help you can email [Descope Support](mailto:support@descope.com) + +## License + +The Descope SDK for React is licensed for use under the terms and conditions of the [MIT license Agreement](./LICENSE). diff --git a/examples/app-router/README.md b/examples/app-router/README.md new file mode 100644 index 0000000..2ae18d6 --- /dev/null +++ b/examples/app-router/README.md @@ -0,0 +1,46 @@ +# App Router Example + +This example demonstrates how to use NextJS Descope SDK in an App Router. + +## Setup + +1. Build the sdk package: + +```bash +(cd ../../ && npm run build) +``` + +2. Install dependencies: + +```bash +npm install +``` + +3. Set environment variables using the `.env` file: + +```bash +NEXT_PUBLIC_DESCOPE_PROJECT_ID=