Persistent login after user's signing up and confirms their accounts through email, and after they log in - php

Question

I'm creating an authentication system based on a token generated in PHP, that the user has to confirm their account through an email sent to them after signing up, and the token is validated after the user clicks on the link that is supposed to process the PHP page responsible for token and then to a Thank you for confirmation page, but instead, they're redirected to the login page, and that also happens with the other pages, even though I set up session_start in the backend.
Down below you can see the code snippets of signup/login.php, Signup/Login.js, confirm_account.php, and AccountConfirmed.js
SignUp.js
const SignUp = () => {
const navigate = useNavigate();
const [first_name, setFirstName] = useState("");
const [last_name, setLastName] = useState("");
const [company, setCompany] = useState("");
const [email, setEmail] = useState("");
const [phone_number, setPhoneNumber] = useState("");
const [password, setPassword] = useState("");
const [confirm_password, setConfirmPassword] = useState("");
const [errorMessage, setErrorMessage] = useState("");
function emailValidation() {
const emailRegex =
/[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]#(gmail|hotmail|outlook|yahoo)\.com\b$/g;
return emailRegex.test(email);
}
const handleSignUpSubmit = (event) => {
event.preventDefault();
const register_account = {
first_name: first_name,
last_name: last_name,
company: company,
email: email,
phone_number: phone_number,
password: password,
confirm_password: confirm_password,
};
axios
.post("http://localhost/bachelor_exam/signup.php", register_account)
.then((response) => {
if (response.data) {
navigate("/emailconfirm");
}
})
.catch((error) => {
if (
error.response &&
error.response.data === "All fields must be filled in"
) {
setErrorMessage("All fields must be filled in");
} else if (
error.response &&
error.response.data ===
"The first name must be longer than 2 characters"
) {
setErrorMessage("The first name must be longer than 2 characters");
} else if (
error.response &&
error.response.data ===
"The first name cannot be longer than 12 characters"
) {
setErrorMessage("The first name cannot be longer than 12 characters");
} else if (
error.response &&
error.response.data ===
"The last name must be longer than 2 characters"
) {
setErrorMessage("The last name must be longer than 2 characters");
} else if (
error.response &&
error.response.data ===
"The last name cannot be longer than 12 characters"
) {
setErrorMessage("The last name cannot be longer than 12 characters");
} else if (
error.response &&
error.response.data === "The email is not valid" &&
!emailValidation()
) {
setErrorMessage("The email is not valid");
} else if (
error.response &&
error.response.data === "The password is not strong enough"
) {
setErrorMessage("The password is not strong enough");
} else if (
error.response &&
error.response.data ===
"The password has exceeded the maximum of characters"
) {
setErrorMessage(
"The password has exceeded the maximum of characters"
);
} else if (
error.response &&
error.response.data === "Danish phone number must be provided"
) {
setErrorMessage("Danish phone number must be provided");
} else if (
error.response &&
error.response.data === "The passwords does not match"
) {
setErrorMessage("The passwords does not match");
} else if (
error.response &&
error.response.data === "The email has already been registered"
) {
setErrorMessage("The email has already been registered");
} else if (
error.response &&
error.response.data === "The phone number has already been registered"
) {
setErrorMessage("The phone number has already been registered");
} else {
console.log(error);
}
});
};
Login.js
const Login = () => {
const navigate = useNavigate();
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const [errorMessage, setErrorMessage] = useState("");
function emailValidate() {
const emailRegex =
/[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]#(gmail|hotmail|outlook|yahoo)\.com\b$/g;
return emailRegex.test(email);
}
const handleLogInSubmit = (event) => {
event.preventDefault();
const logged_in = {
email: email,
password: password,
};
axios
.post("http://localhost/bachelor_exam/login.php", logged_in)
.then((response) => {
if (response.data) {
const userData = response.data;
sessionStorage.setItem("user", JSON.stringify(userData));
navigate("/dashboard");
} else {
setErrorMessage(response.data);
}
})
.catch((error) => {
if (
error.response &&
error.response.data === "All fields must be filled in"
) {
setErrorMessage("All fields must be filled in");
} else if (
error.response &&
error.response.data === "The email is not valid" &&
!emailValidate()
) {
setErrorMessage("The email is not valid");
} else if (
error.response &&
error.response.data === "All fields must be filled in"
) {
setErrorMessage("All fields must be filled in");
} else if (
error.response &&
error.response.data === "The password is not strong"
) {
setErrorMessage("The password is not strong");
} else if (
error.response &&
error.response.data ===
"The password has reached the maximum characters"
) {
setErrorMessage("The password has reached the maximum characters");
} else if (
error.response &&
error.response.data === "Wrong email or password"
) {
setErrorMessage("Wrong email or password");
} else if (
error.response &&
error.response.data === "User does not exist"
) {
setErrorMessage("User does not exist");
} else {
console.log(error);
}
});
};
Signup and Login.php
<?php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: POST, GET");
header("Access-Control-Allow-Headers: Content-Type, Authorization");
require_once (__DIR__."/globals.php");
session_start();
$data = file_get_contents("php://input");
if (isset($data) && !empty($data)){
$request = json_decode($data);
$firstName = $request->first_name;
$lastName = $request->last_name;
$company = $request->company;
$email = $request->email;
$phoneNumber = $request->phone_number;
$password = $request->password;
$confirmPassword = $request->confirm_password;
if(empty($firstName) || empty($lastName) || empty($company) || empty($email) ||
empty($password) || empty($confirmPassword)){
http_response_code(400);
echo json_encode("All fields must be filled in");
exit();
}
if(strlen($firstName) < _NAME_MIN_LEN){
http_response_code(400);
echo json_encode("The first name must be longer than 2 characters");
exit();
}
if(strlen($firstName) > _NAME_MAX_LEN){
http_response_code(400);
echo json_encode("The first name cannot be longer than 12 characters");
exit();
}
if(strlen($lastName) < _NAME_MIN_LEN){
http_response_code(400);
echo json_encode("The last name must be longer than 2 characters");
exit();
}
if(strlen($lastName) > _NAME_MAX_LEN){
http_response_code(400);
echo json_encode("The last name cannot be longer than 12 characters");
exit();
}
if(!filter_var($email, FILTER_VALIDATE_EMAIL)){
http_response_code(400);
echo json_encode("The email is not valid");
exit();
}
if(strlen($password) < _PASSWORD_MIN_LEN){
http_response_code(400);
echo json_encode("The password is not strong enough");
exit();
}
if(strlen($password) > _PASSWORD_MAX_LEN){
http_response_code(400);
echo json_encode("The password has exceeded the maximum of characters");
exit();
}
if(strlen($phoneNumber) !== 8){
http_response_code(400);
echo json_encode("Danish phone number must be provided");
exit();
}
if($password !== $confirmPassword){
http_response_code(400);
echo json_encode("The passwords does not match");
exit();
}
$db = _db();
try {
$passwordHash = password_hash($password, PASSWORD_DEFAULT);
$token = bin2hex(random_bytes(16));
$forgotPass = bin2hex(random_bytes(16));
$q = $db->prepare("SELECT * FROM users WHERE email = :email");
$q->bindValue(":email", $email);
$q->execute();
if($q->rowCount() > 0){
header("Content-type: application/json");
http_response_code(400);
echo json_encode("The email has already been registered");
exit();
} else {
$q = $db->prepare("SELECT * FROM users WHERE phone_number = :phone_number");
$q->bindValue(":phone_number", $phoneNumber);
$q->execute();
if($q->rowCount() > 0){
header("Content-type: application/json");
http_response_code(400);
echo json_encode("The phone number has already been registered");
exit();
} else {
$q=$db->prepare("INSERT INTO users(user_id, first_name, last_name, company,
email, phone_number, password, forgot_password, token, verified) VALUES(:user_id,
:first_name, :last_name, :company, :email, :phone_number, :password,
:forgot_password,
:token, :verified)");
$q->bindValue(":user_id", null);
$q->bindValue(":first_name", $firstName);
$q->bindValue(":last_name", $lastName);
$q->bindValue(":company", $company);
$q->bindValue(":email", $email);
$q->bindValue(":phone_number", $phoneNumber);
$q->bindValue(":password", $passwordHash);
$q->bindValue(":forgot_password", $forgotPass);
$q->bindValue(":token", $token);
$q->bindValue(":verified", false);
$q->execute();
$id = $db->lastInsertId();
$to_email = $email;
$subject = "Nuub - Account Confirmation";
$message = "Welcome to Nuub, click on the following link to verify your account:
<a href='http://localhost/bachelor_exam/confirm_account.php?
token=$token'>Confirm your account</a>";
require_once(__DIR__."/emailVerification/send_email.php");
$_SESSION["first_name"] = $firstName;
header("Content-type: application/json");
http_response_code(200);
echo json_encode($_SESSION["first_name"]);
exit();
}
}
} catch (Exception $ex){
header("Content-type: application/json");
http_response_code(500);
echo json_encode("System not working");
echo "Debug info: " . $ex->getMessage();
exit();
}
}
/// LOGIN ///
<?php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: POST, GET");
header("Access-Control-Allow-Headers: Content-Type, Authorization");
require_once (__DIR__."/globals.php");
session_start();
$data = file_get_contents("php://input");
if (isset($data) && !empty($data)) {
$request = json_decode($data);
$email = $request->email;
$passwordCheck = $request->password;
// empty input
if (empty($email) || empty($passwordCheck)){
http_response_code(400);
echo json_encode("All fields must be filled in");
exit();
}
// email validation
else if (!filter_var($email, FILTER_VALIDATE_EMAIL)){
http_response_code(400);
echo json_encode("The email is not valid");
exit();
}
// password validation
else if (strlen($passwordCheck) < _PASSWORD_MIN_LEN){
http_response_code(400);
echo json_encode("The password is not strong");
exit();
}
else if (strlen($passwordCheck) > _PASSWORD_MAX_LEN){
http_response_code(400);
echo json_encode("The password has reached the maximum characters");
exit();
}
$db = _db();
try {
$q=$db->prepare("SELECT * FROM users WHERE email = :email");
$q->bindValue(":email", $email);
$q->execute();
$row = $q->fetch();
if($q->rowCount() > 0){
if (password_verify($passwordCheck, $row["password"])) {
$_SESSION["user_id"] = $row["user_id"];
$_SESSION["first_name"] = $row["first_name"];
$_SESSION["last_name"] = $row["last_name"];
$_SESSION["email"] = $row["email"];
$_SESSION["company"] = $row["company"];
$_SESSION["phone_number"] = $row["phone_number"];
$_SESSION["verified"] = $row["verified"];
$_SESSION["token"] = $row["token"];
$_SESSION["forgot_password"] = $row["forgot_password"];
http_response_code(200);
echo json_encode($_SESSION["user_id"]);
exit();
} else {
http_response_code(400);
echo json_encode("Wrong email or password");
exit();
}
} else {
http_response_code(400);
echo json_encode("User does not exist");
exit();
}
} catch(Exception $ex){
http_response_code(500);
echo json_encode("System not working");
echo "Debug info:" . $ex->getMessage();
}
}
confirm_account.php
<?php
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: POST, GET");
header("Access-Control-Allow-Headers: Content-Type, Authorization");
require_once (__DIR__."/globals.php");
session_start();
$db = _db();
try {
$token = $_GET["token"];
$q=$db->prepare("UPDATE users SET verified = :verified WHERE token = :token");
$q->bindValue(":token", $token);
$q->bindValue("verified", true);
$q->execute();
$q->rowCount();
header("Location: http://localhost:3000/accountconfirmed");
echo json_encode("Success");
exit();
if($q->rowCount() > 0){
$new_token = bin2hex(random_bytes(16));
$id = $_SESSION["user_id"];
$new_q = $db->prepare("UPDATE users SET token = :token WHERE user_id = :user_id");
$new_q->bindValue(":user_id", $id);
$new_q->bindValue(":token", $new_token);
$new_q->execute();
echo json_encode("New token has been assigned");
} else {
echo json_encode("Something went wrong");
}
}catch (Exception $ex){
header("Content-type: application/json");
http_response_code(500);
echo json_encode(["error" => $ex->getMessage()]);
exit();
}
AccountConfirmed.js
const AccountConfirmed = () => {
const navigate = useNavigate();
const { search } = useLocation();
const [validToken, setValidToken] = useState(false);
const [errorMessage, setErrorMessage] = useState("");
useEffect(() => {
const params = new URLSearchParams(search);
const token = params.get("token");
if(token){
axios.get(`http://localhost/bachelor_exam/confirm_account.php?token=${token}`)
.then((response) => {
if(response.data === "Success"){
sessionStorage.setItem("token", token);
setValidToken(true);
} else {
setErrorMessage(response.data);
}
})
.catch((error) => {
console.log(error);
})
} else {
navigate("/login");
}
}, [navigate, search]);
My apologies for a load of code, and I'm using Reactjs as frontend.