Création d’une page de connexion

Dernière mise à jour le 25 avr. 2024
Annotation

L’interface utilisateur a été simplifiée sous Dreamweaver et versions ultérieures. Par conséquent, il se peut que vous ne trouviez pas certaines options décrites dans cet article sous Dreamweaver et versions ultérieures. Pour plus d’informations, consultez cet article.

À propos des pages de connexion

Votre application web peut contenir une page qui permet aux utilisateurs enregistrés de se connecter au site.

Une page de connexion se compose des éléments structurels suivants :

  • une table de base de données regroupant les utilisateurs déjà enregistrés ;

  • un formulaire HTML permettant aux utilisateurs d'entrer leur nom d'utilisateur et leur mot de passe ;

  • Un comportement de serveur Connexion utilisateur pour s'assurer que le nom d'utilisateur et le mot de passe saisis sont valides

    Une Variable de session composée du nom d'utilisateur est créée pour l'utilisateur lorsque celui-ci se connecte avec succès.

Créez une table de base de données des utilisateurs enregistrés

Vous avez besoin d'une table de base de données des utilisateurs enregistrés pour vérifier que le nom d'utilisateur et le mot de passe saisis dans la page de connexion sont valides.

Servez-vous de votre application de base de données et d'une page d'enregistrement pour créer la table. Pour obtenir des instructions, consultez le lien vers la rubrique correspondante ci-dessous.

L'étape suivante de la création d'une page de connexion consiste à ajouter un formulaire HTML à la page pour permettre aux utilisateurs de se connecter. Vous trouverez des instructions dans la rubrique suivante.

Ajoutez un formulaire HTML pour permettre aux utilisateurs de se connecter

Vous ajoutez un formulaire HTML à la page pour permettre aux utilisateurs de se connecter en saisissant un nom d'utilisateur et un mot de passe.

Créez une page (Fichier > Nouveau > page vierge), et organisez votre page de connexion à l'aide des Outils de conception Dreamweaver.
Ajoutez un formulaire HTML en plaçant le point d'insertion à l'endroit où vous souhaitez que le formulaire apparaisse et en choisissant Formulaire dans le menu Insertion.

Un formulaire vierge est créé sur la page. Il se peut que vous deviez activer Éléments invisibles (Affichage > Assistances visuelles > Éléments invisibles) pour afficher les limites du formulaire, qui sont représentées par de fines lignes rouges.

Nommez le formulaire HTML en cliquant sur la balise <form> en bas de la fenêtre de document pour sélectionner le formulaire, en ouvrant l'Inspecteur de propriétés (Fenêtre > Propriétés), et en saisissant un nom dans la zone Nom du formulaire.

Vous n'avez pas à spécifier un attribut action ou method pour le formulaire pour lui indiquer où et comment envoyer les données d'enregistrement lorsque l'utilisateur clique sur le bouton Envoyer. Le comportement de serveur Connexion utilisateur définit ces attributs pour vous.

Ajoutez un nom d'utilisateur et un champ de texte de mot de passe (Insertion > Formulaire > Champ de texte) au formulaire.

Ajoutez des libellés (sous forme de texte ou d'images) à côté de chaque champ de texte, et alignez les champs de texte en les plaçant dans un tableau HTML et en définissant l'attribut border du tableau à 0.

Ajoutez un bouton Envoyer au formulaire (Insertion > Formulaire > Bouton).

Vous pouvez modifier le libellé du bouton Envoyer en sélectionnant le bouton, en ouvrant l'Inspecteur de propriétés (Fenêtre > Propriétés), et en saisissant une nouvelle valeur dans la zone Libellé.

L'étape suivante de la création d'une page de connexion consiste à ajouter le comportement de serveur Connexion utilisateur pour vérifier que le nom d'utilisateur et le mot de passe saisis sont valides.

Vérification du nom d’utilisateur et du mot de passe

Vous devez ajouter un comportement de serveur Connexion utilisateur à la page de connexion pour vous assurer que le nom d'utilisateur et le mot de passe qu'un utilisateur saisit sont valides.

Lorsqu'un utilisateur clique sur le bouton Envoyer sur la page de connexion, le comportement de serveur Connexion utilisateur compare les valeurs saisies par l'utilisateur aux valeurs des utilisateurs enregistrés. Si les valeurs correspondent, le comportement du serveur ouvre une page (généralement l'écran de bienvenue du site).Si les valeurs ne correspondent pas, le comportement de serveur ouvre une autre page (généralement une page alertant l'utilisateur que la tentative de connexion a échoué).

Dans le panneau Comportements de serveur (Fenêtre > Comportements de serveur), cliquez sur le bouton Plus (+) et sélectionnez Authentification utilisateur > Connion dans le menu contextuel.
Spécifiez le formulaire et les objets de formulaire que les visiteurs utilisent pour saisir leur nom d'utilisateur et leur mot de passe.
(ColdFusion) Tapez votre nom d’utilisateur et votre mot de passe, le cas échéant.
Spécifiez la table de base de données et les colonnes qui contiennent les noms d'utilisateur et les mots de passe de tous les utilisateurs enregistrés.

Le comportement de serveur compare le nom d'utilisateur et le mot de passe qu'un visiteur saisit sur la page de connexion aux valeurs de ces colonnes.

Indiquez la page à ouvrir si la connexion est établie.

Cette page est généralement la page d’accueil du site.

Indiquez la page à ouvrir si la connexion échoue.

La page spécifiée alerte généralement l'utilisateur que le processus de connexion a échoué et permet à l'utilisateur de réessayer.

Si vous voulez que les utilisateurs redirigés vers la page de connexion après avoir tenté d'accéder à une page restreinte retournent à cette page restreinte après s'être connectés, sélectionnez l'option Atteindre l'URL précédente.

Si un utilisateur tente d'accéder à votre site en ouvrant une page restreinte sans se connecter d'abord, la page restreinte peut rediriger l'utilisateur vers la page de connexion.Une fois que l'utilisateur s'est connecté avec succès, la page de connexion redirige l'utilisateur vers la page restreinte qui l'avait redirigé vers la page de connexion au départ.

Annotation

Lorsque vous terminez la boîte de dialogue pour le comportement de serveur Restreindre l'accès à la page sur ces pages, assurez-vous de spécifier votre page de connexion dans la zone Si l'accès est refusé, atteindre.

Indiquez s'il faut octroyer l'accès à la page uniquement en fonction du nom d'utilisateur et du mot de passe, ou également en fonction du niveau d'autorisation, puis cliquez sur OK.

Un comportement de serveur est ajouté à la page de connexion qui garantit que le nom d'utilisateur et le mot de passe saisis par un visiteur sont valides.