Compare commits

..

No commits in common. "0b9cfbcd2ddfd504951d92cb639e65a67ca10a5f" and "5ac961330ee792e54f83ef698a2b027a69deecce" have entirely different histories.

4 changed files with 48 additions and 101 deletions

View File

@ -1,4 +0,0 @@
package ch.bbw.pr.tresorbackend.controller;
public class RecaptchaController {
}

View File

@ -103,27 +103,3 @@ export const loginUser = async (loginValue) => {
throw new Error('Failed to log in. ' || error.message); throw new Error('Failed to log in. ' || error.message);
} }
} }
export const captchaCheck = async (captchaToken) => {
const protocol = process.env.REACT_APP_API_PROTOCOL; // "http"
const host = process.env.REACT_APP_API_HOST; // "localhost"
const port = process.env.REACT_APP_API_PORT; // "8080"
const path = process.env.REACT_APP_API_PATH; // "/api"
const portPart = port ? `:${port}` : ''; // port is optional
const API_URL = `${protocol}://${host}${portPart}${path}`;
try {
const res = await fetch(`${API_URL}/verify-recaptcha`, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ captchaToken }),
});
return await res.json();
} catch (error) {
console.error('Failed to log in:', error.message);
throw new Error('Failed to log in. ' || error.message);
}
}

View File

