Skip to content

Commit ae33a7e

Browse files
authored
docs: update OAuth and CORS docs (#1091)
1 parent a37aa50 commit ae33a7e

File tree

3 files changed

+8
-34
lines changed

3 files changed

+8
-34
lines changed

docs/cors.md

Lines changed: 5 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -23,43 +23,16 @@ Included in this repository are scripts and source code that hopefully reduce th
2323

2424
- [OAuth application registration](../packages/sdk-codegen-scripts/scripts/register.ts) is a Node script that can create and update an OAuth app configuration
2525
- a sample OAuth application configuration file [`appconfig.json`](../packages/sdk-codegen-scripts/scripts/appconfig.json) has the configuration for the stand-alone [API Explorer](../packages/api-explorer) in this repository
26-
- a working [`readConfig` override](../packages/run-it/src/utils/RunItSDK.ts) provides the values required by `OAuthSession`
27-
- a working React-based [OAuth handler](../packages/run-it/src/scenes/OAuthScene) processes OAuth authentications and "logs in" the SDK
26+
- an [`OAuthConfigProvider`](../packages/extension-utils/src/authUtils.ts) from `@looker/extension-utils` to support OAuth handshakes with the Looker server
2827

2928
## SDK support
3029

3130
Because the OAuth workflow redirects the browser page to the Looker instance to authenticate, then back to your web application, the Browser's [sessionStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage) is used to persist some variables used by the SDK.
3231

33-
### readConfig override
32+
### OAuth requests
3433

35-
`readConfig()` must be overridden to provide the additional configuration values `OAuthSession` needs to complete an OAuth handshake:
36-
37-
- `client_id` is the OAuth application ID and **must match the `client_guid` used for the OAuth application registration**.
38-
- `looker_url` is the url of the Looker application server, typically on port `9999` and **not** the API server, typically on port `19999`.
39-
- `redirect_uri` is the web application page that receives OAuth responses from the looker server, and **must match the `redirect_uri` used for the OAuth application registration**.
40-
41-
The code below is from the [RunIt readConfig() override](../packages/run-it/src/utils/RunItSDK.ts):
42-
43-
```ts
44-
readConfig(_section?: string): IApiSection {
45-
/**
46-
* Use the values that can be resolved dynamically
47-
*/
48-
const url = new URL(this.base_url)
49-
const oauthServer = `${url.protocol}//${url.hostname}`
50-
return {
51-
...super.readConfig(_section),
52-
...{
53-
client_id: 'looker.api-explorer',
54-
looker_url: `${oauthServer}:9999`,
55-
redirect_uri: `${window.location.origin}/oauth`,
56-
},
57-
}
58-
}
59-
60-
```
61-
62-
To make this code as generic as possible, `looker_url` is based on `base_url` and redirect_uri is calculated from the running web application.
34+
API Explorer uses a package called "RunIt" to make its API requests. The [`initRunItSDK` function](../packages/run-it/src/utils/RunItSDK.ts) uses the [`OAuthConfigProvider`](../packages/extension-utils/src/authUtils.ts).
35+
This sets up the authentication session for OAuth.
6336

6437
### Automatic login
6538

@@ -79,7 +52,6 @@ Therefore, `OAuthSession.login()` has three different branches:
7952
- the `code_verifier` (used for OAuth crypto) is saved to `sessionStorage`
8053
- the browser session redirects to the Looker server OAuth authentication url
8154
1. if `returnUrl` is in `sessionStorage`:
82-
8355
- the return url is saved locally in `login()` and the `sessionStorage` is cleared
8456
- the authentication `code` sent by Looker to the `redirect_uri` is used to redeem the Looker authentication code and get an API token.
8557
- `OAuthSession.activeToken` is assigned this API token
@@ -88,6 +60,6 @@ Therefore, `OAuthSession.login()` has three different branches:
8860

8961
Because the OAuth `code` is retrieved from the current browser url, the final `OAuthSession.login()` must be called directly from the `redirect_uri` page.
9062

91-
[OAuthScene.tsx](../packages/run-it/src/scenes/OAuthScene/OAuthScene.tsx) shows how the `returnUrl` can be captured and used to go back to the original browser location requiring authentication.
63+
[OAuthScene.tsx](../packages/extension-utils/src/OAuthScene.tsx) shows how the `returnUrl` can be captured and used to go back to the original browser location requiring authentication.
9264

9365
**NOTE**: `OAuthSession.activeToken` is **not** saved in `sessionStorage` so it will disappear if the browser page reloads. That's why `history.push()` is used to relocate the browser page for the React application. The `returnUrl` in `sessionStorage` is a relative URI for this same reason.

examplesIndex.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"commitHash": "a4eb5a0b1c9d09f7e45db2a83d30be7ebd707afb",
2+
"commitHash": "2330eef43ed80eff1f3b47eac6b645ab581f2694",
33
"remoteOrigin": "https://github.com/looker-open-source/sdk-codegen",
44
"summaries": {
55
"packages/sdk-codegen/src/codeGenerators.ts": {

packages/extension-utils/README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
# @looker/extension-utils
22

3+
Easier browser-based TypeScript authentication via OAuth, and support for building React applications that can run both inside and outside of [Looker's Extension Framework](https://docs.looker.com/data-modeling/extension-framework/extension-framework-intro) hosting environment.
4+
35
## "Dual mode" Looker browser applications
46

57
This package provides interfaces and classes that support building a Looker application that can be both hosted as

0 commit comments

Comments
 (0)