Skip to content

Commit e0dc86e

Browse files
mikey-tmikey-t
committed
Updated dependencies.
Updated external login doc.
1 parent a917852 commit e0dc86e

File tree

3 files changed

+143
-123
lines changed

3 files changed

+143
-123
lines changed

‎docs/ExternalLogins.md

+46-12
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,11 @@
44

55
## Code Locations
66

7-
Application entry point `src/client/index.html` in the `<head>` section:
7+
Application entry point `src/client/index.html` in the `<head>` section ([COOP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cross-Origin-Opener-Policy) header required to avoid errors during google auth popup):
88

99
```html
1010
<script src="https://accounts.google.com/gsi/client" async defer></script>
11+
<meta http-equiv="Cross-Origin-Opener-Policy" content="same-origin-allow-popups">
1112
```
1213

1314
Button components:
@@ -40,6 +41,25 @@ Service endpoints: `WebServer/Controllers/AccountController.cs`:
4041
- `LoginMicrosoft`
4142
- `MicrosoftLoginRedirect`
4243

44+
## Third Party Library Dependencies
45+
46+
Npm dependencies:
47+
48+
- @azure/msal-browser
49+
50+
Npm dev dependencies:
51+
52+
- @types/gtag.js
53+
- @types/google.accounts
54+
- @types/google-one-tap
55+
56+
Nuget packages:
57+
58+
- Google.Apis.Auth
59+
- Microsoft.AspNetCore.Authentication.Google
60+
- Microsoft.AspNetCore.Authentication.JwtBearer
61+
62+
4363
## Account Setup
4464

4565
These UI's change from time to time so this might not be exactly how to do it, but it should be similar.
@@ -48,21 +68,28 @@ These UI's change from time to time so this might not be exactly how to do it, b
4868

4969
Azure -> App Registrations
5070

71+
Initial screen asks for display name. Ignore the redirect URIs initially - those will be updated later.
72+
73+
After creation, there should be a "Manage" left nav link - most of the config options are within this submenu.
74+
5175
Important fields:
5276

53-
- Branding and properties: Publisher domain
77+
- Branding and properties -> Publisher domain (follow instructions to verify a new domain if you haven't done through that process yet)
5478
- Authentication
55-
- Add Web. Examples:
56-
- https://local.drs.mikeyt.net.com:3000/api/account/microsoft-login-redirect-web
57-
- https://drs.mikeyt.net/api/account/microsoft-login-redirect-web
58-
- Add SPA. Examples:
59-
- https://drs.mikeyt.net/api/account/microsoft-login-redirect
60-
- https://local.drs.mikeyt.net:3000/api/account/microsoft-login-redirect
79+
- Add "Web" by selecting "add a platform" and selecting "Web". The initial UI only gives the option to enter one URL, so enter the first, save, then go back and edit/add the other.
80+
- Example redirect for local: https://local.drs.mikeyt.net.com:3000/api/account/microsoft-login-redirect-web
81+
- Example redirect for live: https://drs.mikeyt.net/api/account/microsoft-login-redirect-web
82+
- Note that you can't add a "front-channel logout URL" that makes sense for multiple environments - you would need to setup separate accounts for each environment in this case
83+
- Add "Single Page Application" (SPA) by selecting "add a platform" again and selecting "Single-page application" (might be called something slightly different)
84+
- Example for local: https://local.drs.mikeyt.net:3000/api/account/microsoft-login-redirect
85+
- Example for live: https://drs.mikeyt.net/api/account/microsoft-login-redirect
6186
- Supported account types: "Accounts in any organizational directory"
6287
- "Live SDK support": Yes
6388
- "Allow public client flows": No
6489
- API Permissions
65-
- Microsoft Graph User.Read
90+
- Microsoft Graph User.Read (might be setup by default)
91+
92+
The client_id you need to copy into your client code is also called the "application id" and can be found in the app "overview" section.
6693

6794
Other notes:
6895

@@ -73,13 +100,20 @@ Other notes:
73100
Google developer console
74101

75102
- Create a project
76-
- Create an OAuth 2.0 credential
103+
- Create an OAuth 2.0 credential (left nav, OAuth consent screen -> External user type)
77104
- Add all appropriate javascript origins, including ports for local development. Examples:
78105
- https://local.drs.mikeyt.net
79106
- https://local.drs.mikeyt.net:3000
80107
- https://drs.mikeyt.net
81108
- In OAuth consent screen there is an "edit app" button, be sure to set "Your non-sensitive scopes" to have .../auth/userinfo.email, .../auth/userinfo.profile and openid
82109

83-
Code required:
110+
Create API credential:
84111

85-
- Index.html (or other application entry point): <script src="https://accounts.google.com/gsi/client" async defer></script>
112+
- Left nav, Credentials -> top nav, create credential -> OAuth Client Id
113+
- Application type: Web Application
114+
- Name it something like "MyApp OAuth Credential"
115+
- Add authorized javascript origins, example list:
116+
- https://local.mydomain.com
117+
- https://local.mydomain.com:3000
118+
- https://mydomain.com
119+
- Copy down client id and client secret to secure location

‎package.json

+8-8
Original file line numberDiff line numberDiff line change
@@ -7,18 +7,18 @@
77
"pnpmInstall": "pnpm install && cd ./client && pnpm install"
88
},
99
"devDependencies": {
10-
"@mikeyt23/node-cli-utils": "^2.0.35",
11-
"@types/node": "^20.12.2",
12-
"@typescript-eslint/eslint-plugin": "^7.4.0",
13-
"@typescript-eslint/parser": "^7.4.0",
10+
"@mikeyt23/node-cli-utils": "^2.0.36",
11+
"@types/node": "^20.12.12",
12+
"@typescript-eslint/eslint-plugin": "^7.10.0",
13+
"@typescript-eslint/parser": "^7.10.0",
1414
"dotenv": "^16.4.5",
1515
"eslint": "^8.57.0",
16-
"swig-cli": "^1.0.1",
16+
"swig-cli": "^1.0.3",
1717
"swig-cli-modules": "^0.3.3",
18-
"tsx": "^4.7.1",
19-
"typescript": "^5.4.3"
18+
"tsx": "^4.11.0",
19+
"typescript": "^5.4.5"
2020
},
2121
"volta": {
22-
"node": "20.10.0"
22+
"node": "20.13.1"
2323
}
2424
}

0 commit comments

Comments
 (0)