diff --git a/containers/api/src/app.controller.ts b/containers/api/src/app.controller.ts index 8c6949b1..2673c062 100644 --- a/containers/api/src/app.controller.ts +++ b/containers/api/src/app.controller.ts @@ -6,7 +6,7 @@ /* By: apommier +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* Created: 2023/06/17 01:00:00 by apommier #+# #+# */ -/* Updated: 2023/06/17 17:29:05 by apommier ### ########.fr */ +/* Updated: 2023/06/18 11:51:18 by apommier ### ########.fr */ /* */ /* ************************************************************************** */ @@ -314,10 +314,10 @@ export class AppController { console.log(`user in auth/login= ${user.username}`); const data = await this.authService.login(user); console.log(`all data in api = ${data}`) - + const myJSON = JSON.stringify(data); console.log(`all data json version= ${myJSON}`) - + console.log(`data in api = ${(await data).access_token}`) // console.log(`data i = ${(await data).access_token}`) const token = (await data).access_token; @@ -353,6 +353,8 @@ export class AppController { { const user = await this.userService.findOne(req.user.username); const res = await VerifyOTP(user, data.token) + console.log('token in verify=', data.token) + console.log('res in verify=', res) await this.userService.save(user); return res } @@ -367,6 +369,18 @@ export class AppController { return res } + @UseGuards(JwtAuthGuard) + @Post('/deleteOtp') + async deleteOTP(@Request() req, @Body() data: any) + { + const user = await this.userService.findOne(req.user.username); + user.otp_verified = false; + await this.userService.save(user); + // const res = await ValidateOTP(user, data.token) + // await this.userService.save(user); + // return res + } + // @UseGuards(JwtAuthGuard) // @Get('/QRcode') // async createQrCode(@Request() req) @@ -398,7 +412,7 @@ export class AppController { ///create conv and return it ? id? console.log(`data post /conv= ${data}`); console.log(`data post /conv= ${data.members}`); - console.log(`data post /conv= ${data.name}`); + // console.log(`data post /conv= ${data.name}`); // const param = data; const amIhere = data.members.includes(req.user.username); diff --git a/containers/api/src/users/2fa.ts b/containers/api/src/users/2fa.ts index 38a0924e..e89b9d2d 100644 --- a/containers/api/src/users/2fa.ts +++ b/containers/api/src/users/2fa.ts @@ -85,12 +85,13 @@ export const generateOTP = async (user) => { if (delta === null) { console.log("error verify token") - return ("error verify token") + return (0) } else { user.otp_verified = true; console.log("token verified") + return (1) } } catch (error) { console.log(error) @@ -111,12 +112,13 @@ export const generateOTP = async (user) => { if (delta === null) { console.log("error validate token") - return ("error validate token") + return (0); } else { // user.otp_verified = true; console.log("token validated") + return (1); } } catch (error) { console.log(error) diff --git a/containers/react/src/components/Messages/Modal.jsx b/containers/react/src/components/Messages/Modal.jsx index 87a41fc2..0234a5f1 100644 --- a/containers/react/src/components/Messages/Modal.jsx +++ b/containers/react/src/components/Messages/Modal.jsx @@ -84,7 +84,7 @@ const Modal = ({handleClose}) => { //do db stuff here const data = { members: selectedOptions, - name: "prout" + // name: "prout" } try{ api.post("/conv", data); diff --git a/containers/react/src/components/Sidebar/SidebarData.js b/containers/react/src/components/Sidebar/SidebarData.js index afbf3d52..b0c242f4 100644 --- a/containers/react/src/components/Sidebar/SidebarData.js +++ b/containers/react/src/components/Sidebar/SidebarData.js @@ -32,8 +32,8 @@ export const SidebarData = [ cName: 'nav-text' }, { - title: 'Settings', - path: '/team', + title: 'Double Auth', + path: '/qr', icon: , cName: 'nav-text' }, diff --git a/containers/react/src/pages/QrCode.jsx b/containers/react/src/pages/QrCode.jsx index d8f2c664..6f8bedf1 100644 --- a/containers/react/src/pages/QrCode.jsx +++ b/containers/react/src/pages/QrCode.jsx @@ -1,8 +1,13 @@ import React, { useEffect, useRef, useState } from "react"; +// import { useHistory } from 'react'; +// import { redirect } from "react-router-dom"; + import "../styles/App.css"; +import api from '../script/axiosApi'; + import QRCodeStyling from "qr-code-styling"; import { motion } from 'framer-motion' -import api from '../script/axiosApi'; + const qrCode = new QRCodeStyling({ @@ -23,11 +28,41 @@ const qrCode = new QRCodeStyling({ }); function QrCode () { - const url = "https://www.youtube.com"; + // const url = "https://www.youtube.com"; const ref = useRef(null); + const [user, setUser] = useState(false); + const [url, setUrl] = useState(false); + const [secret, setSecret] = useState(false); + const [code, setCode] = useState(''); + const [activated, setActivated] = useState(false); + + // const history = useHistory(); useEffect(() => { qrCode.append(ref.current); + + const getUser = async ()=>{ + try{ + const tmpUser = await api.get("/profile"); + setUser(tmpUser.data); + if (tmpUser.data.otp_verified) + { + setActivated(true); + return ; + } + const otpData = await api.post("/otp"); + setUrl(otpData.data.otpauth_url); + setSecret(otpData.data.base32_secret); + // const tmpUser = await api.get("/profile") + // console.log("test") + // console.table(convs); + } + catch(err){ + console.log(err); + } + }; + getUser(); + }, []); useEffect(() => { @@ -36,30 +71,111 @@ function QrCode () { }); }, [url]); - const getConv = async ()=>{ - try{ - const convs = await api.get("/user") - // const tmpUser = await api.get("/profile") - console.log("test") - console.table(convs); - } - catch(err){ - console.log(err); - } - }; - getConv(); - return ( - -

QrCode

-

Your code is: 231 31 31

-
- - {} - + const handleKeyPress = async (e)=>{ + // console.log(`e in press= ${e.key}`) + if (e.key !== "Enter") + return ; + try{ + console.log("code= ", code) + const res = await api.post("/verifyOtp", {token: code}) + console.log("res= ", res.data) + console.log("res= ", res) + if (res.data === 1) + { + console.log("registered") + // history.push('/login') + + const path = 'http://' + process.env.REACT_APP_BASE_URL + '/'; + window.history.pushState({}, null, path); + window.location.reload(false); + + } + else + { + console.log("bad code") + //alert ?? retry + } + // redirect('/test') + } + catch(err){ + console.log(err) + } + } + + const handleDesactivate = async () => { + try { + await api.post("/deleteOtp") + // const path = 'http://' + process.env.REACT_APP_BASE_URL + '/'; + // window.history.pushState({}, null, path); + window.location.reload(false); + } catch(err) { + console.log(err); + } + }; + + return ( + // + //

QRcode

+ //

{secret}

+ //
+ // + // {} + + // + + + {!activated && ( + <> +

Enter The Secret

+

{secret}

+

Or Scan The QRCode

+
+ + )} + +<> + {!activated && localStorage.getItem('token') ? ( + <> +

Double Auth Validation

+ setCode(e.target.value)} + /> + + ) : ( + + )} + + + {/* {!localStorage.getItem('token') && ( + <> +

Double Auth

+ setCode(e.target.value)} + /> + + ) : ()} + */} + {/* {!activated && ( + + )} */} + ) } diff --git a/containers/react/src/script/axiosApi.js b/containers/react/src/script/axiosApi.js index 8a9c80b9..2ae297d4 100644 --- a/containers/react/src/script/axiosApi.js +++ b/containers/react/src/script/axiosApi.js @@ -12,13 +12,13 @@ function getToken() { console.log(`getToken = ${getToken()}`) console.log(`Bearer ${localStorage.getItem("token")}`) -const test = "192.168.1.19" +// const test = "192.168.1.19" // const url = 'http://' + process.env.REACT_APP_BASE_URL + '/api' // const url = 'http://' + test + '/api' // console.log("url= ", url) -console.log("test= ", test) -console.log("env= ", process.env.REACT_APP_BASE_URL) +// console.log("test= ", test) +// console.log("env= ", process.env.REACT_APP_BASE_URL) let api = axios.create({ // baseURL: 'http://localhost/api', diff --git a/containers/react/src/script/tokenSuccess.js b/containers/react/src/script/tokenSuccess.js index e8756513..7d2cda12 100644 --- a/containers/react/src/script/tokenSuccess.js +++ b/containers/react/src/script/tokenSuccess.js @@ -1,13 +1,247 @@ import { useLocation } from 'react-router-dom'; +import { useState, useEffect } from 'react' import queryString from 'query-string'; +import api from "./axiosApi"; +import axios from 'axios'; function SuccessToken() { - const location = useLocation(); - const { data } = queryString.parse(location.search); - const cleanData = data.slice(1, -1); - localStorage.setItem('token', `${cleanData}`); - console.log(`prout token2= ${localStorage.getItem('token')}`) - window.location.replace("http://" + process.env.REACT_APP_BASE_URL + "/pong"); -} + const location = useLocation(); + const { data } = queryString.parse(location.search); + const [code, setCode] = useState(''); + const [user, setUser] = useState(false); + + useEffect(() => { + if (!data) { + console.log("No data"); + return; + } + + const cleanData = data.slice(1, -1); // Declare cleanData here + + const getUser = async () => { + try { + const tmpUser = await axios({ + method: 'GET', + url: 'http://' + process.env.REACT_APP_BASE_URL + '/api/profile', + headers: { + Authorization: `Bearer ${cleanData}`, + }, + withCredentials: true, + }); + setUser(tmpUser.data); + } catch (err) { + console.log(err); + } + }; + + getUser(); + }, [data]); + + const handleKeyPress = async (e)=>{ + // console.log(`e in press= ${e.key}`) + if (e.key !== "Enter") + return ; + try{ + console.log("code= ", code) + // const res = await api.post("/verifyOtp", {token: code}) -export default SuccessToken; \ No newline at end of file + + const res = await axios({ + method: 'POST', + url: 'http://' + process.env.REACT_APP_BASE_URL + '/api/verifyOtp', + headers: { + Authorization: `Bearer ${cleanData}`, + }, + withCredentials: true, + data: { token: code } + }); + + console.log("res= ", res.data) + console.log("res= ", res) + if (res.data === 1) + { + console.log("registered") + // history.push('/login') + + localStorage.setItem('token', `${cleanData}`); + console.log(`prout token2= ${localStorage.getItem('token')}`); + window.location.replace("http://" + process.env.REACT_APP_BASE_URL + "/pong"); + + // const path = 'http://' + process.env.REACT_APP_BASE_URL + '/'; + // window.history.pushState({}, null, path); + // window.location.reload(false); + + } + else + { + console.log("bad code") + //alert ?? retry + } + // redirect('/test') + } + catch(err){ + console.log(err) + } + } + + + + if (!user) { + // Render a loading indicator or return null while user is being fetched + return

Loading...

; + } + + const cleanData = data.slice(1, -1); // Declare cleanData here as well + + if (!user.otp_verified) { + console.log("false"); + localStorage.setItem('token', `${cleanData}`); + console.log(`prout token2= ${localStorage.getItem('token')}`); + window.location.replace("http://" + process.env.REACT_APP_BASE_URL + "/pong"); + return null; // or return a message or component indicating not verified + } + + return ( + <> +

