Epitech/ratrapage_T-WEB
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases 1 Wiki Activity

Oauth OK
All checks were successful
Build Docker Image / run (pull_request) Successful in 1m37s
Details

Browse Source
This commit is contained in:
Clement 2024-05-15 23:43:55 +02:00
parent f863a918bf
commit 509a19f0c9
3 changed files with 132 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
front/src/middleware/index.ts
View File

@ -3,11 +3,12 @@ import PocketBase from 'pocketbase'
import { defineMiddleware } from 'astro/middleware' import { defineMiddleware } from 'astro/middleware'
import { getEnv } from 'libs/Env' import { getEnv } from 'libs/Env'
export const onRequest = defineMiddleware(async ({ locals, request }: any, next: () => any) => { export const onRequest = defineMiddleware(async ({ locals, cookies}, next) => {
locals.pb = new PocketBase(getEnv('POCKETBASE_URL','http://localhost:8080')) locals.pb = new PocketBase(getEnv('POCKETBASE_URL','http://localhost:8080'))
// load the store data from the request cookie string // load the store data from the request cookie string
locals.pb.authStore.loadFromCookie(request.headers.get('cookie') || '') const pbcookie = cookies.get('session')?.value
locals.pb.authStore.loadFromCookie('pb_auth=' + pbcookie || '')
try { try {
// get an up-to-date auth store state by verifying and refreshing the loaded auth model (if any) // get an up-to-date auth store state by verifying and refreshing the loaded auth model (if any)
@ -20,8 +21,19 @@ export const onRequest = defineMiddleware(async ({ locals, request }: any, next:
const response = await next() const response = await next()
// send back the default 'pb_auth' cookie to the client with the latest store state let secure = true
response.headers.append('set-cookie', locals.pb.authStore.exportToCookie()) if (getEnv('NODE_ENV', 'production') !== 'production') {
secure = false
}
const pbcookieStr = locals.pb.authStore.exportToCookie()
cookies.set('session',pbcookieStr.slice(pbcookieStr.indexOf('=')+1,pbcookieStr.indexOf(';')),{
httpOnly: true,
path: '/',
secure: secure,
sameSite: 'lax',
maxAge: 365000
})
return response return response
}) })

97
front/src/pages/account/oauth.astro Normal file
View File

@ -0,0 +1,97 @@
---
const pb = Astro.locals.pb
const redirectUrl = Astro.url.protocol + "//" + Astro.url.host + '/account/oauth';
console.log(redirectUrl)
const params = Astro.url.searchParams
const code = params.get('code')
console.log(Astro.request.headers.get('cookie'))
//TODO socké dans les cookies
// load the previously stored provider's data
const providerstr = Astro.cookies.get('provider')
if (!providerstr) {
console.error("Fail to load provider")
console.log(providerstr)
return
}
const provider = providerstr.json()
if (!code) {
console.error("Fail to load code params");
return
}
// compare the redirect's state param and the stored provider's one
if (provider.state !== params.get('state')) {
throw "State parameters don't match.";
}
pb.collection('users').authWithOAuth2Code(
provider.name,
code,
provider.codeVerifier,
redirectUrl,
// pass optional user create data
{
emailVisibility: false,
}
).then((authData) => {
//REDIRECT
console.log("oauth OK !!");
console.log(JSON.stringify(authData, null, 2));
}).catch((err) => {
console.log("oauth fail !!");
console.log(err);
});
---
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>OAuth2 redirect page</title>
</head>
<body>
<pre id="content">Authenticating...</pre>
<script src="https://cdn.jsdelivr.net/gh/pocketbase/js-sdk@master/dist/pocketbase.umd.js"></script>
<script type="text/javascript">
const pb = new PocketBase("http://127.0.0.1:8090");
const redirectUrl = 'http://127.0.0.1:8090/redirect.html';
// parse the query parameters from the redirected url
const params = (new URL(window.location)).searchParams;
// load the previously stored provider's data
const provider = JSON.parse(localStorage.getItem('provider'))
// compare the redirect's state param and the stored provider's one
if (provider.state !== params.get('state')) {
throw "State parameters don't match.";
}
// authenticate
pb.collection('users').authWithOAuth2Code(
provider.name,
params.get('code'),
provider.codeVerifier,
redirectUrl,
// pass optional user create data
{
emailVisibility: false,
}
).then((authData) => {
document.getElementById('content').innerText = JSON.stringify(authData, null, 2);
}).catch((err) => {
document.getElementById('content').innerText = "Failed to exchange code.\n" + err;
});
</script>
</body>
</html>

36
front/src/pages/account/register.astro
View File

@ -1,11 +1,28 @@
--- ---
import Layout from 'layouts/Layout.astro'; import Layout from 'layouts/Layout.astro';
import AstroUtils from 'libs/AstroUtils'; import AstroUtils from 'libs/AstroUtils';
import { getEnv } from 'libs/Env';
const pb = Astro.locals.pb const pb = Astro.locals.pb
const oauths = await pb.collection('users').listAuthMethods(); const oauths = await pb.collection('users').listAuthMethods();
console.log(JSON.stringify(oauths.authProviders[0]));
let secure = true
if (getEnv('NODE_ENV', 'production') !== 'production') {
secure = false
}
Astro.cookies.set('provider', oauths.authProviders[0],{
httpOnly: true,
path: '/',
secure: secure,
sameSite: 'lax',
maxAge: 365000
})
if(pb.authStore.isValid){ if(pb.authStore.isValid){
return Astro.redirect("/account") return Astro.redirect("/account")
} }
@ -55,21 +72,6 @@ await AstroUtils.wrap(async () => {
<form method="post" enctype="multipart/form-data"> <form method="post" enctype="multipart/form-data">
<input type="hidden" name="type" value="discord2FA"> <input type="hidden" name="type" value="discord2FA">
</form> </form>
<a href={oauths.authProviders[1].authUrl + "https%3A%2F%2Fpb-tweb.cb85.fr%2Fapi%2Foauth2-redirect"}>discord?</a> <a href={oauths.authProviders[0].authUrl + Astro.url.protocol + "//" + Astro.url.host + '/account/oauth'}>discord?</a>
</Layout> </Layout>
<script>
import 'cross-fetch/polyfill';
import PocketBase from "pocketbase"
import type { OAuth2UrlCallback } from "pocketbase"
const pb = new PocketBase("https://pb-tweb.cb85.fr/")
const discordBtn = document.querySelector<HTMLButtonElement>("#OauthDiscord")
if (discordBtn) {
discordBtn.addEventListener('click', async () =>{
const result = await pb.collection('users').listAuthMethods();
fetch(result.authProviders[0].authUrl)
console.log(result);
})
}
</script>