Skip to content

Commit

Permalink
Ajustes para leer correctamente los campos para inicio de sesión
Browse files Browse the repository at this point in the history
  • Loading branch information
@cairocen
cairocen committed Aug 13, 2024
1 parent 4ec38c9 commit 7c81c1e
Show file tree
Hide file tree
Showing 2 changed files with 92 additions and 75 deletions.
154 changes: 84 additions & 70 deletions client/src/components/LoginComponent.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,16 @@
import { useState } from 'react';
import { ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
import { encryptionKey, encryptValue ,decryptValue} from './hashes';
import { encryptionKey, encryptValue, decryptValue } from './hashes';
import Cookies from 'js-cookie';

import {urilogin} from './Urls'

import { urilogin } from './Urls'


// eslint-disable-next-line react/prop-types
export default function LoginComponent({ setIsLoggedIn }) {
// const [urilogin, seturilogin] = useState('http://localhost:3000/users/login');

// const [urilogin, seturilogin] = useState('http://localhost:3000/users/login');
const [email, setEmail] = useState('');
const [password, setPassword] = useState('');
const [error, setError] = useState(null);
Expand All @@ -22,10 +21,6 @@ export default function LoginComponent({ setIsLoggedIn }) {

const handleSubmit = async (event) => {
event.preventDefault();
var username = '';
var useid = '';
var userrole = '';
var userimagen = '';

try {
const response = await fetch(urilogin, {
Expand All @@ -39,41 +34,62 @@ export default function LoginComponent({ setIsLoggedIn }) {
if (!response.ok) {
throw new Error('Correo electrónico o contraseña incorrectos');
}

const data = await response.json();
username = encryptValue(data.user.name + ' ' + data.user.last,encryptionKey);
useid = encryptValue(data.user.id,encryptionKey)
userrole = encryptValue(data.user.role,encryptionKey)
userimagen = encryptValue(data.user.imagen_perfil,encryptionKey)

if (rememberMe) {
Cookies.set('1m@&34',userimagen,{expires:30}) //imagen
Cookies.set('#gt156',useid,{expires:30}); //id
Cookies.set('&0l3',userrole,{expires:30}); //role
Cookies.set('@u53r',username,{expires:30}); //nombre
Cookies.set('$3s1.4',encryptValue(true,encryptionKey),{expires:30}); //sesion
console.log(data); // Imprimir para debug

if (data && data.user) {
const name = data.user.name || '';
const last = data.user.last || '';
const id = data.user.id || '';
const role = data.user.role || '';
const imagenPerfil = data.user.imagen_perfil || ''; // Asegúrate de que existe

console.log("Valores a cifrar:", {
username: `${name} ${last}`,
useid: id,
userrole: role,
userimagen: imagenPerfil,
});

// Declarar las variables
const username = encryptValue(`${name} ${last}`, encryptionKey);
const useid = encryptValue(id, encryptionKey);
const userrole = encryptValue(role, encryptionKey);
const userimagen = encryptValue(imagenPerfil, encryptionKey);

if (rememberMe) {
Cookies.set('1m@&34', userimagen, { expires: 30 }) // Imagen
Cookies.set('#gt156', useid, { expires: 30 }); // ID
Cookies.set('&0l3', userrole, { expires: 30 }); // Role
Cookies.set('@u53r', username, { expires: 30 }); // Nombre
Cookies.set('$3s1.4', encryptValue(true, encryptionKey), { expires: 30 }); // Sesión
} else {
Cookies.set('1m@&34', userimagen); // Imagen
Cookies.set('#gt156', useid); // ID
Cookies.set('&0l3', userrole); // Role
Cookies.set('@u53r', username); // Nombre
Cookies.set('$3s1.4', encryptValue(true, encryptionKey)); // Sesión
}

localStorage.setItem('token', data.token);
setIsLoggedInLocally(true);
setIsLoggedIn(true);
} else {
Cookies.set('1m@&34',userimagen) //imagen
Cookies.set('#gt156',useid); //id
Cookies.set('&0l3',userrole); //role
Cookies.set('@u53r',username);//nombre
Cookies.set('$3s1.4',encryptValue(true,encryptionKey));//sesion
throw new Error('Usuario no encontrado en la respuesta del servidor.');
}
localStorage.setItem('token', data.token);
setIsLoggedInLocally(true);
setIsLoggedIn(true);
} catch (error) {
setError(error.message);
console.error(error);
toast.error(error.message);

}
};

if (isLoggedInLocally) {
if(Cookies.get('$3s1.4')){
const session = decryptValue(Cookies.get('$3s1.4'),encryptionKey)
if (Cookies.get('$3s1.4')) {
const session = decryptValue(Cookies.get('$3s1.4'), encryptionKey)
if (session) {
const role = decryptValue(Cookies.get('&0l3'),encryptionKey)
const role = decryptValue(Cookies.get('&0l3'), encryptionKey)
if (role === 'administrador') {
window.location.href = '/dashboardadmin/sql';
}
Expand All @@ -87,57 +103,55 @@ export default function LoginComponent({ setIsLoggedIn }) {
}
}



return (
<>
<ToastContainer />

<div className="flex min-h-full flex-1 flex-col justify-center py-12 sm:px-6 lg:px-8">
<div className="mt-10 sm:mx-auto sm:w-full sm:max-w-[480px] border_principal rounded-lg">
<div className=" px-6 py-12 shadow sm:rounded-lg sm:px-12">
<div className="sm:mx-auto sm:w-full sm:max-w-md">
<div className="mt-10 sm:mx-auto sm:w-full sm:max-w-[480px] border_principal rounded-lg">
<div className=" px-6 py-12 shadow sm:rounded-lg sm:px-12">
<div className="sm:mx-auto sm:w-full sm:max-w-md">
<h2 className="mt-6 mb-6 text-center text-2xl Principal leading-9 tracking-tight">
Iniciar sesión
</h2>
</div>
<form onSubmit={handleSubmit} className="space-y-6">
<div>
<label htmlFor="email" className="Principal block text-sm font-medium leading-6">
Correo electrónico
</label>
<div className="mt-2 border border_principal rounded-md">
<input
id="email"
name="email"
type="email"
autoComplete="email"
required
value={email}
onChange={(e) => setEmail(e.target.value)}
className="block w-full rounded-md py-1.5 shadow-sm placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
/>
{error && <p className="text-red-500 text-sm mt-1">{error}</p>}
<div>
<label htmlFor="email" className="Principal block text-sm font-medium leading-6">
Correo electrónico
</label>
<div className="mt-2 border border_principal rounded-md">
<input
id="email"
name="email"
type="email"
autoComplete="email"
required
value={email}
onChange={(e) => setEmail(e.target.value)}
className="block w-full rounded-md py-1.5 shadow-sm placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
/>
{error && <p className="text-red-500 text-sm mt-1">{error}</p>}
</div>
</div>
</div>

<div>
<label htmlFor="password" className="Principal block text-sm font-medium leading-6 text-gray-900">
Contraseña
</label>
<label htmlFor="password" className="Principal block text-sm font-medium leading-6 text-gray-900">
Contraseña
</label>
<div className="mt-2 border border_principal rounded-md">
<input
id="password"
name="password"
type="password"
autoComplete="current-password"
required
value={password}
onChange={(e) => setPassword(e.target.value)}
className="block w-full rounded-md py-1.5 shadow-sm placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
/>
{error && <p className="text-red-500 text-sm mt-1">{error}</p>}
</div>
<input
id="password"
name="password"
type="password"
autoComplete="current-password"
required
value={password}
onChange={(e) => setPassword(e.target.value)}
className="block w-full rounded-md py-1.5 shadow-sm placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
/>
{error && <p className="text-red-500 text-sm mt-1">{error}</p>}
</div>
</div>

<div className="flex items-center justify-between">
Expand Down
13 changes: 8 additions & 5 deletions client/src/components/hashes.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,13 @@ import CryptoJS from 'crypto-js';/////////encriptar y desencriptar datos
export const encryptionKey = 'mysecretkey';

export const encryptValue = (value, key) => {
return CryptoJS.AES.encrypt(value.toString(), key).toString();
};
if (value == null) {
throw new Error('El valor a cifrar no puede ser null o undefined');
}
return CryptoJS.AES.encrypt(value.toString(), key).toString();
};

export const decryptValue = (encryptedValue, key) => {
const bytes = CryptoJS.AES.decrypt(encryptedValue, key);
return bytes.toString(CryptoJS.enc.Utf8);
};
const bytes = CryptoJS.AES.decrypt(encryptedValue, key);
return bytes.toString(CryptoJS.enc.Utf8);
};

0 comments on commit 7c81c1e

Please sign in to comment.