parent
51c8dad31e
commit
76cd6ee767
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 602 B |
|
After Width: | Height: | Size: 476 B |
@ -0,0 +1,14 @@ |
||||
import { css } from 'styled-components/macro' |
||||
|
||||
export const visuallyHidden = css` |
||||
position: absolute; |
||||
width: 1px; |
||||
height: 1px; |
||||
margin: -1px; |
||||
padding: 0; |
||||
border: 0; |
||||
white-space: nowrap; |
||||
clip-path: inset(100%); |
||||
clip: rect(0 0 0 0); |
||||
overflow: hidden; |
||||
` |
||||
@ -0,0 +1,69 @@ |
||||
import { useEffect, useRef } from 'react' |
||||
import { Redirect } from 'react-router-dom' |
||||
|
||||
import { parse } from 'querystring' |
||||
import isObject from 'lodash/isObject' |
||||
|
||||
import { useLocalStore } from 'hooks' |
||||
|
||||
import type { Settings } from 'features/AuthStore/helpers' |
||||
import { getClientSettings } from 'features/AuthStore/helpers' |
||||
|
||||
import { API_ROOT } from '../../config/routes' |
||||
import { PAGES } from '../../config/pages' |
||||
|
||||
const url = `${API_ROOT}/oauth` |
||||
|
||||
const Oauth = () => { |
||||
const { |
||||
response_mode, |
||||
response_type, |
||||
scope, |
||||
} = getClientSettings() |
||||
|
||||
const [urlParams] = useLocalStore<Partial<Settings>>({ |
||||
clearOnUnmount: true, |
||||
defaultValue: {}, |
||||
key: 'urlParams', |
||||
validator: isObject, |
||||
}) |
||||
|
||||
const formRef = useRef<HTMLFormElement>(null) |
||||
|
||||
const idToken = parse(window.location.hash).id_token as string | undefined |
||||
|
||||
const { |
||||
client_id, |
||||
lang, |
||||
nonce, |
||||
redirect_uri, |
||||
state, |
||||
} = urlParams |
||||
|
||||
useEffect(() => { |
||||
formRef.current?.submit() |
||||
}, []) |
||||
|
||||
if (!idToken || !client_id || !redirect_uri) return <Redirect to={PAGES.login} /> |
||||
|
||||
return ( |
||||
<form |
||||
hidden |
||||
method='POST' |
||||
ref={formRef} |
||||
action={url} |
||||
> |
||||
<input name='client_id' defaultValue={client_id} /> |
||||
<input name='id_token' defaultValue={idToken} /> |
||||
<input name='lang' defaultValue={lang} /> |
||||
<input name='redirect_uri' defaultValue={redirect_uri} /> |
||||
<input name='response_type' defaultValue={response_type} /> |
||||
<input name='response_mode' defaultValue={response_mode} /> |
||||
<input name='scope' defaultValue={scope} /> |
||||
<input name='state' defaultValue={state} /> |
||||
<input name='nonce' defaultValue={nonce} /> |
||||
</form> |
||||
) |
||||
} |
||||
|
||||
export default Oauth |
||||
@ -0,0 +1,5 @@ |
||||
export enum AuthProviders { |
||||
Google, |
||||
Facebook, |
||||
AppleID, |
||||
} |
||||
@ -1,5 +1,6 @@ |
||||
export const PAGES = { |
||||
change_password: '/change_password', |
||||
login: '/authorize', |
||||
oauth: '/oauth', |
||||
registration: '/registration', |
||||
} |
||||
|
||||
@ -0,0 +1,34 @@ |
||||
import type { Settings } from 'features/AuthStore/helpers' |
||||
import { GOOGLE_CLIENT_ID } from 'config' |
||||
|
||||
import { AuthProviders } from '../../config/authProviders' |
||||
import { PAGES } from '../../config/pages' |
||||
|
||||
const getQueryString = (authProvider: AuthProviders, urlParams: Settings) => { |
||||
switch (authProvider) { |
||||
case AuthProviders.Google: |
||||
return new URLSearchParams({ |
||||
client_id: GOOGLE_CLIENT_ID, |
||||
nonce: urlParams.nonce || '0394852-3190485-2490358', |
||||
redirect_uri: `${window.location.origin}${PAGES.oauth}`, |
||||
response_type: 'token id_token', |
||||
scope: 'openid email', |
||||
state: urlParams.state || '', |
||||
}).toString() |
||||
|
||||
default: |
||||
return '' |
||||
} |
||||
} |
||||
|
||||
export const getAuthUrl = (authProvider: AuthProviders, urlParams: Settings) => { |
||||
const queryString = getQueryString(AuthProviders.Google, urlParams) |
||||
|
||||
switch (authProvider) { |
||||
case AuthProviders.Google: |
||||
return `https://accounts.google.com/o/oauth2/v2/auth?${queryString}` |
||||
|
||||
default: |
||||
return '' |
||||
} |
||||
} |
||||
@ -0,0 +1,3 @@ |
||||
export const redirectToUrl = (url: string) => { |
||||
window.location.href = url |
||||
} |
||||
Loading…
Reference in new issue