Remarque :

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

À propos des pages de connexion

Votre application Web peut contenir une page qui permettra 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 Connecter l’utilisateur qui vérifie que le nom d’utilisateur et le mot de passe saisis sont valides ;

    une variable de session correspondant au nom d’utilisateur est créée pour l’utilisateur lorsqu’il se connecte avec succès.

Création d’une table de base de données des utilisateurs enregistrés

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

  1. Pour créer cette table, utilisez votre application de base de données et une page d’enregistrement. Pour plus d’informations, consultez le lien vers la rubrique connexe ci-dessous.

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

Ajout d’un formulaire HTML permettant aux utilisateurs de se connecter

Ajoutez un formulaire HTML à la page afin de permettre aux utilisateurs de se connecter en entrant un nom d’utilisateur et un mot de passe.

  1. Créez une page (Fichier > Nouveau > Page vierge) et mettez en forme votre page de connexion à l’aide des outils de création de Dreamweaver.
  2. Pour ajouter le formulaire HTML, placez le point d’insertion à l’endroit où le formulaire doit apparaître, puis choisissez Insertion > Formulaire.

    Un formulaire vierge est créé sur la page. Il est parfois nécessaire d’activer les éléments invisibles (Affichage > Assistances visuelles > Eléments invisibles) pour afficher les contours du formulaire, représentés par de fines lignes rouges.

  3. Pour nommer le formulaire HTML, commencez par le sélectionner en cliquant sur la balise <form> au bas de la fenêtre de document, ouvrez l’inspecteur Propriétés (Fenêtre > Propriétés), puis entrez un nom dans la zone Nom du formulaire.

    Vous n’avez pas besoin de définir l’attribut action ou method du formulaire pour lui indiquer où et comment envoyer les données d’enregistrement lorsque l’utilisateur clique sur le bouton Envoyer. En effet, le comportement de serveur Connecter l’utilisateur définit automatiquement ces attributs.

  4. Ajoutez au formulaire les champs de texte Nom d’utilisateur et Mot de passe (Insertion > Formulaire > Champ de texte).

    Ajoutez des étiquettes (texte ou images) à côté de chaque zone de texte, puis organisez ces zones en les plaçant dans un tableau HTML et en donnant à l’attribut BORDER de la table la valeur 0.

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

    Vous pouvez modifier l’étiquette du bouton Envoyer ; pour ce faire, sélectionnez ce bouton, ouvrez l’inspecteur Propriétés (Fenêtre > Propriétés) et entrez une nouvelle valeur dans la zone Etiquette.

    L’étape suivante de la création d’une page de connexion consiste à ajouter le comportement de serveur Connecter l’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 le comportement de serveur Connecter l’utilisateur à la page de connexion pour vérifier la validité du nom d’utilisateur et du mot de passe tapés par un utilisateur.

Lorsqu’un utilisateur clique sur le bouton Envoyer, sur la page de connexion, le comportement de serveur Connecter l’utilisateur compare les valeurs saisies par l’utilisateur à celles des utilisateurs déjà enregistrés. Si les valeurs correspondent, le comportement de serveur ouvre une page (généralement la page d’accueil du site). Si elles ne correspondent pas, le comportement de serveur ouvre une autre page (qui alerte généralement l’utilisateur que la connexion a échoué).

  1. Dans le panneau Comportements de serveur (Fenêtre > Comportements de serveur), cliquez sur le bouton Plus (+). Dans le menu déroulant, sélectionnez Authentification de l’utilisateur > Connecter l’utilisateur.
  2. Définissez le formulaire et les objets de formulaire que les visiteurs utilisent pour entrer leur nom d’utilisateur et leur mot de passe.
  3. (ColdFusion) Tapez votre nom d’utilisateur et votre mot de passe, le cas échéant.
  4. Définissez la table de la base de données et les colonnes qui contiennent les noms d’utilisateur et les mots de passe de tous les utilisateurs déjà enregistrés.

    Le comportement de serveur compare le nom d’utilisateur et le mot de passe entrés par le visiteur sur la page de connexion aux valeurs de ces colonnes.

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

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

  6. Indiquez la page à ouvrir si la connexion échoue.

    Cette page alerte généralement l’utilisateur que la connexion a échoué et lui permet un nouvel essai.

  7. Si vous voulez que les utilisateurs envoyés vers la page de connexion après avoir essayé d’accéder à la page retournent à cette page d’accès restreint après la connexion, choisissez l’option Aller à l’URL précédente.

    Si un utilisateur essaie d’accéder à votre site en ouvrant une page à l’accès restreint sans s’être préalablement connecté, la page à accès restreint peut l’envoyer vers la page de connexion. Une fois l’utilisateur connecté, la page de connexion le redirige vers la page à accès restreint qui l’a préalablement envoyé vers la page de connexion.

    Remarque :

    Lorsque vous saisissez les informations relatives au comportement de serveur Restreindre l’accès à la page dans la boîte de dialogue, prenez soin de préciser la page de connexion dans la zone de texte Si l’accès est refusé, aller à.

  8. Indiquez si l’accès à la page est accordé selon le nom d’utilisateur et le mot de passe uniquement ou également selon un niveau de privilèges, puis cliquez sur OK.

    Un comportement de serveur est ajouté à la page de connexion. Il est destiné à vérifier que le nom d’utilisateur et le mot de passe saisis par le visiteur sont valides.

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne