Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 8f59f6a

Browse files
committed
Handle the code and get the access token
1 parent b090307 commit 8f59f6a

File tree

5 files changed

+276
-3
lines changed

5 files changed

+276
-3
lines changed

‎package-lock.json

Lines changed: 155 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/Callback.js

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
import React, {useEffect, useState} from 'react';
2+
import {
3+
TokenRequest,
4+
BaseTokenRequestHandler,
5+
GRANT_TYPE_AUTHORIZATION_CODE,
6+
AuthorizationServiceConfiguration,
7+
RedirectRequestHandler,
8+
AuthorizationNotifier,
9+
FetchRequestor, LocalStorageBackend, DefaultCrypto
10+
} from '@openid/appauth';
11+
import environment from "./environment";
12+
import {NoHashQueryStringUtils} from './noHashQueryStringUtils';
13+
14+
export const Callback = (props) => {
15+
16+
const [error, setError] = useState(null);
17+
const [code, setCode] = useState(null);
18+
19+
useEffect(function () {
20+
///////////////////////////
21+
const tokenHandler = new BaseTokenRequestHandler(new FetchRequestor());
22+
const authorizationHandler = new RedirectRequestHandler(new LocalStorageBackend(), new NoHashQueryStringUtils(), window.location, new DefaultCrypto());
23+
const notifier = new AuthorizationNotifier();
24+
authorizationHandler.setAuthorizationNotifier(notifier);
25+
notifier.setAuthorizationListener((request, response, error) => {
26+
console.log('Authorization request complete ', request, response, error);
27+
if (response) {
28+
console.log(`Authorization Code ${response.code}`);
29+
30+
let extras = null;
31+
if (request && request.internal) {
32+
extras = {};
33+
extras.code_verifier = request.internal.code_verifier;
34+
}
35+
36+
const tokenRequest = new TokenRequest({
37+
client_id: environment.clientId,
38+
redirect_uri: environment.redirectURL,
39+
grant_type: GRANT_TYPE_AUTHORIZATION_CODE,
40+
code: response.code,
41+
refresh_token: undefined,
42+
extras
43+
});
44+
45+
AuthorizationServiceConfiguration.fetchFromIssuer(environment.OPServer, new FetchRequestor())
46+
.then((oResponse) => {
47+
const configuration = oResponse;
48+
return tokenHandler.performTokenRequest(configuration, tokenRequest);
49+
})
50+
.then((oResponse) => {
51+
localStorage.setItem('access_token', oResponse.accessToken);
52+
props.history.push('/user');
53+
})
54+
.catch(oError => {
55+
setError(oError);
56+
});
57+
}
58+
});
59+
60+
//////////////////////////
61+
const params = new URLSearchParams(props.location.search);
62+
setCode(params.get('code'));
63+
64+
if (!code) {
65+
setError('Unable to get authorization code');
66+
return;
67+
}
68+
authorizationHandler.completeAuthorizationRequestIfPossible();
69+
}, [code, props]);
70+
71+
return (
72+
<div className="container-fluid" style={{marginTop: '10px'}}>
73+
<div className="card">
74+
{
75+
code ?
76+
<div className="card-body">
77+
<h5 className="card-title">Loading...</h5>
78+
</div>
79+
:
80+
<div className="card-body bg-danger">
81+
<div className="card-body">
82+
<p className="card-text">{error}</p>
83+
</div>
84+
</div>
85+
}
86+
</div>
87+
</div>
88+
);
89+
}

‎src/Home.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,11 @@ export const Home = () => {
1111
const [error, setError] = useState(null);
1212
const authorizationHandler = new RedirectRequestHandler(new LocalStorageBackend(), new NoHashQueryStringUtils(), window.location, new DefaultCrypto());
1313
const redirect = () => {
14-
AuthorizationServiceConfiguration.fetchFromIssuer(environment.openid_connect_url, new FetchRequestor())
14+
AuthorizationServiceConfiguration.fetchFromIssuer(environment.OPServer, new FetchRequestor())
1515
.then((response) => {
1616
const authRequest = new AuthorizationRequest({
17-
client_id: environment.client_id,
18-
redirect_uri: environment.redirect_uri,
17+
client_id: environment.clientId,
18+
redirect_uri: environment.redirectURL,
1919
scope: environment.scope,
2020
response_type: AuthorizationRequest.RESPONSE_TYPE_CODE,
2121
state: undefined,

‎src/Profile.js

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import React from 'react';
2+
3+
export const Profile = () => {
4+
return (
5+
<div className="container mt-3">
6+
<div className="card text-white bg-success mb-3">
7+
<div className="card-body">
8+
<p className="card-text">Access Token: </p>
9+
<h5 className="card-title">User info</h5>
10+
<pre className="card-text">userInfo</pre>
11+
</div>
12+
</div>
13+
14+
<div className="card text-white bg-danger mb-3">
15+
<div className="card-body">
16+
<h5 className="card-title">You are un authenticate!</h5>
17+
</div>
18+
</div>
19+
</div>
20+
21+
);
22+
}

‎src/noHashQueryStringUtils.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import {BasicQueryStringUtils} from '@openid/appauth';
2+
3+
export class NoHashQueryStringUtils extends BasicQueryStringUtils {
4+
parse(input, useHash) {
5+
return super.parse(input, false /* never use hash */);
6+
}
7+
}

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /