Added cookies

This commit is contained in:
2022-07-26 10:18:49 +01:00
parent adeb8c4267
commit 8e81dccef6
8 changed files with 91 additions and 120 deletions
+7 -7
View File
@@ -31,15 +31,14 @@ const Login = props => {
async evt => {
//on submit
evt.preventDefault();
const [err, newTokens] = await handleSubmit(emailRef.current.value, passwordRef.current.value);
const [err, accessToken] = await handleSubmit(emailRef.current.value, passwordRef.current.value);
if (err) {
alert(err);
}
//save auth tokens and redirect
if (newTokens) {
authTokens.setAccessToken(newTokens.accessToken);
authTokens.setRefreshToken(newTokens.refreshToken);
if (accessToken) {
authTokens.setAccessToken(accessToken);
props.history.push('/');
}
@@ -77,7 +76,8 @@ const handleSubmit = async (email, password) => {
body: JSON.stringify({
email,
password,
})
}),
credentials: 'include'
});
//handle errors
@@ -88,8 +88,8 @@ const handleSubmit = async (email, password) => {
}
//return the new auth tokens
const newTokens = await result.json();
return [null, newTokens];
const accessToken = await result.text();
return [null, accessToken];
};
//returns an error message, or null on success
@@ -51,13 +51,7 @@ const handleSubmit = async (password, authTokens) => {
//force a logout
const result2 = await authTokens.tokenFetch(`${process.env.AUTH_URI}/auth/logout`, {
method: 'DELETE',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
token: authTokens.refreshToken
})
method: 'DELETE'
});
if (!result2.ok) {
@@ -65,7 +59,6 @@ const handleSubmit = async (password, authTokens) => {
}
authTokens.setAccessToken('');
authTokens.setRefreshToken('');
return [null];
};
+1 -8
View File
@@ -12,13 +12,7 @@ const Logout = () => {
{ /* Logout logs you out of the server too */ }
<Link to='/' onClick={async () => {
const result = await authTokens.tokenFetch(`${process.env.AUTH_URI}/auth/logout`, { //NOTE: this gets overwritten as a bugfix
method: 'DELETE',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
token: authTokens.refreshToken
})
method: 'DELETE'
});
//any problems?
@@ -26,7 +20,6 @@ const Logout = () => {
console.error(await result.text());
} else {
authTokens.setAccessToken('');
authTokens.setRefreshToken('');
}
}}>Logout</Link>
</>
+3
View File
@@ -1,4 +1,5 @@
import React from 'react';
import { Link } from 'react-router-dom';
const Static = props => {
return (
@@ -8,6 +9,8 @@ const Static = props => {
</header>
<h2 className='text centered'>MERN-template</h2>
<p>The <a href='https://github.com/krgamestudios/MERN-template'>MERN-template</a> developed by Kayne Ruse, KR Game Studios</p>
<Link className='text centered' to='/'>Return Home</Link>
</div>
);
};
+3
View File
@@ -1,10 +1,13 @@
import React from 'react';
import { Link } from 'react-router-dom';
const Static = props => {
return (
<div className='page central'>
<header>
<h1 className="text centered">Privacy Policy</h1>
<Link className='text centered' to='/'>Return Home</Link>
</header>
</div>
);
+9 -26
View File
@@ -8,19 +8,16 @@ export const TokenContext = createContext();
const TokenProvider = props => {
//state to be used
const [accessToken, setAccessToken] = useState('');
const [refreshToken, setRefreshToken] = useState('');
//make the access and refresh tokens persist between reloads
//make the access token persist between reloads
useEffect(() => {
setAccessToken(localStorage.getItem("accessToken") || '');
setRefreshToken(localStorage.getItem("refreshToken") || '');
}, []);
//update the stored copies
useEffect(() => {
localStorage.setItem("accessToken", accessToken);
localStorage.setItem("refreshToken", refreshToken);
}, [accessToken, refreshToken]);
}, [accessToken]);
//wrap the default fetch function
const tokenFetch = async (url, options) => {
@@ -36,24 +33,16 @@ const TokenProvider = props => {
return fetch(url, {
method: 'DELETE',
headers: {
'Content-Type': 'application/json',
'Authorization': `Bearer ${bearer}`
},
body: JSON.stringify({
token: refreshToken
})
credentials: 'include'
});
}
//ping the auth server for a new token
//ping the auth server for a new access token
const response = await fetch(`${process.env.AUTH_URI}/auth/token`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
token: refreshToken
})
credentials: 'include'
});
//any errors, throw them
@@ -65,7 +54,6 @@ const TokenProvider = props => {
const newAuth = await response.json();
setAccessToken(newAuth.accessToken);
setRefreshToken(newAuth.refreshToken);
bearer = newAuth.accessToken;
}
@@ -75,7 +63,8 @@ const TokenProvider = props => {
headers: {
...(options || { headers: {} }).headers,
'Authorization': `Bearer ${bearer}`
}
},
credentials: 'include'
});
};
@@ -88,12 +77,7 @@ const TokenProvider = props => {
//ping the auth server for a new token
const response = await fetch(`${process.env.AUTH_URI}/auth/token`, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
token: refreshToken
})
credentials: 'include'
});
//any errors, throw them
@@ -105,7 +89,6 @@ const TokenProvider = props => {
const newAuth = await response.json();
setAccessToken(newAuth.accessToken);
setRefreshToken(newAuth.refreshToken);
//finally
return cb(newAuth.accessToken);
@@ -115,7 +98,7 @@ const TokenProvider = props => {
};
return (
<TokenContext.Provider value={{ accessToken, refreshToken, setAccessToken, setRefreshToken, tokenFetch, tokenCallback, getPayload: () => decode(accessToken) }}>
<TokenContext.Provider value={{ accessToken, setAccessToken, tokenFetch, tokenCallback, getPayload: () => decode(accessToken) }}>
{props.children}
</TokenContext.Provider>
)