23/11/2024

Autres

Développement Web

PHP- Authentification avec MySQL – Session

I. Présentation Dans ce tutoriel, nous allons apprendre à protéger notre base de données grâce à une authentification avec les outils MySql et la fonction Session en PHP (cette fiche). Le principe de la session PHP permet de sauvegarder des données inter-pages. Grâce à ceci, nous comparerons les données recueillies avec la liste des User enregistrés dans MySql et leur mot de passe pour vérifier que la session existe et est valable et L’utilisateur est correctement authentifié et le couple Login/Mot de passe existe. Nous commençons par un formulaire d’identification simple en HTML qui enverra les données à une page qui commencera la session et enregistrera les données reçu dans cette session. II. La page index.html Nous entrons le code suivant dans l’index.html : <FieldSet> <FORM action= »VerifId.php » method=POST> <Legend> Identification</Legend> <INPUT Type=Test Name= »Login » placeholder= »Login » required> <INPUT Type=Test Name= »Password » placeholder= »Passord » required> <INPUT Type=SUBMIT Value= »Log ! »> </FORM> </FieldSet> II. La page VerifId.php Le fichier VerifId.php aura pour but de débuter la session

Lire cet article
Développement Web

PHP – Base sur l’utilisation des sessions

I. Présentation Une session en PHP est utilisée pour que le serveur garde des informations sur le client pendant la période durant laquelle il visite le site. Entre le moment où il entre sur le site et le moment où il le quitte, il a effectué une session. Ces sessions PHP peuvent être utilisées pour sauvegarder des informations personnalisables entre les pages du site web. Les sessions en PHP sont un outil intéressant pour tout ce qui concerne la sauvegarde d’informations entres les pages web. Le passage de variables pour les utilisées entre plusieurs pages devient très simple avec les sessions PHP. II. Utilisation simple d’une session Dans ce tutoriel nous allons utiliser les sessions pour nous loguer sur un site. Nous allons pour commencer construire une simple formulaire qui enverra les infos (Login et mot de passe) III. La page index.html <FieldSet> <FORM action= »VerifId.php » method=POST> <Legend> Identification</Legend> <INPUT Type=Text Name= »Login » placeholder= »Login » required> <INPUT Type=Password Name= »Password » placeholder= »Password » required> <INPUT Type=SUBMIT

Lire cet article
Développement Web

Qu’est qu’un ID ? Une CLASS ?

I. Présentation En HTML, il y a deux façons de nommer un élément, avec un ID ou avec une CLASS. Faisons le point sur ces deux attributs. II. Qu’est-ce qu’un ID ? Un ID permet de définir un élément dans une page HTML pour ensuite lui attribuer des propriétés CSS dans une feuille de style. Les ID ont aussi l’avantage de fonctionner avec du Javascript grâce à l’élément GetElementById, contrairement au Class qui ne peuvent pas être appelée par du Javascript. Un ID doit être unique dans une page, il ne doit pas y en avoir plusieurs avec le même nom dans une même page sinon cela serait incorrect. L’ID doit désigner un seul et unique élément. – Définir une ID dans une page HTML (Exemple avec l’élément div) : <div id=’nom’> … </div> – Attribuer des propriétés CSS à cet élément : #nom { Propriété1 ; Propriété2 ; } III. Qu’est-ce qu’une CLASS ? Une Class permet elle aussi

Lire cet article
Développement Web

Premiers pas avec le CSS

I. Présentation Ce tutoriel a pour objectif de vous faire découvrir l’utilisation du CSS à l’intérieur d’une page HTML. II. Première personnalisation Pour cela, dans un premier temps il faut créer une page HTML contenant une structure de page basique, avec en plus un titre de page (balise <title>) et un titre dans la page (balise <h1>). Cette page contiendra ceci : Ce qui nous donnera à l’affichage : Maintenant que nous avons mis en place la page HTML, nous allons y intégrer du CSS, c’est à dire des propriétés qui affecterons l’apparence des éléments de la page visés. Pour cela il faut insérer une balise <Style type= »text/css »> et </Style> pour la fermeture, dans la partie <HEAD> de la page HTML. Ensuite à l’intérieur de cette balise on insère les propriétés CSS que l’on souhaite. Par exemple, pour mettre le fond du Body en noir et le titre centré et en jaune, il faudra écrire ceci  : Ce qui nous