Double Auth

+ setCode(e.target.value)} + /> + + ); + } + + export default SuccessToken; + +// function SuccessToken() { + +// const location = useLocation(); +// const { data } = queryString.parse(location.search); + +// if ( !data) +// { +// console.log("no data") +// return ; +// } +// const cleanData = data.slice(1, -1); + + +// const [code, setCode] = useState(''); +// const [user, setUser] = useState(false); + +// useEffect(()=> { + +// const getUser = async ()=>{ +// try { +// // const tmpUser = await api.get("/profile"); + +// const tmpUser = await axios({ +// method: 'GET', +// url: 'http://' + process.env.REACT_APP_BASE_URL + '/api/profile', +// headers: { +// Authorization: `Bearer ${cleanData}`, +// }, +// withCredentials: true, +// }); +// setUser(tmpUser.data); + +// // setUser(tmpUser.data); +// // if (tmpUser.data.otp_verified) +// // { +// // console.log("true"); +// // return ( +// // <> +// //

Double Auth

+// // setCode(e.target.value)} +// // /> +// // +// // ) +// // } +// // else +// // { +// // console.log("false"); +// // localStorage.setItem('token', `${cleanData}`); +// // console.log(`prout token2= ${localStorage.getItem('token')}`) +// // window.location.replace("http://" + process.env.REACT_APP_BASE_URL + "/pong"); +// // } +// } catch(err) { +// console.log(err) +// } +// } +// getUser(); +// }, []); + +// const handleKeyPress = async (e)=>{ +// // console.log(`e in press= ${e.key}`) +// if (e.key !== "Enter") +// return ; +// try{ +// console.log("code= ", code) +// const res = await api.post("/verifyOtp", {token: code}) +// console.log("res= ", res.data) +// console.log("res= ", res) +// if (res.data === 1) +// { +// console.log("registered") +// // history.push('/login') + +// const path = 'http://' + process.env.REACT_APP_BASE_URL + '/'; +// window.history.pushState({}, null, path); +// window.location.reload(false); + +// } +// else +// { +// console.log("bad code") +// //alert ?? retry +// } +// // redirect('/test') +// } +// catch(err){ +// console.log(err) +// } +// } + + +// console.log("start while...") +// while(user === false) +// ; +// console.log("end while") +// if (!user.otp_verified) +// { +// console.log("false"); +// localStorage.setItem('token', `${cleanData}`); +// console.log(`prout token2= ${localStorage.getItem('token')}`) +// window.location.replace("http://" + process.env.REACT_APP_BASE_URL + "/pong"); +// return ; +// } + +// return ( +// <> +//

Double Auth

+// setCode(e.target.value)} +// /> +// +// ) + + +// } + +// export default SuccessToken;