mirror of
https://git.v0id.ovh/n3wt-innov/n3wt-school.git
synced 2026-01-28 23:43:22 +00:00
feat: Suite de la gestion des sessions
This commit is contained in:
@ -148,8 +148,7 @@ class ProfileSimpleView(APIView):
|
||||
def delete(self, request, id):
|
||||
return bdd.delete_object(Profile, id)
|
||||
|
||||
@method_decorator(csrf_protect, name='dispatch')
|
||||
@method_decorator(ensure_csrf_cookie, name='dispatch')
|
||||
@method_decorator(csrf_exempt, name='dispatch')
|
||||
class LoginView(APIView):
|
||||
@swagger_auto_schema(
|
||||
operation_description="Connexion utilisateur",
|
||||
@ -168,7 +167,8 @@ class LoginView(APIView):
|
||||
'errorFields': openapi.Schema(type=openapi.TYPE_OBJECT),
|
||||
'errorMessage': openapi.Schema(type=openapi.TYPE_STRING),
|
||||
'profil': openapi.Schema(type=openapi.TYPE_INTEGER),
|
||||
'droit': openapi.Schema(type=openapi.TYPE_INTEGER)
|
||||
'droit': openapi.Schema(type=openapi.TYPE_INTEGER),
|
||||
'id': openapi.Schema(type=openapi.TYPE_INTEGER),
|
||||
}
|
||||
))
|
||||
}
|
||||
@ -196,13 +196,12 @@ class LoginView(APIView):
|
||||
else:
|
||||
retour = error.returnMessage[error.WRONG_ID]
|
||||
|
||||
|
||||
return JsonResponse({
|
||||
'errorFields': errorFields,
|
||||
'errorMessage': retour,
|
||||
'profil': user.id if user else -1,
|
||||
'droit': user.droit if user else -1,
|
||||
#'jwtToken':jwt_token if profil != -1 else ''
|
||||
'id': user.id if user else -1,
|
||||
}, safe=False)
|
||||
|
||||
@method_decorator(csrf_protect, name='dispatch')
|
||||
|
||||
@ -252,19 +252,10 @@ CORS_ALLOW_ALL_HEADERS = True
|
||||
CORS_ALLOW_CREDENTIALS = True
|
||||
|
||||
CORS_ALLOWED_ORIGINS = [
|
||||
'http://localhost:3000'
|
||||
os.getenv('CORS_ALLOWED_ORIGINS', 'http://localhost:3000')
|
||||
]
|
||||
|
||||
CSRF_TRUSTED_ORIGINS = [
|
||||
'http://localhost:3000',
|
||||
'http://localhost:8080'
|
||||
]
|
||||
|
||||
# CORS_ALLOWED_ORIGINS = [
|
||||
# os.getenv('CORS_ALLOWED_ORIGINS', 'http://localhost:3000')
|
||||
# ]
|
||||
|
||||
# CSRF_TRUSTED_ORIGINS = os.getenv('CSRF_TRUSTED_ORIGINS', 'http://localhost:3000,http://localhost:8080').split(',')
|
||||
CSRF_TRUSTED_ORIGINS = os.getenv('CSRF_TRUSTED_ORIGINS', 'http://localhost:3000,http://localhost:8080').split(',')
|
||||
|
||||
CSRF_COOKIE_HTTPONLY = False
|
||||
CSRF_COOKIE_SECURE = False
|
||||
|
||||
@ -26,6 +26,8 @@ import {
|
||||
|
||||
import { disconnect } from '@/app/lib/authAction';
|
||||
import { fetchEstablishment } from '@/app/lib/schoolAction';
|
||||
import ProtectedRoute from '@/components/ProtectedRoute';
|
||||
import { SessionProvider } from 'next-auth/react';
|
||||
|
||||
export default function Layout({
|
||||
children,
|
||||
@ -73,6 +75,9 @@ export default function Layout({
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
<SessionProvider>
|
||||
<ProtectedRoute>
|
||||
{!isLoading && (
|
||||
<div className="flex min-h-screen bg-gray-50">
|
||||
<Sidebar establishment={establishment} currentPage={currentPage} items={Object.values(sidebarItems)} className="h-full" />
|
||||
@ -105,6 +110,9 @@ export default function Layout({
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
</ProtectedRoute>
|
||||
</SessionProvider>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@ import StructureManagement from '@/components/Structure/Configuration/StructureM
|
||||
import ScheduleManagement from '@/components/Structure/Planning/ScheduleManagement';
|
||||
import FeesManagement from '@/components/Structure/Tarification/FeesManagement';
|
||||
import DjangoCSRFToken from '@/components/DjangoCSRFToken';
|
||||
import useCsrfToken from '@/hooks/useCsrfToken';
|
||||
import { useCsrfToken } from '@/context/CsrfContext';
|
||||
import { ClassesProvider } from '@/context/ClassesContext';
|
||||
import { createDatas,
|
||||
updateDatas,
|
||||
|
||||
@ -3,7 +3,7 @@ import React, { useState, useEffect } from 'react';
|
||||
import { useSearchParams, useRouter } from 'next/navigation';
|
||||
import InscriptionFormShared from '@/components/Inscription/InscriptionFormShared';
|
||||
import { FE_ADMIN_SUBSCRIPTIONS_URL } from '@/utils/Url';
|
||||
import useCsrfToken from '@/hooks/useCsrfToken';
|
||||
import { useCsrfToken } from '@/context/CsrfContext';
|
||||
import { mockStudent } from '@/data/mockStudent';
|
||||
import { editRegisterForm, fetchRegisterForm } from '@/app/lib/subscriptionAction';
|
||||
|
||||
|
||||
@ -42,7 +42,7 @@ import {
|
||||
FE_ADMIN_SUBSCRIPTIONS_EDIT_URL } from '@/utils/Url';
|
||||
|
||||
import DjangoCSRFToken from '@/components/DjangoCSRFToken'
|
||||
import useCsrfToken from '@/hooks/useCsrfToken';
|
||||
import { useCsrfToken } from '@/context/CsrfContext';
|
||||
import { fetchRegistrationFileGroups } from '@/app/lib/registerFileGroupAction';
|
||||
|
||||
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
import React, { useState } from 'react';
|
||||
import InscriptionFormShared from '@/components/Inscription/InscriptionFormShared';
|
||||
import { useSearchParams, useRouter } from 'next/navigation';
|
||||
import useCsrfToken from '@/hooks/useCsrfToken';
|
||||
import { useCsrfToken } from '@/context/CsrfContext';
|
||||
import { FE_PARENTS_HOME_URL} from '@/utils/Url';
|
||||
import { editRegisterForm} from '@/app/lib/subscriptionAction';
|
||||
|
||||
|
||||
@ -9,9 +9,12 @@ import Button from '@/components/Button'; // Importez le composant Button
|
||||
import { User, KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires
|
||||
import {
|
||||
FE_USERS_NEW_PASSWORD_URL,
|
||||
BE_AUTH_INFO_SESSION } from '@/utils/Url';
|
||||
BE_AUTH_INFO_SESSION,
|
||||
FE_ADMIN_SUBSCRIPTIONS_URL,
|
||||
FE_PARENTS_HOME_URL
|
||||
} from '@/utils/Url';
|
||||
import useLocalStorage from '@/hooks/useLocalStorage';
|
||||
import { signIn } from 'next-auth/react';
|
||||
import { signIn, getSession } from 'next-auth/react';
|
||||
import { useCsrfToken } from '@/context/CsrfContext'; // Importez le hook useCsrfToken
|
||||
|
||||
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
|
||||
@ -33,32 +36,46 @@ export default function Page() {
|
||||
return data.errorMessage === ""
|
||||
}
|
||||
|
||||
function handleFormLogin(formData) {
|
||||
async function handleFormLogin(formData) {
|
||||
setIsLoading(true);
|
||||
console.log('Form Data', Object.fromEntries(formData.entries())); // Affichez les entrées du FormData
|
||||
console.log('csrf passé ', csrfToken); // Affichez le token CSRF
|
||||
|
||||
signIn('credentials', {
|
||||
try {
|
||||
const result = await signIn('credentials', {
|
||||
redirect: false,
|
||||
email: formData.get('login'),
|
||||
password: formData.get('password'),
|
||||
csrfToken: csrfToken // Utilisez le token CSRF récupéré par le hook
|
||||
})
|
||||
.then(result => {
|
||||
});
|
||||
|
||||
console.log('Sign In Result', result);
|
||||
setIsLoading(false);
|
||||
|
||||
if (result.error) {
|
||||
setErrorMessage(result.error);
|
||||
} else {
|
||||
router.push(result.url);
|
||||
const session = await getSession();
|
||||
if (!session || !session.user) {
|
||||
throw new Error('Session not found');
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
const user = session.user;
|
||||
console.log('User Session:', user);
|
||||
localStorage.setItem('userId', user.id); // Stocker l'identifiant de l'utilisateur
|
||||
if (user.droit === 0) {
|
||||
// Vue ECOLE
|
||||
} else if (user.droit === 1) {
|
||||
// Vue ADMIN
|
||||
router.push(FE_ADMIN_SUBSCRIPTIONS_URL);
|
||||
} else if (user.droit === 2) {
|
||||
// Vue PARENT
|
||||
router.push(FE_PARENTS_HOME_URL);
|
||||
} else {
|
||||
// Cas anormal
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error during sign in:', error);
|
||||
setIsLoading(false);
|
||||
setErrorMessage('An error occurred during sign in.');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (isLoading === true) {
|
||||
|
||||
@ -10,7 +10,7 @@ import Button from '@/components/Button'; // Importez le composant Button
|
||||
import Popup from '@/components/Popup'; // Importez le composant Popup
|
||||
import { User } from 'lucide-react'; // Importez directement les icônes nécessaires
|
||||
import { FE_USERS_LOGIN_URL } from '@/utils/Url';
|
||||
import useCsrfToken from '@/hooks/useCsrfToken';
|
||||
import { useCsrfToken } from '@/context/CsrfContext';
|
||||
import { sendNewPassword } from '@/app/lib/authAction';
|
||||
|
||||
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
|
||||
|
||||
@ -11,7 +11,7 @@ import Button from '@/components/Button'; // Importez le composant Button
|
||||
import Popup from '@/components/Popup';
|
||||
import { FE_USERS_LOGIN_URL } from '@/utils/Url';
|
||||
import { KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires
|
||||
import useCsrfToken from '@/hooks/useCsrfToken';
|
||||
import { useCsrfToken } from '@/context/CsrfContext';
|
||||
import { getResetPassword, resetPassword } from '@/app/lib/authAction';
|
||||
|
||||
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
|
||||
|
||||
@ -11,7 +11,7 @@ import Button from '@/components/Button'; // Importez le composant Button
|
||||
import Popup from '@/components/Popup'; // Importez le composant Popup
|
||||
import { User, KeySquare } from 'lucide-react'; // Importez directement les icônes nécessaires
|
||||
import { FE_USERS_LOGIN_URL } from '@/utils/Url';
|
||||
import useCsrfToken from '@/hooks/useCsrfToken';
|
||||
import { useCsrfToken } from '@/context/CsrfContext';
|
||||
import { subscribe } from '@/app/lib/authAction';
|
||||
const useFakeData = process.env.NEXT_PUBLIC_USE_FAKE_DATA === 'true';
|
||||
|
||||
|
||||
@ -1,8 +1,7 @@
|
||||
import React from 'react';
|
||||
import { NextIntlClientProvider } from 'next-intl';
|
||||
import { CsrfProvider } from '@/context/CsrfContext'; // Importez le CsrfProvider
|
||||
|
||||
import { getMessages } from 'next-intl/server';
|
||||
import { NextIntlClientProvider } from 'next-intl';
|
||||
import { CsrfProvider } from '@/context/CsrfContext';
|
||||
import "@/css/tailwind.css";
|
||||
|
||||
export const metadata = {
|
||||
@ -22,14 +21,15 @@ export const metadata = {
|
||||
},
|
||||
};
|
||||
|
||||
export default async function RootLayout({ children, params: { locale } }) {
|
||||
const messages = await getMessages();
|
||||
export default async function RootLayout({ children, params }) {
|
||||
const { locale } = params;
|
||||
const messages = await getMessages(locale); // Passez le locale ici
|
||||
|
||||
return (
|
||||
<html lang={locale}>
|
||||
<body>
|
||||
<CsrfProvider> {/* Enveloppez votre application avec le CsrfProvider */}
|
||||
<NextIntlClientProvider messages={messages}>
|
||||
<CsrfProvider>
|
||||
<NextIntlClientProvider messages={messages} locale={locale}> {/* Passez le locale ici */}
|
||||
{children}
|
||||
</NextIntlClientProvider>
|
||||
</CsrfProvider>
|
||||
|
||||
@ -1,24 +1,27 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import useLocalStorage from '@/hooks/useLocalStorage';
|
||||
import { useSession } from 'next-auth/react';
|
||||
import Loader from '@/components/Loader'; // Importez le composant Loader
|
||||
import { FE_USERS_LOGIN_URL } from '@/utils/Url';
|
||||
|
||||
const ProtectedRoute = ({ children }) => {
|
||||
const { data: session, status } = useSession();
|
||||
const router = useRouter();
|
||||
const [userId] = useLocalStorage("userId", '');
|
||||
|
||||
useEffect(() => {
|
||||
if (!userId) {
|
||||
if (status === 'loading') return; // Ne rien faire tant que le statut est "loading"
|
||||
if (!session) {
|
||||
// Rediriger vers la page de login si l'utilisateur n'est pas connecté
|
||||
router.push(FE_USERS_LOGIN_URL);
|
||||
router.push(`${FE_USERS_LOGIN_URL}`);
|
||||
}
|
||||
}, [userId, router]);
|
||||
}, [session, status, router]);
|
||||
|
||||
if (!userId) {
|
||||
return <div>Loading...</div>;
|
||||
if (status === 'loading' || !session) {
|
||||
return <Loader />; // Affichez un loader pendant le chargement ou si l'utilisateur n'est pas connecté
|
||||
}
|
||||
|
||||
// Afficher les enfants seulement si l'utilisateur est connecté
|
||||
return userId ? children : null;
|
||||
return children;
|
||||
};
|
||||
|
||||
export default ProtectedRoute;
|
||||
@ -4,7 +4,7 @@ import Table from '@/components/Table';
|
||||
import Popup from '@/components/Popup';
|
||||
import ToggleSwitch from '@/components/ToggleSwitch';
|
||||
import { createProfile, updateProfile } from '@/app/lib/authAction';
|
||||
import useCsrfToken from '@/hooks/useCsrfToken';
|
||||
import { useCsrfToken } from '@/context/CsrfContext';
|
||||
import { DndProvider, useDrag, useDrop } from 'react-dnd';
|
||||
import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
import InputText from '@/components/InputText';
|
||||
|
||||
@ -1,12 +0,0 @@
|
||||
import { getCsrfToken } from '@/utils/getCsrfToken';
|
||||
|
||||
export const csrfMiddleware = (handler) => {
|
||||
return async (req, res) => {
|
||||
const csrfToken = getCsrfToken();
|
||||
if (!csrfToken) {
|
||||
console.error('CSRF Token is undefined');
|
||||
}
|
||||
req.csrfToken = csrfToken;
|
||||
return handler(req, res);
|
||||
};
|
||||
};
|
||||
@ -1,29 +0,0 @@
|
||||
// import { useEffect, useState } from 'react';
|
||||
// import { BE_AUTH_CSRF_URL } from '@/utils/Url';
|
||||
|
||||
// const useCsrfToken = () => {
|
||||
// const [token, setToken] = useState('');
|
||||
|
||||
// useEffect(() => {
|
||||
// fetch(`${BE_AUTH_CSRF_URL}`, {
|
||||
// method: 'GET',
|
||||
// credentials: 'include' // Inclut les cookies dans la requête
|
||||
// })
|
||||
// .then(response => response.json())
|
||||
// .then(data => {
|
||||
// if (data) {
|
||||
// if(data.csrfToken != token) {
|
||||
// setToken(data.csrfToken);
|
||||
// console.log('------------> CSRF Token reçu:', data.csrfToken);
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
// .catch(error => {
|
||||
// console.error('Error fetching CSRF token:', error);
|
||||
// });
|
||||
// }, []);
|
||||
|
||||
// return token;
|
||||
// };
|
||||
|
||||
// export default useCsrfToken;
|
||||
@ -1,7 +1,6 @@
|
||||
import NextAuth from 'next-auth';
|
||||
import CredentialsProvider from 'next-auth/providers/credentials';
|
||||
import jwt from 'jsonwebtoken';
|
||||
import { csrfMiddleware } from '@/csrfMiddleware'; // Importez le middleware csrfMiddleware
|
||||
import { BE_AUTH_LOGIN_URL } from '@/utils/Url';
|
||||
|
||||
const options = {
|
||||
providers: [
|
||||
@ -11,43 +10,32 @@ const options = {
|
||||
email: { label: 'Email', type: 'email' },
|
||||
password: { label: 'Password', type: 'password' }
|
||||
},
|
||||
authorize: (credentials, req) => {
|
||||
console.log('Credentials:', credentials); // Vérifiez si ce log s'affiche
|
||||
|
||||
// Utilisez le token CSRF injecté par le middleware
|
||||
const csrfToken = req.csrfToken;
|
||||
console.log("data to send : ", JSON.stringify({
|
||||
email: credentials.email,
|
||||
password: credentials.password
|
||||
}), "csrfToken : ", csrfToken);
|
||||
|
||||
return fetch(`${process.env.NEXT_PUBLIC_API_URL}/Auth/login`, {
|
||||
authorize: async (credentials, req) => {
|
||||
const response = await fetch(`${BE_AUTH_LOGIN_URL}`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRFToken': csrfToken // Utiliser le token CSRF ici
|
||||
},
|
||||
body: JSON.stringify({
|
||||
email: credentials.email,
|
||||
password: credentials.password
|
||||
}),
|
||||
credentials: 'include'
|
||||
})
|
||||
.then(response => response.text())
|
||||
.then(text => {
|
||||
console.log('Response Text:', text); // Loggez la réponse
|
||||
const user = JSON.parse(text); // Parsez la réponse en JSON
|
||||
});
|
||||
|
||||
const user = await response.json();
|
||||
|
||||
console.log("API response:", user);
|
||||
if (response.ok && user) {
|
||||
return user;
|
||||
const userData = {
|
||||
id: user.id,
|
||||
role: user.profil,
|
||||
droit: user.droit
|
||||
};
|
||||
return userData;
|
||||
} else {
|
||||
throw new Error(user.errorMessage || 'Invalid credentials');
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error during authentication:', error);
|
||||
throw new Error('Authentication failed');
|
||||
});
|
||||
}
|
||||
})
|
||||
],
|
||||
@ -55,25 +43,35 @@ const options = {
|
||||
jwt: true
|
||||
},
|
||||
callbacks: {
|
||||
async jwt(token, user) {
|
||||
async jwt({ token, user }) {
|
||||
console.log("JWT callback called", user);
|
||||
if (user) {
|
||||
token.id = user.id;
|
||||
token.email = user.email;
|
||||
token.role = user.role;
|
||||
token.droit = user.droit;
|
||||
}
|
||||
return token;
|
||||
},
|
||||
async session(session, token) {
|
||||
session.user.id = token.id;
|
||||
session.user.email = token.email;
|
||||
session.user.role = token.role;
|
||||
async session({ session, token }) {
|
||||
console.log("Session callback called", token);
|
||||
if (!token) {
|
||||
throw new Error('Token not found');
|
||||
}
|
||||
session.user = {
|
||||
id: token.id,
|
||||
role: token.role,
|
||||
droit: token.droit
|
||||
};
|
||||
return session;
|
||||
}
|
||||
},
|
||||
pages: {
|
||||
signIn: '/[locale]/users/login'
|
||||
},
|
||||
csrf: false // Désactiver la gestion CSRF de NextAuth.js
|
||||
csrf: true
|
||||
};
|
||||
|
||||
export default csrfMiddleware((req, res) => NextAuth(req, res, options));
|
||||
export default (req, res) => {
|
||||
console.log("NextAuth handler called");
|
||||
return NextAuth(req, res, options);
|
||||
};
|
||||
@ -1,42 +0,0 @@
|
||||
import { useSession, getSession } from 'next-auth/react';
|
||||
import { useRouter } from 'next/router';
|
||||
import { useEffect } from 'react';
|
||||
|
||||
export default function ProtectedPage() {
|
||||
const [session, loading] = useSession();
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
if (!loading && !session) {
|
||||
router.push('/auth/signin');
|
||||
}
|
||||
}, [loading, session, router]);
|
||||
|
||||
if (loading || !session) {
|
||||
return <p>Loading...</p>;
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>Protected Page</h1>
|
||||
<p>Welcome, {session.user.email}</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export async function getServerSideProps(context) {
|
||||
const session = await getSession(context);
|
||||
|
||||
if (!session) {
|
||||
return {
|
||||
redirect: {
|
||||
destination: '/auth/signin',
|
||||
permanent: false
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
props: { session }
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user