L’importance de sécuriser nos données
Dans tous les aspects de la vie numérique moderne, la sécurité des utilisateurs authentifiés est d'une importance capitale. L'authentification assure que seules les personnes désignées peuvent accéder à des informations confidentielles, des comptes personnels ou des ressources vitales. En protégeant les identités des utilisateurs, on prévient efficacement les fraudes, les vols d'identité, les atteintes à la vie privée et bien plus encore. De plus, la sécurité des utilisateurs authentifiés est cruciale dans les environnements professionnels afin de préserver la confidentialité des données de l'entreprise contre les menaces internes et externes. Des mesures comme l'utilisation de mots de passe robustes, de l'authentification à deux facteurs et de solutions de sécurité avancées sont cruciales pour renforcer cette protection.
Supabase – Authentification
Supabase fournit les outils nécessaires pour mettre en place une authentification sécurisée dans les applications, ce qui permet aux développeurs de se concentrer sur la création de fonctionnalités sans se soucier des aspects complexes de la sécurité des utilisateurs.
Policies (Politiques)
Supabase permet manuellement de définir les règles et les autorisations qui régissent l'accès et l'utilisation des ressources au sein des tables de la base de données. Ces directives permettent de contrôler les actions des utilisateurs et des applications, en spécifiant ce qui est autorisé ou interdit. Par exemple, pour la table Profile, il a été spécifié que les utilisateurs pouvaient consulter, ajouter ou modifier n'importe quel profil.
Providers (Fournisseurs)
Supabase offre également la possibilité d’authentifier ses utilisateurs à l’aide de fournisseur externe comme Google, Facebook, Discord et bien d’autre. C'est parfait pour profiter des fonctionnalités supplémentaires offertes par ces fournisseurs en matière d'hébergement, de stockage de données, d'authentification et bien d'autres encore.
Rate Limits (Limites de taux)
Supabase mets en place des limites de taux, des mécanismes utilisés pour contrôler le nombre de requêtes qu'un utilisateur ou une application peut envoyer à un service web ou une API dans un laps de temps donné. Ces limites sont généralement mises en place pour éviter la surcharge des serveurs, prévenir les abus ou garantir une utilisation équitable des ressources. Pour le moment, les limites sont 3 email par heure et 30 messages SMS par heure, ce qui est très peu. C'est la raison pour laquelle Supabase encourage l'utilisation d'un ou plusieurs fournisseurs pour assurer l'authentification sécurisée des utilisateurs pour les plus grands projets.
Email Templates (Modèles d'email)
Supabase propose également des modèles d'email préconçues utilisées pour créer des messages électroniques avec un formatage cohérent et professionnel. Il offre des modèles comme pour confirmer une inscription, inviter un utilisateur, changer l’email ou le mot de passe. Ces modèles sont utiles surtout pour les marketeurs utilisent souvent des modèles d'email pour automatiser l'envoi de communications par email telles que des newsletters, des confirmations de commande, des notifications et plus encore.
URL Configuration (Configuration des URL)
Par défaut, l'utilisateur sera redirigé vers l’url de base du site mais il est possible de la changer ou ajouter des URL de redirection supplémentaires à la liste des autorisations. Une fois que vous avez ajouté les URLs nécessaires à la liste des autorisations, vous pouvez spécifier l'URL vers laquelle vous souhaitez rediriger l'utilisateur dans le paramètre redirectTo.
Authentifié Utilisateur
Autorisation
La fonction supabase.auth.getUser(), s’occupe de récupérer les données de l’utilisateur depuis la session une fois que l’utilisateur se connecte.
Code :
<script setup>
import { ref, onMounted } from 'vue';
import { supabase } from '../../lib/supabaseClient';
const user = ref(null);
//Obtenir les utilisateurs
async function getUtilisateur() {
try {
const { data } = await supabase.auth.getUser()
user.value = data
console.log(user)
} catch (error) {
console.error('Error fetching data:', error.message)
} finally {
loading.value = false
}
}
onMounted(async () => {
getUtilisateur()
});
</script>
Connexion
La fonction supabase.auth.signInWithPassword(), s’occupe de récupérer les données de l’utilisateur depuis les serveurs de Supabase et ouvre une session contenant ces données, une fois connecté. Grâce à cette fonction Supabase pourra savoir automatiquement si l’utilisateur authentifié à les droits d’accès sur certaines données.
Code :
<script setup>
import { ref } from 'vue';
import { supabase } from '../../../lib/supabaseClient';
const email = ref('');
const mdp = ref('');
const connexion = async () => {
try {
const { user, error } = await supabase.auth.signInWithPassword({
email: email.value,
password: mdp.value
});
if (error) {
console.error('Erreur lors de la connexion :', error.message);
} else {
console.log('Connecté avec succès :', user);
// Redirect the user to home page upon successful login
window.location.href = '/'; // Update the path to your home page
}
} catch (error) {
console.error('Erreur lors de la connexion :', error.message);
}
};
</script>
Déconnexion
La fonction supabase.auth.signOut(), permet de tout simplement déconnecter l’utilisateur, en vidant la session.
Code :
<script setup lang="ts">
import { RouterLink, RouterView } from "vue-router";
import { supabase } from '../../lib/supabaseClient';
const logout = async () => {
try {
const { error } = await supabase.auth.signOut();
if (error) {
console.error('Erreur lors de la déconnexion :', error.message);
} else {
console.log('Déconnecté avec succès');
window.location.reload()
}
} catch (error) {
console.error('Erreur lors de la déconnexion :', error.message);
}
};
</script>
Vidéo qui montre les résultats
Source
Build a User Management App with Vue 3. https://supabase.com/docs/guides/getting-started/tutorials/with-vue-3
(Consulté le 24 février 2024)
Redirect URLs. https://supabase.com/docs/guides/auth/concepts/redirect-urls
(Consulté le 24 février 2024)
Part Two: Row Level Security. https://supabase.com/docs/guides/auth/auth-deep-dive/auth-row-level-security
(Consulté le 24 février 2024)
Rate limiting, resource allocation, & abuse prevention. https://supabase.com/docs/guides/platform/going-into-prod#rate-limiting-resource-allocation--abuse-prevention
(Consulté le 24 février 2024)
Email Templates. https://supabase.com/docs/guides/auth/auth-email-templates
(Consulté le 24 février 2024)
Commentaires