From 7d9f1ab71a3f7b83232a436c0e26047abfe31e31 Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Wed, 8 Jun 2022 11:55:08 +0200 Subject: [PATCH 1/3] docs: add dynamic client registration code example for golang --- docs/guides/protect-page-login/spa.mdx | 88 +++++++++++++ ...id-connect-dynamic-client-registration.mdx | 122 ++++++++++++++++++ 2 files changed, 210 insertions(+) create mode 100644 docs/guides/protect-page-login/spa.mdx diff --git a/docs/guides/protect-page-login/spa.mdx b/docs/guides/protect-page-login/spa.mdx new file mode 100644 index 000000000..f2b5a3932 --- /dev/null +++ b/docs/guides/protect-page-login/spa.mdx @@ -0,0 +1,88 @@ +--- +id: spa +title: Protect a Single Page App with Login +sidebar_label: Single Page App +sidebar_position: 1 +--- + +```mdx-code-block +import Teaser from '../_common/teaser.mdx' +import mp4 from '../_static/nextjs/screencast.mp4' +import webm from '../_static/nextjs/screencast.webm' + +Next.js} + mp4={mp4} + webm={webm} +/> +``` + +## Create Next.js App + +First we create a new Next.js project: + +```shell-session +npx create-next-app@latest --typescript +cd +``` + +## Install Ory + +Ory provides integration tools that quickly combine Ory with Next.js. Let's install Ory's SDK, used to make API calls to Ory, and +Ory's Integration Tools for JavaScript frameworks: + +```shell-session +npm i --save @ory/integrations @ory/client +``` + +and create a special route in `[...paths].js` at `pages/api/.ory/`. + +```mdx-code-block +import CodeBlock from '@theme/CodeBlock' +import apiRoute from '!!raw-loader!../../../code-examples/protect-page-login/nextjs/pages/api/.ory/\[...paths\].ts' + +{apiRoute} +``` + +This route connects your Next.js app with Ory's APIs and ensures that all cookies and credentials are set up. Without it, your +Next.js application won't be able to talk to Ory's APIs. + +## Require Login to Access the Home Page + +Next we add a session check to the default home page of the Next.js example application.The highlighted code is what we added to +check whether the user is signed in, and redirect them to the login page if not: + +```mdx-code-block +import homePage from '!!raw-loader!../../../code-examples/protect-page-login/nextjs/pages/index.tsx' + +{homePage} +``` + +## Run your Next.js App + +Great, that's it! Let's run your application! Set up your environment variables to connect with Ory's APIs + +```mdx-code-block +import SdkEnvVar from '@site/src/components/SdkEnvVar' + + +``` + +and start the Next.js development server: + +```shell-session +npm run dev +``` + +Then open [http://localhost:3000](http://localhost:3000) in your browser. are presented with Ory's Sign In page! Let's click on +sign up and create your first user! + +## Go to Production + +Release your app bundled with Ory to production using: + +```mdx-code-block +import VercelDeploy from '@site/src/components/VercelDeploy' + + +``` diff --git a/docs/hydra/guides/openid-connect-dynamic-client-registration.mdx b/docs/hydra/guides/openid-connect-dynamic-client-registration.mdx index 2c4ef6ef1..a0abb0876 100644 --- a/docs/hydra/guides/openid-connect-dynamic-client-registration.mdx +++ b/docs/hydra/guides/openid-connect-dynamic-client-registration.mdx @@ -33,7 +33,39 @@ Enabling this feature will add listeners to the following four routes at the pub If OpenID Connect Dynamic Client Registration is enabled, registering a new OAuth2 Client is as simple as: +````mdx-code-block +import Tabs from '@theme/Tabs' +import TabItem from '@theme/TabItem' + + + + +```go +import ory "github.com/ory/client-go" + +func newSDK(port int, host string) *ory.APIClient { + conf := ory.NewConfiguration() + conf.Servers = ory.ServerConfigurations{ory.ServerConfiguration{URL: "https://.projects.oryapis.com"}} + return ory.NewAPIClient(conf) +} + +func createDynamicClient() (*ory.OAuth2Client, error) { + c, _, err := newSDK().V0Alpha2. + DynamicClientRegistrationCreateOAuth2Client(context.Background()). + OAuth2Client(ory.OAuth2Client{ /* ClientName: "..." */ }).Execute() + return c, err +} ``` + + + + +```shell POST /oauth2/register Content-Type: application/json @@ -44,6 +76,10 @@ Content-Type: application/json } ``` + + +```` + :::note The `registration_access_token` will only be sent once! You need to store this token in a secure location. This token will be used @@ -62,7 +98,33 @@ also not be read using OpenID Connect Dynamic Client Registration endpoints! The `POST` endpoint requires the client to authenticate with the `registration_access_token` regardless of the `token_endpoint_auth_method`. It can be used to update the OAuth2 Client. +````mdx-code-block + + + +```go +// ... +func updateDynamicClient(client *ory.OAuth2Client) (*ory.OAuth2Client, error) { + c, _, err := newSDK(publicPort, host).V0Alpha2. + DynamicClientRegistrationUpdateOAuth2Client( + context.WithValue(context.Background(), hydra.ContextAccessToken, *client.RegistrationAccessToken), + *client.ClientId, + ). + OAuth2Client(*client). + Execute() + return c, err +} ``` + + + + +```shell PUT /oauth2/register/{client_id} Authorization: Bearer Content-Type: application/json @@ -73,6 +135,10 @@ Content-Type: application/json } ``` + + +```` + The response will include the updated OAuth2 Client. :::note @@ -94,7 +160,31 @@ When updating the OAuth2 Client, the server will respond with a new registration The `GET` endpoint requires the client to authenticate with the `registration_access_token` regardless of the `token_endpoint_auth_method`. It can be used to retrieve the OAuth2 Client. +````mdx-code-block + + + +```go +// ... +func getDynamicClient(client *ory.OAuth2Client) (*ory.OAuth2Client, error) { + c, _, err := newSDK(publicPort, host).V0Alpha2. + DynamicClientRegistrationGetOAuth2Client( + context.WithValue(context.Background(), hydra.ContextAccessToken, *client.RegistrationAccessToken), + *client.ClientId, + ).Execute() + return c, err +} ``` + + + + +```shell GET /oauth2/register/{client_id} Authorization: Bearer Content-Type: application/json @@ -105,12 +195,44 @@ Content-Type: application/json } ``` + + +```` + ## Delete OAuth2 & OpenID Connect Clients The `DELETE` endpoint requires the client to authenticate with the `registration_access_token` regardless of the `token_endpoint_auth_method`. It can be used to delete the OAuth2 Client. +````mdx-code-block + + + +```go +// ... +func deleteDynamicClient(client *ory.OAuth2Client) (error) { + _, err := newSDK(publicPort, host).V0Alpha2. + DynamicClientRegistrationDeleteOAuth2Client( + context.WithValue(context.Background(), hydra.ContextAccessToken, *client.RegistrationAccessToken), + *client.ClientId, + ).Execute() + return err +} ``` + + + + +```shell DELETE /oauth2/register/{client_id} Authorization: Bearer ``` + + + +```` From d0fb9738b50c3ccb0527c4eed6c80193f3676abf Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Wed, 8 Jun 2022 12:12:50 +0200 Subject: [PATCH 2/3] u --- .../guides/openid-connect-dynamic-client-registration.mdx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/docs/hydra/guides/openid-connect-dynamic-client-registration.mdx b/docs/hydra/guides/openid-connect-dynamic-client-registration.mdx index a0abb0876..a433317fc 100644 --- a/docs/hydra/guides/openid-connect-dynamic-client-registration.mdx +++ b/docs/hydra/guides/openid-connect-dynamic-client-registration.mdx @@ -117,6 +117,10 @@ func updateDynamicClient(client *ory.OAuth2Client) (*ory.OAuth2Client, error) { ). OAuth2Client(*client). Execute() + + // Don't forget to store the update `registration_access_token`! + // newToken := *c.RegistrationAccessToken + return c, err } ``` From f80db80dbd8b34dd0a86e1b4b023a1252fe2d290 Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Fri, 17 Jun 2022 16:47:58 +0200 Subject: [PATCH 3/3] fix: remove obsolete page --- docs/guides/protect-page-login/spa.mdx | 88 -------------------------- 1 file changed, 88 deletions(-) delete mode 100644 docs/guides/protect-page-login/spa.mdx diff --git a/docs/guides/protect-page-login/spa.mdx b/docs/guides/protect-page-login/spa.mdx deleted file mode 100644 index f2b5a3932..000000000 --- a/docs/guides/protect-page-login/spa.mdx +++ /dev/null @@ -1,88 +0,0 @@ ---- -id: spa -title: Protect a Single Page App with Login -sidebar_label: Single Page App -sidebar_position: 1 ---- - -```mdx-code-block -import Teaser from '../_common/teaser.mdx' -import mp4 from '../_static/nextjs/screencast.mp4' -import webm from '../_static/nextjs/screencast.webm' - -Next.js} - mp4={mp4} - webm={webm} -/> -``` - -## Create Next.js App - -First we create a new Next.js project: - -```shell-session -npx create-next-app@latest --typescript -cd -``` - -## Install Ory - -Ory provides integration tools that quickly combine Ory with Next.js. Let's install Ory's SDK, used to make API calls to Ory, and -Ory's Integration Tools for JavaScript frameworks: - -```shell-session -npm i --save @ory/integrations @ory/client -``` - -and create a special route in `[...paths].js` at `pages/api/.ory/`. - -```mdx-code-block -import CodeBlock from '@theme/CodeBlock' -import apiRoute from '!!raw-loader!../../../code-examples/protect-page-login/nextjs/pages/api/.ory/\[...paths\].ts' - -{apiRoute} -``` - -This route connects your Next.js app with Ory's APIs and ensures that all cookies and credentials are set up. Without it, your -Next.js application won't be able to talk to Ory's APIs. - -## Require Login to Access the Home Page - -Next we add a session check to the default home page of the Next.js example application.The highlighted code is what we added to -check whether the user is signed in, and redirect them to the login page if not: - -```mdx-code-block -import homePage from '!!raw-loader!../../../code-examples/protect-page-login/nextjs/pages/index.tsx' - -{homePage} -``` - -## Run your Next.js App - -Great, that's it! Let's run your application! Set up your environment variables to connect with Ory's APIs - -```mdx-code-block -import SdkEnvVar from '@site/src/components/SdkEnvVar' - - -``` - -and start the Next.js development server: - -```shell-session -npm run dev -``` - -Then open [http://localhost:3000](http://localhost:3000) in your browser. are presented with Ory's Sign In page! Let's click on -sign up and create your first user! - -## Go to Production - -Release your app bundled with Ory to production using: - -```mdx-code-block -import VercelDeploy from '@site/src/components/VercelDeploy' - - -```