@ -1,7 +1,5 @@
import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { loginUser, captchaCheck } from '../../comunication/FetchUser'; import { loginUser } from '../../comunication/FetchUser';
import ReCAPTCHA from 'react-google-recaptcha';
/** /**
* LoginUser * LoginUser
@ -9,26 +7,15 @@ import ReCAPTCHA from 'react-google-recaptcha';
*/ */
function LoginUser({ loginValues, setLoginValues }) { function LoginUser({ loginValues, setLoginValues }) {
const navigate = useNavigate(); const navigate = useNavigate();
const [recaptchaToken, setRecaptchaToken] = useState(null);
const handleCaptcha = (token) => {
setRecaptchaToken(token);
};
const handleSubmit = async (e) => { const handleSubmit = async (e) => {
e.preventDefault(); e.preventDefault();
if (!recaptchaToken) {
alert("Please verify reCAPTCHA");
return;
}
try { try {
const captchaData = await captchaCheck(recaptchaToken);
let isLoginValid = false let isLoginValid = false
isLoginValid = await loginUser(loginValues); isLoginValid = await loginUser(loginValues);
if (isLoginValid || captchaData.success) { console.log(loginValues);
if (isLoginValid) {
setLoginValues({ userName: loginValues.email, password: loginValues.password }); setLoginValues({ userName: loginValues.email, password: loginValues.password });
navigate('/'); navigate('/');
} }
@ -46,7 +33,7 @@ function LoginUser({ loginValues, setLoginValues }) {
<div> <div>
<label>Email:</label> <label>Email:</label>
<input <input
type="email" type="text"
value={loginValues.email} value={loginValues.email}
onChange={(e) => onChange={(e) =>
setLoginValues(prevValues => ({ ...prevValues, email: e.target.value }))} setLoginValues(prevValues => ({ ...prevValues, email: e.target.value }))}
@ -57,7 +44,7 @@ function LoginUser({ loginValues, setLoginValues }) {
<div> <div>
<label>Password:</label> <label>Password:</label>
<input <input
type="password" type="text"
value={loginValues.password} value={loginValues.password}
onChange={(e) => onChange={(e) =>
setLoginValues(prevValues => ({ ...prevValues, password: e.target.value }))} setLoginValues(prevValues => ({ ...prevValues, password: e.target.value }))}
@ -67,10 +54,6 @@ function LoginUser({ loginValues, setLoginValues }) {
</div> </div>
</aside> </aside>
</section> </section>
<ReCAPTCHA
sitekey="6LdJj1crAAAAABcEz65x0DUAsuJUBCKwdSi1Mewj"
onChange={handleCaptcha}
/>
<button type="submit">Login</button> <button type="submit">Login</button>
</form> </form>
</div> </div>

View File

@ -1,12 +1,12 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { postUser } from "../../comunication/FetchUser"; import {postUser} from "../../comunication/FetchUser";
/** /**
* RegisterUser * RegisterUser
* @author Peter Rutschmann * @author Peter Rutschmann
*/ */
function RegisterUser({ loginValues, setLoginValues }) { function RegisterUser({loginValues, setLoginValues}) {
const navigate = useNavigate(); const navigate = useNavigate();
const initialState = { const initialState = {
@ -25,23 +25,15 @@ function RegisterUser({ loginValues, setLoginValues }) {
setErrorMessage(''); setErrorMessage('');
//validate //validate
if (credentials.password !== credentials.passwordConfirmation) { if(credentials.password !== credentials.passwordConfirmation) {
console.log("password != passwordConfirmation"); console.log("password != passwordConfirmation");
setErrorMessage('Password and password-confirmation are not equal.'); setErrorMessage('Password and password-confirmation are not equal.');
return; return;
} }
const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]).{8,}$/;;
if (!passwordRegex.test(credentials.password)) {
setErrorMessage('Password must contain at least one uppercase letter, one lowercase letter, one number, and one special character.');
return;
}
try { try {
await postUser(credentials); await postUser(credentials);
setLoginValues({ userName: credentials.email, password: credentials.password }); setLoginValues({userName: credentials.email, password: credentials.password});
setCredentials(initialState); setCredentials(initialState);
navigate('/'); navigate('/');
} catch (error) { } catch (error) {
@ -55,49 +47,49 @@ function RegisterUser({ loginValues, setLoginValues }) {
<h2>Register user</h2> <h2>Register user</h2>
<form onSubmit={handleSubmit}> <form onSubmit={handleSubmit}>
<section> <section>
<aside> <aside>
<div> <div>
<label>Firstname:</label> <label>Firstname:</label>
<input <input
type="text" type="text"
value={credentials.firstName} value={credentials.firstName}
onChange={(e) => onChange={(e) =>
setCredentials(prevValues => ({ ...prevValues, firstName: e.target.value }))} setCredentials(prevValues => ({...prevValues, firstName: e.target.value}))}
required required
placeholder="Please enter your firstname *" placeholder="Please enter your firstname *"
/> />
</div> </div>
<div> <div>
<label>Lastname:</label> <label>Lastname:</label>
<input <input
type="text" type="text"
value={credentials.lastName} value={credentials.lastName}
onChange={(e) => onChange={(e) =>
setCredentials(prevValues => ({ ...prevValues, lastName: e.target.value }))} setCredentials(prevValues => ({...prevValues, lastName: e.target.value}))}
required required
placeholder="Please enter your lastname *" placeholder="Please enter your lastname *"
/> />
</div> </div>
<div> <div>
<label>Email:</label> <label>Email:</label>
<input <input
type="email" type="text"
value={credentials.email} value={credentials.email}
onChange={(e) => onChange={(e) =>
setCredentials(prevValues => ({ ...prevValues, email: e.target.value }))} setCredentials(prevValues => ({...prevValues, email: e.target.value}))}
required required
placeholder="Please enter your email" placeholder="Please enter your email"
/> />
</div> </div>
</aside> </aside>
<aside> <aside>
<div> <div>
<label>Password:</label> <label>Password:</label>
<input <input
type="password" type="text"
value={credentials.password} value={credentials.password}
onChange={(e) => onChange={(e) =>
setCredentials(prevValues => ({ ...prevValues, password: e.target.value }))} setCredentials(prevValues => ({...prevValues, password: e.target.value}))}
required required
placeholder="Please enter your pwd *" placeholder="Please enter your pwd *"
/> />
@ -105,10 +97,10 @@ function RegisterUser({ loginValues, setLoginValues }) {
<div> <div>
<label>Password confirmation:</label> <label>Password confirmation:</label>
<input <input
type="password" type="text"
value={credentials.passwordConfirmation} value={credentials.passwordConfirmation}
onChange={(e) => onChange={(e) =>
setCredentials(prevValues => ({ ...prevValues, passwordConfirmation: e.target.value }))} setCredentials(prevValues => ({...prevValues, passwordConfirmation: e.target.value}))}
required required
placeholder="Please confirm your pwd *" placeholder="Please confirm your pwd *"
/> />