Skip to content

Commit 666ba7d

Browse files
josefaidtjosefaidt
committed
start example for entra id saml
1 parent 7b78257 commit 666ba7d

File tree

6 files changed

+207
-0
lines changed

6 files changed

+207
-0
lines changed

‎public/images/auth/examples/microsoft-entra-id-saml/entra-id-new-enterprise-application.png‎

163 KB
Loading

‎public/images/auth/examples/microsoft-entra-id-saml/entra-id-new-registration.png‎

160 KB
Loading

‎public/images/auth/examples/microsoft-entra-id-saml/entra-id-register-an-app-redirect-uri.png‎

125 KB
Loading

‎src/directory/directory.mjs‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -162,6 +162,14 @@ export const directory = {
162162
{
163163
path: 'src/pages/[platform]/build-a-backend/auth/data-usage-policy/index.mdx'
164164
},
165+
{
166+
path: 'src/pages/[platform]/build-a-backend/auth/examples/index.mdx',
167+
children: [
168+
{
169+
path: 'src/pages/[platform]/build-a-backend/auth/examples/microsoft-entra-id-saml/index.mdx'
170+
}
171+
]
172+
},
165173
{
166174
path: 'src/pages/[platform]/build-a-backend/auth/grant-access-to-auth-resources/index.mdx'
167175
},

‎src/pages/[platform]/build-a-backend/auth/examples/index.mdx‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import { getChildPageNodes } from '@/utils/getChildPageNodes';
2+
import { getCustomStaticPath } from '@/utils/getCustomStaticPath';
3+
4+
export const meta = {
5+
title: 'Examples',
6+
description:
7+
'Learn how to address different business use cases with Amplify Auth',
8+
route: '/[platform]/build-a-backend/auth/examples',
9+
platforms: [
10+
'android',
11+
'angular',
12+
'flutter',
13+
'javascript',
14+
'nextjs',
15+
'react',
16+
'react-native',
17+
'swift',
18+
'vue'
19+
]
20+
};
21+
22+
export function getStaticPaths() {
23+
return getCustomStaticPath(meta.platforms);
24+
}
25+
26+
export function getStaticProps() {
27+
const childPageNodes = getChildPageNodes(meta.route);
28+
return {
29+
props: {
30+
meta,
31+
childPageNodes
32+
}
33+
};
34+
}
35+
36+
<Overview childPageNodes={props.childPageNodes} />

‎src/pages/[platform]/build-a-backend/auth/examples/microsoft-entra-id-saml/index.mdx‎

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
import { getCustomStaticPath } from '@/utils/getCustomStaticPath';
2+
3+
export const meta = {
4+
title: 'Microsoft Entra ID (SAML)',
5+
description: 'Learn how to connect a Microsoft Entra ID provider with SAML',
6+
platforms: [
7+
'android',
8+
'angular',
9+
'flutter',
10+
'javascript',
11+
'nextjs',
12+
'react',
13+
'react-native',
14+
'swift',
15+
'vue'
16+
]
17+
};
18+
19+
export function getStaticPaths() {
20+
return getCustomStaticPath(meta.platforms);
21+
}
22+
23+
export function getStaticProps() {
24+
return {
25+
props: {
26+
meta,
27+
}
28+
};
29+
}
30+
31+
Microsoft Entra ID can be configured as a SAML provider for use with Amazon Cognito.
32+
33+
<Callout warning>
34+
35+
**Warning:** there is a known limitation where upstream sign-out functionality successfully signs out of Entra ID, but fails to redirect back to the user app.
36+
37+
</Callout>
38+
39+
To get started, define your Amplify Auth resource with the appropriate redirect URIs:
40+
41+
```ts title="amplify/auth/resource.ts"
42+
import { defineAuth } from "@aws-amplify/backend"
43+
44+
/**
45+
* Define and configure your auth resource
46+
* @see https://docs.amplify.aws/gen2/build-a-backend/auth
47+
*/
48+
export const auth = defineAuth({
49+
loginWith: {
50+
email: true,
51+
externalProviders: {
52+
logoutUrls: ["http://localhost:3000/come-back-soon"],
53+
callbackUrls: ["http://localhost:3000/profile"],
54+
},
55+
},
56+
})
57+
```
58+
59+
Deploy to your personal cloud sandbox with `npx ampx sandbox`. This will generate a domain you can use to configure your new Entra ID App. After deploying your changes successfully, copy the generated `domain` value from `amplify_outputs.json`
60+
61+
```json title="amplify_outputs.json"
62+
{
63+
"auth": {
64+
"aws_region": "us-east-1",
65+
"user_pool_id": "<your-cognito-user-pool-id>",
66+
"user_pool_client_id": "<your-cognito-user-pool-client-id>",
67+
"identity_pool_id": "<your-cognito-identity-pool-id>",
68+
"mfa_methods": [],
69+
"standard_required_attributes": [
70+
"email"
71+
],
72+
"username_attributes": [
73+
"email"
74+
],
75+
"user_verification_types": [
76+
"email"
77+
],
78+
"mfa_configuration": "OFF",
79+
"password_policy": {
80+
"min_length": 8,
81+
"require_numbers": true,
82+
"require_lowercase": true,
83+
"require_uppercase": true,
84+
"require_symbols": true
85+
},
86+
"oauth": {
87+
"identity_providers": [],
88+
"redirect_sign_in_uri": [
89+
"http://localhost:3000/profile"
90+
],
91+
"redirect_sign_out_uri": [
92+
"http://localhost:3000/come-back-soon"
93+
],
94+
"response_type": "code",
95+
"scopes": [
96+
"phone",
97+
"email",
98+
"openid",
99+
"profile",
100+
"aws.cognito.signin.user.admin"
101+
],
102+
// highlight-next-line
103+
"domain": "<some-hash>.auth.us-east-1.amazoncognito.com"
104+
},
105+
},
106+
"version": "1"
107+
}
108+
```
109+
110+
Next, navigate to [portal.amazon.com](https://portal.azure.com/), select **Entra ID**. In your default directory, or company's existing directory, under **Manage**, select **Enterprise Applications**
111+
112+
{/* @TODO update screenshot for enterprise apps */}
113+
![Azure portal highlighting App Registrations and New registration in Entra ID](/images/auth/examples/microsoft-entra-id-saml/entra-id-new-registration.png)
114+
115+
Afterwards, select **New application**, then select **Create your own application**. Specify a name for the application and choose **Register an application to integrate with Entra ID (App you're developing)**
116+
117+
![Azure portal highlighting App Registrations and New registration in Entra ID](/images/auth/examples/microsoft-entra-id-saml/entra-id-new-enterprise-application.png)
118+
119+
Select **Complete**. After being redirected to the **Register an application** form, specify a name for your Entra ID App -- this is the name of the app that will integrate with Amazon Cognito (e.g. `amplify-gen2-saml-with-entra-id`). Using the domain copied from the generated `amplify_outputs.json` file, specify a **Redirect URI (Optional)** as a **Web** redirect
120+
121+
<Callout info>
122+
123+
**Note:** redirect URIs for SAML providers follow the convention:
124+
125+
```text showLineNumbers={false}
126+
https://<some-hash>.auth.<aws-region>.amazoncognito.com/saml2/idpresponse
127+
```
128+
129+
[Learn more about configuring Amazon Cognito with SAML identity providers](https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-user-pools-saml-idp.html)
130+
131+
</Callout>
132+
133+
![Entra ID app registration form with redirect URI specified](/images/auth/examples/microsoft-entra-id-saml/entra-id-register-an-app-redirect-uri.png)
134+
135+
Complete the Entra ID App registration by selecting **Register**.
136+
137+
```ts title="amplify/auth/resource.ts"
138+
import { defineAuth } from "@aws-amplify/backend"
139+
140+
/**
141+
* Define and configure your auth resource
142+
* @see https://docs.amplify.aws/gen2/build-a-backend/auth
143+
*/
144+
export const auth = defineAuth({
145+
loginWith: {
146+
email: true,
147+
externalProviders: {
148+
saml: {
149+
name: "MicrosoftEntraIDSAML",
150+
metadata: {
151+
metadataType: "URL",
152+
metadataContent: "<your-metadata-content-url>",
153+
},
154+
attributeMapping: {
155+
email: "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress",
156+
},
157+
},
158+
logoutUrls: ["http://localhost:3000/come-back-soon"],
159+
callbackUrls: ["http://localhost:3000/profile"],
160+
},
161+
},
162+
})
163+
```

0 commit comments

Comments
 (0)