Lire cet article
Développement Web

Importer une feuille de style CSS dans une autre

I. Présentation Pour importer une feuille de style dans une autre, ou même importer plusieurs feuilles de style dans une feuille on utilise la propriété CSS : @import. Selon la spécification du W3C il faut que cette propriété soit avant toutes les autres, autrement dit il faut la mettre au tout début de la page. II. La syntaxe @import @import url(« style.css »); Remplacez « style.css » vers le chemin vers votre feuille de style. Si vous souhaitez importer plusieurs feuilles de style, répétez cette ligne autant de fois que nécessaire afin de générer plusieurs appels consécutifs de feuilles de style. Il n’est pas possible d’importer plusieurs feuilles de style en une seule commande @import. Cette propriété est pratique car elle vous permet d’organiser vos styles dans différentes feuilles et d’avoir un meilleur contrôle de celle-ci et en plus de les utiliser indépendamment si vous en avez besoin.

Lire cet article
Développement Web

Déclarer une feuille de style (CSS) dans une page HTML

I. Présentation La feuille de style est un document qui va permettre de définir les caractéristiques de mise en forme des éléments d’une page web sur laquelle elle est déclarée. Ce tutoriel explique comment appeler une feuille de style (CSS) dans une page HTML. II. Déclarer une feuille CSS En effet, la feuille de style doit être référencée dans la page web où elle doit  s’appliquer. Pour cela il faut ajouter un lien vers cette feuille de style dans le HEAD de votre page : <HEAD> <LINK rel= »stylesheet » type= »text/css » href= »lien_vers_la_feuille »> </HEAD> On notera l’utilisation de la base « LINK » ainsi que de préciser qu’il s’agit d’un type CSS. Enfin, l’option « href » comme dans le cadre d’un lien standard doit contenir le chemin vers votre feuille de style au format .css. – Exemple si la feuille s’appelle styles.css : <HEAD> <LINK rel= »stylesheet » type= »text/css » href= »styles.css »> </HEAD>

Lire cet article
Développement Web

PHP – Passage de paramètres avec GET et POST

I. Présentation Dans ce tutoriel nous allons voir les bases sur le passage de paramètres entre page web par le PHP. Pour cela nous utiliserons deux méthode distinctes, la méthode POST et la méthode GET au travers de deux fichiers. Un fichier formulaire.html qui sera utilisé par l’utilisateur pour entrer des données et les envoyés pour les traiter. Un fichier enregistrement.php qui recevra puis traitera les données (les plus souvent, elles seront utilisées pour gérer une base de données). I. La méthode GET formulaire.html : Nous utilisons les balises suivante pour construire le formulaire : <FORM> </FORM> Nous y spécifions le fichier ou envoyé les données (action= »nomdufichier.php »). Les balises suivantes sont utilisées pour rentrer une nouvelle donnée: <INPUT> Celles-ci peuvent être de plusieurs type (texte, bouton radio, case a cocher, sélection dans une liste …). Nous y spécifions au minimum le type de donnée et son nom. Il ne faut pas oublier a la fin de notre formulaire le bouton

Lire cet article
Développement Web

Structure d’une page HTML

I. Présentation La structure d’une page HTML, c’est la base du web ! En parlant de ça, une page HTML se commence par la balise <html> et se termine par la balise </html>. Entre ces deux balises l’en-tête et le corps doivent être définit. L’en-tête grace à la balise <head> et à la balise de fermeture </head>, et le corps avec la balise <body> et </body>. II. Structure de base <html> <head> En tête </head> <body> Corps </body> </html> III. Que mettre dans l’en-tête ? – Donner un titre à votre page [ balise : <title> ] : <head> <title>Mon Titre</title> </head> – Indiquer la langue utilisée dans le site [ balise : <meta … /> ] <head> <meta http-equiv= »content-language » content= »fr » /> </head> – Indiquer des mots clés [ balise : <meta … > ] <head> <meta name= »keywords » content= »Mots1,Mots2″> </head> Note : Séparer chaque mot clé par une virgule. IV. Que mettre dans le corps ? C’est ici que vous

Lire cet article