diff --git a/src/pages/[platform]/build-a-backend/auth/concepts/external-identity-providers/index.mdx b/src/pages/[platform]/build-a-backend/auth/concepts/external-identity-providers/index.mdx index f56a392fb74..3b88d9d33cf 100644 --- a/src/pages/[platform]/build-a-backend/auth/concepts/external-identity-providers/index.mdx +++ b/src/pages/[platform]/build-a-backend/auth/concepts/external-identity-providers/index.mdx @@ -368,6 +368,7 @@ await signInWithRedirect({ + {/* @TODO refactor with connect-your-frontend/sign-in */} ## Set up your frontend @@ -387,6 +388,29 @@ await signInWithRedirect({ }); ``` +### Redirect URLs + +_Sign in_ & _Sign out_ redirect URL(s) are used to redirect end users after the sign in or sign out operation has occurred. You may want to specify multiple URLs for various use-cases such as having different URLs for development/ production or redirect users to an intermediate URL before returning them to the app. + +#### Specifying a redirect URL on sign out +If you have multiple sign out redirect URLs configured, you may choose to override the default behavior of selecting a redirect URL and provide the one of your choosing when calling `signOut`. The provided redirect URL should match at least one of the configured redirect URLs. If no redirect URL is provided to `signOut`, one will be selected based on the current app domain. + +```ts +import { Amplify } from 'aws-amplify'; +import { signOut } from 'aws-amplify/auth'; + +// Assuming the following URLS were provided manually or via the Amplify configuration file, +// redirectSignOut: 'http://localhost:3000/,https://authProvider/logout?logout_uri=https://mywebsite.com/' + +signOut({ + global: false, + oauth: { + redirectUrl: 'https://authProvider/logout?logout_uri=https://mywebsite.com/' + } +}); + +``` + @@ -430,6 +454,53 @@ When you import and use the `signInWithRedirect` function, it will add a listene + + +## Set up your frontend + + + +If you are using the [Authenticator component](https://ui.docs.amplify.aws/react/connected-components/authenticator/configuration#external-providers) with Amplify, this feature works without any additional code. The guide below is for writing your own implementation. + + + +Use the `signInWithRedirect` API to initiate sign-in with an external identity provider. + +```ts title="src/my-client-side-js.js" +import { signInWithRedirect } from 'aws-amplify/auth'; + +signInWithRedirect({ + provider: 'Apple' +}); + +``` + +### Redirect URLs + +_Sign in_ & _Sign out_ redirect URL(s) are used to redirect end users after the sign in or sign out operation has occurred. You may want to specify multiple URLs for various use-cases such as having different URLs for development/ production or redirect users to an intermediate URL before returning them to the app. + +#### Specifying a redirect URL on sign out +If you have multiple sign out redirect URLs configured, you may choose to override the default behavior of selecting a redirect URL and provide the one of your choosing when calling `signOut`. The provided redirect URL should match at least one of the configured redirect URLs. If no redirect URL is provided to `signOut`, the first item from the the configured redirect URLs list that does not contain a HTTP nor HTTPS prefix will be picked. + +```ts +import { Amplify } from 'aws-amplify'; +import { signOut } from 'aws-amplify/auth'; + +// Assuming the following URLS were provided manually or via the Amplify configuration file, +// redirectSignOut: 'myDevApp://,https://authProvider/logout?logout_uri=myDevApp://' + +signOut({ + global: false, + oauth: { + redirectUrl: 'https://authProvider/logout?logout_uri=myDevApp://' + } +}); + +``` + Irrespective of whether a `redirectUrl` is provided to `signOut`, a URL that does not contain http or https is expected to be present in the configured redirect URL list. This is because iOS requires an appScheme when creating the web session. + + + ## Next steps - [Learn how to sign in with external providers](/[platform]/build-a-backend/auth/connect-your-frontend/sign-in/#sign-in-with-an-external-identity-provider) diff --git a/src/pages/gen1/[platform]/build-a-backend/auth/add-social-provider/index.mdx b/src/pages/gen1/[platform]/build-a-backend/auth/add-social-provider/index.mdx index 32916530850..8d42c1c6764 100644 --- a/src/pages/gen1/[platform]/build-a-backend/auth/add-social-provider/index.mdx +++ b/src/pages/gen1/[platform]/build-a-backend/auth/add-social-provider/index.mdx @@ -739,40 +739,40 @@ function App() { - +### Redirect URLs - +_Sign in_ & _Sign out_ redirect URL(s) are used to redirect end users after the sign in or sign out operation has occurred. You may want to specify multiple URLs for various use-cases such as having different URLs for development/ production or redirect users to an intermediate URL before returning them to the app. -### Redirect URLs +#### Specifying a redirect URL on sign out +If you have multiple sign out redirect URLs configured, you may choose to override the default behavior of selecting a redirect URL and provide the one of your choosing when calling `signOut`. The provided redirect URL should match at least one of the configured redirect URLs. If no redirect URL is provided to `signOut`, the first item from the the configured redirect URLs list that does not contain a HTTP nor HTTPS prefix will be picked. -For _Sign in Redirect URI(s)_ inputs, you can put one URI for local development and one for production. Example: `http://localhost:3000/` in dev and `https://www.example.com/` in production. The same is true for _Sign out redirect URI(s)_. +```ts +import { Amplify } from 'aws-amplify'; +import { signOut } from 'aws-amplify/auth'; -If you have multiple redirect URI inputs, you'll need to pass them in your Amplify configuration. For example: +// Assuming the following URLS were provided manually or via the Amplify configuration file, +// redirectSignOut: 'myDevApp://,https://authProvider/logout/?logout_uri=myDevApp://' -```javascript -Amplify.configure({ - Auth: { - Cognito: { - loginWith: { - oauth: { - redirectSignIn: [ - 'http://localhost:3000/', - 'https://www.example.com/' - ], - redirectSignOut: [ - 'http://localhost:3000/', - 'https://www.example.com/' - ], - ...oauthConfig - } - }, - ...userPoolConfig - } +signOut({ + global: false, + oauth: { + redirectUrl: 'https://authProvider/logout/?logout_uri=myDevApp://' } }); + + ``` + Irrespective of whether a `redirectUrl` is provided to `signOut`, a URL that does not contain http or https is expected to be present in the configured redirect URL list. This is because iOS requires an appScheme when creating the web session. + + + + + +### Redirect URLs - +_Sign in_ & _Sign out_ redirect URL(s) are used to redirect end users after the sign in or sign out operation has occurred. You may want to specify multiple URLs for various use-cases such as having different URLs for development (`http://localhost:3000/`) production (`https://www.example.com/`) or redirect users to an intermediate URL before returning them to the app. + + @@ -943,6 +943,25 @@ function App() { +#### Specifying a redirect URL on sign out +If you have multiple redirect URLs configured, you may choose to override the default behavior of selecting a redirect URL and provide the one of your choosing when calling `signOut`. The provided redirect URL should match at least one of the configured redirect URLs. If no redirect URL is provided to `signOut`, one will be selected based on the current app domain. + +```ts +import { Amplify } from 'aws-amplify'; +import { signOut } from 'aws-amplify/auth'; + +// Assuming the following URLS were provided manually or via the Amplify configuration file, +// redirectSignOut: 'http://localhost:3000/,https://www.example.com/' + +signOut({ + global: false, + oauth: { + redirectUrl: 'https://www.example.com/' + } +}); + +``` + ### (Required for Multi-Page Applications) Complete Social Sign In after Redirect If you are developing a multi-page application, and the redirected page is not the same page that initiated the sign in, you will need to add the following code to the redirected page to ensure the sign in gets completed: