Rapport de stage développé en PHP/MySQL

Transcription

1 Université Montpellier II Institut Universitaire de Technologie Département Informatique Seconde Année Année Universitaire 2005/2006 développé en PHP/MySQL Présenté et soutenu par Sandrine BUENDIA Préparé sous la direction de Madame. BAILLEUL

2

3 Université Montpellier II Institut Universitaire de Technologie Département Informatique Seconde Année Année Universitaire 2005/2006 développé en PHP/MySQL Présenté et soutenu par Sandrine BUENDIA Préparé sous la direction de Madame. BAILLEUL

4 Remerciements Remerciements Je tiens à remercier toutes les personnes qui ont contribué au bon déroulement de mon stage, et notamment Madame BAILLEUL, ma tutrice, pour m avoir accueillie et permis de travailler au sein de son entreprise, ainsi que Monsieur BAILLEUL, pour leurs remarques et les conseils qu ils m ont fourni pour la bonne réalisation de ce projet. Je souhaite aussi remercier tous les internautes qui m ont permis de résoudre certains problèmes que j ai rencontré lors de la réalisation du site Internet, en m apportant leur aide.

5 Glossaire Glossaire Apache : Serveur Web gratuit fonctionnant sous Linux et Windows NT. Il permet, entre autre, l interprétation du langage PHP. CNIL : La Commission Nationale de l'informatique et des Libertés est une institution française chargée de veiller à la protection des données personnelles. Créée par la loi n du 6 janvier 1978 relative à l'informatique, aux fichiers et aux libertés, la CNIL est une autorité administrative indépendante. HTML : Abréviation de l'anglais Hyper Text Markup Language, langage informatique créé et utilisé pour écrire les pages Web. HTML permet, en particulier, d'insérer des hyperliens dans du texte, donc de créer de l'hypertexte, d'où le nom du langage. MySQL : Système de gestion de base de données souvent utilisé en complémentarité du PHP. PHP : Langage de programmation pour des applications sur le web. PHP est un langage de script exécuté côté serveur. Langage élaboré inclut dans une page HTML qui permet une interaction avec l utilisateur. Technologie permettant la création de pages web au contenu dynamique. Requête : Dans une base de données, une requête offre la possibilité de rechercher des données en spécifiant des critères. SGBD : La gestion et l'accès à une base de données sont assurés par un ensemble de programmes qui constituent le Système de Gestion de Base de Données (SGBD). UML : (Unified Modeling Language/Langage unifié pour la modélisation). C'est un langage graphique qui permet de représenter, de manière claire et précise, sous forme de modèle objet, la structure et le comportement des processus. En tant que tel, il facilite la création et la compréhension des logiciels actuels. XML : Extensible Markup Language est un standard du World Wide Web Consortium qui sert de base pour créer des langages balisés spécialisés; c'est un «méta langage». World Wide Web Consortium : Le World Wide Web Consortium, abrégé W3C, est un consortium fondé en octobre 1994 pour promouvoir la compatibilité des technologies du World Wide Web telles que HTML, XHTML, XML, CSS, PNG, SVG et SOAP. Le W3C n'émet pas de normes, mais des recommandations.

6 Sommaire Sommaire 1. Introduction.. 7 Pages 2. Matériels et méthodes... 8 à Cahier des charges Fonctionnalités du site 9 à Analyse.. 11 à La partie utilisateur La partie administrateur Le choix des langages Méthode. 14 à Synthèse 16 à Résultats à Partie utilisateur 18 à Partie administrateur à Discussion Conclusion à Références techniques 27 à Dossier d analyse 27 à Dossier de programmation 35 à 84

7 Introduction 1. Introduction En fin de seconde année, les étudiants du département informatique de l IUT de Montpellier doivent effectuer un stage en entreprise. Celui-ci est très important avant l attribution du diplôme de fin d études, car il permet à l étudiant de connaître ce que représente le travail en entreprise, mais aussi d appliquer les connaissances acquises au cours du cursus universitaire. Le travail que j ai effectué lors de ce stage consistait à réaliser le site Internet de l entreprise «L antre du dragon». La principale activité de cette entreprise est la vente d articles de jeux, de statuettes, de livres, Mais le magasin organise également des évènements tels que des concours de peinture de figurines, des tournois,... Le site permettra donc au magasin de présenter ces évènements, mais aussi les articles qu il propose, les nouveautés, Je vais donc développer, tout au long de ce rapport, les différentes étapes de mon travail. Tout d abord, je vais décrire le cahier des charges, afin d examiner les attentes de ma tutrice, puis j expliquerai les méthodes utilisées. Ensuite je présenterai le résultat obtenu en concordance avec le cahier des charges. Pour finir, la dernière partie de ce rapport sera consacrée au bilan du stage. Je réaliserai, dans celle-ci, une discussion afin d analyser les points forts et les points faibles du travail effectué, avant de conclure le rapport.

8 Matériels et méthodes 2. Matériels et méthodes 2.1. Cahier des charges Le but de mon stage étant de réaliser le site Internet de «L antre du dragon», il fallait donc, au début de celui-ci, définir les points essentiels de mon travail, ainsi que ses limites. Tout cela sera donc regroupé dans le cahier des charges, en fonction des attentes de ma tutrice. Le site s adresse aux personnes connaissant déjà le magasin, mais aussi à celles souhaitant le découvrir. Ces personnes vont donc pouvoir consulter les évènements, les nouveautés, le catalogue du magasin, Pour que l affichage des informations désirées par les visiteurs corresponde à leurs attentes, il faut que le site soit dynamique et que l affichage se fasse en fonction de leurs demandes. De plus, pour faciliter la navigation dans le site et la recherche d informations, un moteur de recherche interne doit être toujours présent à l écran, pour qu à n importe quel moment le visiteur puisse effectuer une recherche et trouver très rapidement l information qu il désire. L un des souhaits de ma tutrice est de permettre aux visiteurs de consulter les articles du catalogue du magasin, mais aussi d effectuer des réservations. Afin d éviter que n importe quelle personne puisse effectuer des réservations (étant donné qu il faudra venir récupérer la commande au magasin), le visiteur sera obligé de s inscrire sur le site, et donc de devenir un membre. Il va ainsi falloir prévoir une partie réservée aux membres, dans laquelle ils auront accès à leurs informations et pourront y effectuer des modifications. Un autre objectif essentiel de mon travail est de permettre une mise à jour facile du site Internet. Ainsi, même si la personne chargée de la maintenance du site n a aucune connaissance dans le langage de programmation utilisé, elle pourra mettre à jour le site. Elle pourra ainsi ajouter des informations, les modifier ou les supprimer. Au niveau de l aspect visuel du site, les couleurs ont été adaptées à celles du logo du magasin (le logo étant déjà créé). C est donc le ton violet qui va prédominer dans l intégralité du site. La solution retenue pour la structure du site est donc de le diviser en deux grandes parties : une partie «utilisateur», qui sera accessible par tous, et une partie «administrateur», qui permettra la mise à jour du site Internet. 8

9 Matériels et méthodes 2.2. Fonctionnalités du site On a vu précédemment que le site Internet de «L antre du dragon» allait être divisé en deux grandes parties : la partie utilisateur destinée aux visiteurs et la partie administrateur réservée à la personne chargée de mettre à jour le site. La partie utilisateur sera visible et accessible par tous. Elle permettra aux visiteurs de découvrir ou redécouvrir le magasin, de se tenir au courant des évènements et des nouveautés, mais aussi d effectuer des réservations en ligne. Cependant, un simple utilisateur ne pourra pas effectuer de réservations, afin d éviter les abus. Il devra donc s inscrire et devenir membre. La partie administrateur sera, en quelques sortes, «cachée» aux visiteurs. Pour y accéder, il faudra être inscrit sur le site en tant qu administrateur. Cette partie permet de mettre à jour le site rapidement et facilement, sans que l administrateur ait besoin d avoir de connaissances particulières en informatique. Ces deux parties seront, elles-mêmes, divisées en plusieurs sous-parties et chacune d entre elles fera appel à son propre menu. Par exemple, la partie nouveautés fera appel au menu des nouveautés, la partie évènements fera appel au menu des évènements, Ainsi, grâce aux liens présents dans les menus, les utilisateurs du site auront accès aux différentes fonctionnalités qui leurs sont proposées. Voici les différentes parties du site, accessibles grâce au menu : La partie utilisateur : - La partie accueil contiendra un descriptif du magasin (horaires d ouverture, plan d accès, ). C est une partie statique. - La partie news contiendra les nouveautés du magasin. Seules les 10 dernières news sont affichées. Les plus anciennes seront stockées en archives. - La partie événement présentera les événements proposés par le magasin. Comme pour les news, les plus vieux évènements seront archivés. Les évènements peuvent être illustrés par un album photos. Les évènements peuvent être de plusieurs types : tournois, concours de peinture, concours de décors, - La partie catalogue présentera certains articles du magasin. Tout le monde peut les consulter, mais seuls les membres peuvent effectuer une réservation. Pour devenir membre, le visiteur doit s inscrire sur le site ; Une fois inscrit, l administrateur du site doit activer le compte du membre. Si le compte est activé, le membre peut se connecter et effectuer une réservation. - La partie liens contiendra des liens vers d autres sites. - Les membres, une fois connectés, peuvent consulter leurs informations, les modifier, modifier leur code et supprimer leur compte. 9

10 Matériels et méthodes La partie administrateur : - Une partie du site permettra d activer le compte des membres ou de refuser cette activation. En cas de refus, l administrateur aura la possibilité de remettre le compte à l état «inactif» ou de supprimer le membre de la base de données. - Une partie du site permettra de supprimer un compte actif ou de le désactiver. - Une partie du site permettra de gérer les administrateurs : l administrateur du site est un membre avec des droits particuliers. Dans cette partie, on pourra soit supprimer un administrateur, soit en ajouter un. - Une partie du site permettra de créer des albums photos afin d illustrer les évènements. On pourra aussi modifier ou supprimer les albums photos existants. - Une partie permettra de gérer les news : créer, modifier ou supprimer une news. - Une partie permettra de gérer les événements : créer, modifier ou supprimer un événement. - Une partie du site permettra de gérer le catalogue. On pourra ainsi ajouter un article ou une catégorie d article, modifier ou supprimer un article ou une catégorie d article. - Une partie permettra de récupérer la liste des réservations : c est un fichier.rtf à télécharger. 10

11 Matériels et méthodes 2.3. Analyse La partie utilisateur Pour répondre au mieux au cahier des charges et intégrer toutes les fonctionnalités désirées dans la partie utilisateur du site, j ai choisi de diviser le menu en deux parties : un menu général et un menu détaillé. Le menu général contient les grandes parties du site, c est-à-dire l accueil, les nouveautés, les évènements, le catalogue et les liens. A chaque partie correspond un menu détaillé. Par exemple, pour la partie accueil du menu général, il correspondra un menu détaillé dans lequel on aura accès aux horaires d ouverture, au plan d accès et aux photos du magasin. On a vu aussi précédemment que l utilisateur a la possibilité de s inscrire sur le site pour effectuer des réservations. C est grâce au lien «S inscrire» que les visiteurs pourront indiquer les informations les concernant. Une fois le formulaire complété et vérifié, les données saisies sont enregistrées dans la base de données et le visiteur devient un membre. Une partie doit donc être réservée aux membres lorsqu ils sont connectés. C est la partie «Mon compte». Dans cette partie, les membres pourront consulter leurs informations, les modifier ou les supprimer. Afin que les membres puissent saisir leurs données personnelles en toute confiance sur le site Internet, le numéro de déclaration du site à la CNIL est indiqué. La CNIL est une institution française chargée de veiller à la protection des données personnelles. Effectuer une déclaration auprès de cet organisme est obligatoire dès lors que la base de données utilisée par le site contient des informations nominatives. Dans notre cas, la base de données contient le nom, le prénom, l adresse et postale, Cette déclaration est donc nécessaire. 11

12 Matériels et méthodes La partie administrateur L un des principaux but fixé lors de la réalisation du cahier des charges était de permettre à n importe quelle personne à qui on en a confié la responsabilité, de mettre à jour rapidement et simplement le site. C est donc au niveau de la partie administrateur que cela sera possible. Dans cette partie, il n y a aucune page statique, car chaque lien du menu va permettre à l administrateur de travailler avec les données du site. Il va pouvoir ainsi saisir des informations, les modifier ou les supprimer. Dans la partie qui va permettre à l administrateur d enregistrer des données, je vais devoir utiliser des formulaires, afin de demander à l administrateur des informations précises à saisir. De plus, il faut afficher les données déjà enregistrées, quand ceci est possible, afin d éviter à l administrateur de faire des aller/retour entre la partie qui lui est réservée et la partie utilisateur. Par exemple, dans la partie qui permet de gérer les news, en dessous du formulaire qui sert à ajouter une nouveauté, il y a la liste des news déjà enregistrées dans la base de données, suivie du lien «modifier» et du lien «supprimer». Ainsi, sur la même page, toutes les informations et les opérations concernant les news sont disponibles. La démarche à suivre pour le traitement des données est très cadrée. Il est indiqué à l administrateur du site toutes les étapes à suivre pour le bon déroulement de chaque opération. Ceci lui permet donc de mettre à jour le site sans difficultés. De plus, lors de l envoi d un formulaire, de nombreuses vérifications sont effectuées afin d éviter au maximum les erreurs. Par exemple, une vérification des champs du formulaire est réalisée, c est-à-dire qu il faut vérifier automatiquement si tous les champs obligatoires sont remplis, si l information entrée correspond bien à l information qui est attendue (par exemple on vérifie si l adresse contient bien le Si l administrateur commet tout de même une erreur, il a toujours la possibilité de modifier les informations qu il a enregistré dans la base de données. Nous voyons donc que, dans cette partie, il y a de nombreuses pages qui vont traiter les formulaires, grâce à des scripts, pour enregistrer les informations qui y sont inscrites. Il faut donc que le langage qui permet de traiter des scripts et le langage qui permet de traiter la base de données, soient complémentaires : il faut que le langage de programmation assure une bonne liaison avec la base de données. 12

13 Matériels et méthodes Le choix des langages Il découle de cette analyse que le langage le plus approprié pour la programmation du site, en plus de HTML qui nous servira de base, sera le PHP, lui-même combiné à un système de gestion de base de données, MySQL. Ce sont les langages que l on utilise le plus souvent pour la programmation des sites Internet, car ils permettent de rendre les pages Web plus dynamiques. Tout d abord, le PHP est un langage de programmation qui s'intègre dans les pages HTML. Il permet, entre autres, de rendre automatiques des tâches répétitives, notamment grâce à l utilisation de fonctions qui sont en quelques sortes des petits programmes permettant d accomplir ces tâches, et grâce à la communication avec une base de données (qui contient les informations). C est, par exemple, une fonction écrite en PHP qui servira à afficher l album photos illustrant un événement, et une requête SQL qui permettra d enregistrer les informations concernant l album (nom de l album, date de création, ) dans la base de données. Pour la saisie d informations par l administrateur, par exemple pour l enregistrement d un nouvel événement, l utilisation des formulaires HTML et le traitement de ces formulaires par PHP sera le plus approprié. Le formulaire HTML permettra d afficher à l écran les champs dans lesquels l administrateur devra saisir les informations, une fonction PHP permettra d effectuer les vérifications nécessaires sur les informations saisies, et pour finir, une requête SQL permettra d enregistrer dans la base de données le nouvel événement. Ce principe s appliquera dans la majeure partie de la partie administrateur, afin de lui permettre d ajouter facilement des informations dans la base de données. C est donc la combinaison de ces trois langages qui va permettre d alimenter la base de données, mais aussi d y effectuer des modifications ou des suppressions. De plus, il fallait choisir un langage permettant de manipuler les sessions. Une session correspond à l intervalle de temps compris entre le premier accès par un utilisateur au site Internet et la clôture de toutes les fenêtres de son navigateur. Les sessions permettront de stocker les informations concernant le membre connecté, par exemple son pseudo, ses droits, PHP gère très bien les sessions et elles sont plus simples à utiliser et à mettre en oeuvre. Pour l écriture des pages de code du site Internet, j ai choisi, sous les conseils de Monsieur MAHE, la programmation en deux couches. Cela consiste à séparer le code (HTML et PHP) et les requêtes SQL. Ainsi, chaque page du site utilisant des requêtes SQL fera appel au fichier requetes.php qui contiendra toutes les requêtes utilisées dans le site. 13

14 Matériels et méthodes 2.4. Méthode Avant de créer la base de données et d avoir un aperçu de l ensemble du travail à effectuer, il faut réaliser une analyse du projet. Après en avoir discuté avec ma tutrice, j ai choisi la méthode UML pour effectuer cette analyse. L analyse se découpe en plusieurs parties : le diagramme de cas d utilisation (voir annexe page 27), le diagramme de classes (voir annexe page 28), les transitions d états (voir annexe page 28) et les diagrammes de séquences (voir annexes pages 29 à 34). Les diagrammes de cas d utilisation et de séquence servent à représenter l aspect dynamique : ils permettent de montrer les interactions entre les objets des différentes classes. Le diagramme de classes permet de représenter l aspect statique des structures et énumère les différentes classes du système à modéliser. Pour finir, le diagramme d états transitions représente le cycle de vie d un objet d une classe donnée. Voici une description des différentes classes représentées sur le diagramme de classes qui nous servira à réaliser les différentes tables de la base de données. Le magasin (pour l instant unique) contient des articles (de 1 à plusieurs) et ces articles sont représentés par une référence, une désignation, un prix et une variable «stock» qui permet de savoir si l article est en stock ou non. Un article appartient à une seule catégorie (dans une catégorie il peut y avoir plusieurs articles). Une catégorie est représentée par un numéro, un nom et une variable «information» qui contient des informations concernant la catégorie. Le magasin organise des évènements (de 0 à plusieurs). Les évènements sont représentés par un numéro, un nom, une date de début et une date de fin, une heure de début et une heure de fin, une variable «nbplace» qui contient le nombre de places disponibles pour l événement, une variable «type» qui permet de déterminer de quel type est l événement, une variable «montant» qui contient le montant du coût d inscription à l événement et une variable «info» qui contient des informations concernant cet événement. Un événement peut être illustré par un album photos (un album au maximum). L album est représenté par un numéro, un nom de dossier (le nom du dossier contenant les photos), la date de l événement et des commentaires. Un membre est un visiteur particulier (il peut effectuer les mêmes actions que le visiteur, en complément des actions qui lui sont spécifiques) et l administrateur est un membre particulier (il peut effectuer les mêmes actions que le membre, en plus des actions qui lui sont spécifiques). Un membre (et donc un administrateur) peut effectuer une réservation de 0 à plusieurs). Une réservation est représentée par la date de la commande et son montant. 14

15 Matériels et méthodes Une commande est composée d articles (de 1 à plusieurs). La quantité d un article est représentée par la donnée portée «quantité» contenant le nombre de produits. Le diagramme des cas d utilisation permet de voir l ensemble des actions possibles par les différents acteurs. Ici, les acteurs sont les visiteurs, les membres et les administrateurs. Ainsi, le visiteur va pouvoir s inscrire et contacter un administrateur, le membre va pouvoir demander son code oublié, se connecter, gérer son compte et effectuer une réservation, et l administrateur va pouvoir gérer les comptes membres, gérer les administrateurs, gérer les albums photos, gérer les news, gérer les évènements et récupérer la liste des réservations. Le diagramme de séquence représente, en quelques sortes, le détail ou le déroulement de chaque action du diagramme des cas d utilisation. Par exemple, pour le premier diagramme, «s inscrire», le visiteur envoie le formulaire d inscription complété à l interface, l interface envoie la requête à la base de données. Les informations sont enregistrées au niveau de la base de données, puis un message «ok» est affiché sur le navigateur de l utilisateur et il se retrouve ainsi connecté avec son compte. Pour finir, les diagrammes de transition d état représentent les différents états acquis par un objet. Par exemple, au niveau de l état transition du membre : le visiteur se connecte au site. Il se connecte avec son login et son code : il devient un membre si son droit est 1, ou un administrateur si son droit est 2. Il peut ensuite, soit se déconnecter et il redevient un visiteur, soit supprimer son compte et il redevient aussi un visiteur. Il existe également une table indépendante qui n est pas représentée dans ces diagrammes, mais qui est quand même présente dans la base de données et qui permet d'enregistrer des informations. Il s agit de la table «archives» qui sert à stocker les news et leur date de publication. 15

16 Matériels et méthodes 2.5. Synthèse Le site Internet sera donc divisé en deux grandes parties : la partie utilisateur et la partie administrateur. Voici un schéma de synthèse qui résume le fonctionnement du site : La partie utilisateur permet à tout le monde de consulter les informations présentes dans le site. Quand un visiteur consulte une page, comme les archives des news par exemple, le fait de choisir une date va déclencher l envoi d une requête SQL vers la base de données. Ceci va permettre un affichage dynamique et personnalisé des informations. Lorsque le visiteur se connecte depuis la partie utilisateur, il devient un membre et a donc accès à l espace «mon compte». C est à partir d ici que le membre va pouvoir modifier, consulter ou supprimer ses informations. Si le membre à des droits spéciaux, cela signifie que c est un administrateur. Il a donc accès à la partie administration du site. C est à partir de cet endroit que l administrateur va pouvoir mettre à jour le site Internet : grâce à des requêtes envoyées à la base de données, il va pouvoir ajouter, modifier ou supprimer des informations. 16

17 Matériels et méthodes Nous avons vu ensuite que c est la combinaison des langages HTML, PHP et MySQL qui va permettre de rendre le site dynamique. Voici un schéma récapitulant le fonctionnement de la combinaison de ces trois langages : Le client représente votre ordinateur. Lorsqu on entre l adresse du site Internet (l url) dans le navigateur, le code de la page est envoyé au serveur. Si le serveur détecte l utilisation du langage PHP dans le code, il exécute ce code. Ensuite, si des requêtes SQL sont aussi présentes dans le code, elles sont envoyées au SGBD et le SGBD renvoie les informations voulues (les informations à afficher par exemple). La page de code est ensuite renvoyée au serveur, puis au client. La fenêtre du navigateur du client affiche donc les informations voulues, en fonction des requêtes SQL et des scripts PHP. 17

18 Résultats 3. Résultats 3.1. Partie utilisateur On a vu précédemment que le site est divisé en deux grandes parties. La première partie est donc la partie utilisateur. Lorsqu un visiteur entre l adresse du site, il arrive sur la page d accueil. Voici un aperçu de la structure générale du site (voir annexe page 35): Sur la gauche du site, un champ est réservé au moteur de recherche. Si le visiteur recherche une chose précise sur le site, il lui suffit de saisir dans ce champ le ou les mots clés de sa recherche et de cliquer sur le bouton «ok». Le nombre de résultats de la recherche s affiche ensuite dans la partie centrale du site, ainsi que la liste des résultats. Un résultat est, en fait, un résumé du texte dans lequel se trouve le ou les mots clés et il suffit de cliquer sur ce résumé pour lire l intégralité du texte. Sous le moteur de recherche, deux champs permettent aux membres de s identifier : le champ login et le champ code. C est la combinaison de ces deux champs qui va permettre l identification du membre : on vérifie que le login indiqué correspond bien au mot de passe enregistré dans la base de données. Si c est le cas, une session membre est créée et le membre peut naviguer sur le site tout en restant connecté (voir annexe page 39). 18

19 Résultats Avant de devenir membre, le visiteur doit s inscrire sur le site. C est le lien «s inscrire», se situant sous les champs de connexion, qui va permettre ceci : lorsque le visiteur clique sur ce lien, un formulaire lui demandant des informations personnelles s affiche à l écran. Ces informations vont permettre à l administrateur d identifier le membre. Avant de valider l inscription, des vérifications sont effectuées. Par exemple, on vérifie que le login saisi n existe pas déjà, que le code postal contient bien cinq chiffres, Une fois l inscription effectuée, le membre pourra, à chaque fois qu il le souhaite, se connecter au site, en utilisant le login et le code qu il a indiqué (voir annexe page 56). Si le membre ne parvient pas à se connecter, c est peut être parce qu il a oublié son code. Lors de son inscription sur le site, le membre a indiqué son adresse e- mail. Donc, en cliquant sur le lien code oublié et en indiquant son login et son adresse , un message sera envoyé sur l adresse de messagerie électronique indiquée. Un nouveau code, généré aléatoirement, est attribué au membre et ce message lui indique le nouveau code. Il lui suffira ensuite de se connecter avec son login et son nouveau mot de passe, puis de le modifier dans la partie «mon compte», s il le désire. Bien entendu, une vérification est effectuée avant l attribution du nouveau code : il faut vérifier que la combinaison login/adresse correspond aux informations enregistrées dans la base de données (voir annexe page 62). Le lien permettant d accéder à la partie «mon compte» est accessible une fois que le membre est connecté. Dans cette partie, il aura accès à ses informations : il pourra les consulter, les modifier ou supprimer son compte (voir annexe page 66). Sous le lien «mon compte» se trouve le lien permettant au membre de se déconnecter. Lorsque le membre clique sur ce lien, toutes les informations le concernant, stockées dans la session, sont détruites. C est le cas aussi lorsque la fenêtre du navigateur est fermée. On peut voir ensuite que le menu général est divisé en cinq parties (accueil, news, évènements, catalogue et liens) : La partie accueil permet de présenter le magasin : on peut y trouver le plan d accès, les horaires d ouverture, Dans la partie news se trouvent les nouveautés, mais c est aussi à partir d ici que l on peut avoir accès aux archives : seules les dix dernières news sont affichées et les plus anciennes sont stockées et accessibles grâce à la partie «archives». Il suffit d indiquer la date (mois et année ou simplement année) de la news recherchée pour avoir la liste des news correspondant à notre recherche. La partie événement est similaire : tous les évènements qui n ont pas encore eu lieu sont affichés dans un tableau. Pour avoir plus d informations, il suffit de cliquer sur le lien «Info +». Une partie «archives» est aussi disponible et permet de consulter les évènements qui se sont déjà déroulés. C est aussi comme cela que l on pourra avoir accès aux albums photos : un album photos illustre un événement qui s est déjà déroulé en général, et si l album existe, un lien s affiche dans les informations complémentaires et permet d accéder à l album. 19

20 Résultats La partie catalogue correspond à un aperçu des articles disponibles en magasin, classés par catégories. Il est possible d effectuer des réservations en ligne à partir de cet endroit. Les visiteurs peuvent seulement visualiser les articles car, comme on l a vu précédemment, l administrateur préfère vérifier l identité des personnes effectuant une réservation afin d éviter les abus. Les visiteurs n auront donc pas accès au «panier». Donc lorsqu un membre souhaite effectuer une réservation, il a accès à la liste des articles, ainsi que leur détail, mais en plus à un champ «quantité» qui permet d ajouter les articles au panier. Le panier représente l ensemble des articles que le membre souhaite réserver. Une fois qu il a fini de parcourir le catalogue et qu il souhaite valider sa réservation, il lui suffit de cliquer sur le bouton «envoyer la réservation». Ce bouton va en fait déclencher un script : un fichier commande.rtf va regrouper toutes les réservations. Donc lorsque le membre clique, une fonction PHP ouvre le fichier, enregistre la réservation à la fin du fichier, puis referme le fichier. La commande est ensuite enregistrée dans la base de données et le total de la réservation, ainsi que son numéro, sont indiqués au membre (voir annexe pages 41 et 45). La partie lien contient simplement des liens vers différents sites et forums. Pour finir, tout en bas du site se trouvent trois liens : le premier permet d envoyer un message au responsable du site, le second permet de voir la liste des partenaires et le dernier le plan du site. Les administrateurs sont des membres particuliers : ils ont des droits supplémentaires qui leur permettent d avoir accès au lien «administration». C est à partir de cet endroit que l administrateur va pouvoir maintenir le site à jour et y effectuer des modifications. 20

21 Résultats 3.2. Partie administrateur Sous le lien «mon compte», l administrateur a en plus accès au lien «administration» qui le conduit à une partie lui permettant de mettre à jour facilement et rapidement le site : Voici la liste, ainsi qu un descriptif, des opérations possibles depuis cette partie : Dans la partie «Activer les comptes», on peut trouver la liste des comptes membres inactifs (ceux qui viennent de s inscrire sur le site et dont l activation n a pas encore été effectuée par un administrateur). Il suffit de cliquer sur le pseudo du membre pour avoir plus d informations sur son compte, notamment ses coordonnées. Ici, deux choix s offrent à l administrateur : il peut, soit activer le compte, soit refuser l activation. Dans le cas où l administrateur refuse l activation, le pseudo du membre passe dans la liste des comptes dont l activation a été refusée. Si une activation est refusée, l administrateur peut toujours réintégrer le compte dans la liste des comptes non activés ou peut supprimer le compte du membre. Dans ce dernier cas, toutes les informations concernant ce membre sont effacées de la base de données. 21

22 Résultats Ensuite, dans la partie «supprimer un membre», c est la liste des comptes actifs qui s affiche. L administrateur peut, soit supprimer un compte membre, soit le désactiver. Dans le cas où l administrateur désactive un compte membre, on considère que l activation du compte a été refusée (le pseudo passe donc dans la page «Activer les comptes»). Il y a donc trois statuts possibles pour le compte d un membre : actif, inactif et refusé. C est dans la partie «gérer les administrateurs» que les comptes administrateur sont gérés. La liste des administrateurs du site est affichée au début de la page. Il y a ensuite deux formulaires : le premier sert à ajouter un administrateur, en indiquant son pseudo et son mot de passe, et le second permet d en supprimer un, en indiquant son pseudo. Il doit tout de même y avoir au moins un administrateur sur le site. C est à dire que s il ne reste qu un seul compte administrateur, on est obligé d en créer un nouveau avant de le supprimer. La partie «album photos» va permettre de créer des albums photos afin d illustrer des événements. L album est donc obligatoirement lié à un événement et c est le nom de l événement qui va déterminer le nom du dossier qui va contenir la photo. De plus, on peut ajouter des photos ou supprimer un album déjà créé. La partie «gérer les news» permet à l administrateur d ajouter, de modifier ou de supprimer une news. Pour ajouter une news, il suffit d indiquer le titre et le corps de la news. La date de la news est la date du jour (voir annexe page 73, 76 et 78). 22

23 Résultats Ensuite, dans la partie «gérer les évènements», l administrateur peut ajouter un événement, grâce à un formulaire dans lequel il faut indiquer la date, l heure, le type d événement, Il peut aussi supprimer ou modifier un événement. Dans le cas de la modification, le formulaire d événement est déjà pré-rempli avec les informations enregistrées dans la base de données, et il suffit à l administrateur de modifier l information qu il souhaite, puis de valider. Dans la partie «gérer le catalogue, plusieurs possibilités s offrent à l administrateur. Tout d abord, au niveau des catégories, l administrateur peut ajouter, modifier ou supprimer une catégorie. Au niveau des articles, l administrateur peut ajouter un article en remplissant un formulaire. Pour modifier ou supprimer un article, il suffit de choisir la catégorie dans laquelle se situe l article puis de choisir celui que l on désire modifier ou supprimer. Pour finir, la partie «liste des réservations» permet de récupérer la liste des réservations effectuées par les membres. Pour cela, il suffit que l administrateur télécharge le fichier «commande.rtf» et l enregistre sur son ordinateur. Une fois que le fichier est téléchargé, il est réinitialisé, c est-à-dire que la liste des réservations est effacée et que le fichier ne contiendra que le titre de la page, jusqu'à ce qu un membre effectue une nouvelle réservation (voir annexe page 71). 23

24 Discussions 4. Discussions Tout d'abord, l'utilisation des langages PHP et SQL a permis de réaliser un site dynamique et interactif pour les visiteurs. Ainsi, l'utilisateur trouve facilement et rapidement l information qu'il recherche. De plus, le site est facile à mettre à jour : n'importe quelle personne ayant les droits d'accès à la partie administrateur peut effectuer des modifications sur les données et ainsi maintenir à jour les informations du site, sans pour autant avoir des connaissances particulières en informatique. Ensuite, le fait de mettre en ligne, et donc de tester le site Internet, quelques semaines avant la fin du stage m a permis de constater et de régler quelques problèmes, notamment des problèmes d affichage. Par exemple, il a fallu redimensionner les illustrations des articles du catalogue, rajouter des informations, Nous avons ainsi, mes tuteurs et moi-même, eu l occasion de tester le site et j ai pu leur expliquer son fonctionnement, ainsi que celui de la base de données et de PHPMyAdmin. Les visiteurs et les premiers membres inscrits ont, eux aussi, pu tester le site et nous faire part de leurs commentaires. On a ainsi pu constater, par exemple, qu il fallait réduire la qualité et la taille des photos des albums photos, afin que le temps de chargement de la page ne soit pas trop long. Dans le futur, le site pourra être développé davantage au niveau de la gestion des évènements : pour l instant, les événements ne sont pas assez nombreux pour qu il y ait conflit entre leur date de déroulement, mais si, dans quelques temps, ceux-ci s avéraient plus nombreux, il sera intéressant de développer une application capable de gérer le calendrier des évènements. Par exemple, les diverses associations pourraient proposer leurs évènements à la date qu ils désirent, et les membres pourraient indiquer si la date leur convient. Les associations pourraient ainsi vérifier s il n y a pas de conflit de date, mais aussi prévoir l affluence des visiteurs en fonction des réactions des membres. 24

25 Conclusion 5. Conclusion Ce stage de fin d études, effectué au sein de l entreprise «L antre du dragon», m a permis d avoir un aperçu de ce qu est la vie professionnelle, avec toutes les contraintes et les limites imposées dans le travail à accomplir. Ce projet m a beaucoup intéressé, car la réalisation d un site Internet en PHP et SQL m a permis de développer mes connaissances dans ces langages de programmation, qui me serviront plus tard dans ma vie professionnelle, du fait que je souhaite poursuivre mes études dans ce domaine. Le site Internet réalisé répond aux exigences exprimées par ma tutrice, à savoir un site permettant de faire connaître le magasin sur Internet et permettant aux Internautes de prendre connaissance des nouveautés et des événements organisés. De plus, le site est facile à mettre à jour et l administrateur n a pas besoin d avoir des connaissances particulières dans le langage de programmation utilisé pour traiter les informations. 25

26 Références Sites Internet : Le site de PHP débutant disponible sur : Le site du ZéRo disponible sur : Le manuel PHP disponible sur : Le site et le forum de developpez.com disponible sur : Imprimé : PHP pour les débutants : compétences micro - initiation 26

27 6.2. techniques Dossier d analyse UML Diagramme de cas d utilisation 27

28 Diagramme de classes Diagramme d états transitions 28

29 Diagrammes de séquences (dans le cas où l opération effectuée se déroule comme prévu) S inscrire Code oublié Se connecter 29

30 Gérer son compte 30

31 Effectuer une réservation Gérer les comptes membres 31

32 Gérer les administrateurs Gérer les albums photos 32

33 Gérer les news Gérer les événements 33

34 Récupérer la liste des réservations 34

35 Dossier de programmation Fichier antre.php : // Démarrage d'une session utilisateur session_start(); // Appel de la page fonction pour utiliser les include() include("fonction/fonction.php"); <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" <head> <title>l'antre du Dragon</title> <meta http-equiv="content-type" content="text/html; charset=iso " /> <META NAME="description" CONTENT="L'antre du dragon"> <META NAME="keywords" CONTENT="warhammer, figurine, warhammer 40000, seigneur des anneaux, antre, dragon"> <!-- Appel de la feuille de style --> <link rel="stylesheet" href="style.css" type="text/css" /> </head> <body> <!-- Partie contenant l'intégralité du site--> <div id="global"> <!-- Partie contenant le logo --> <div id="logo"> </div> <!-- Partie contenant la bannière --> <div id="entete"> </div> <!-- Partie contenant le menu général --> <div id="menuge"> <!-- Champs du moteur de recherche interne du site --> <table class="cadre"> <tr valign="top"> <form action="antre.php?page=moteur" method="post"> <td class="cadre"></td><td width="175" class="cadre"> Recherche : <input type="text" name="recherche" size="10" /></td> <td width="50" class="cadre"><input type="image" src="images/bouton2.gif" /></td> </form> 35

36 <!-- Images du menu général --> <td class="cadre"><a href="antre.php?page=accueil"><img src="images/blanc4.gif" /></a></td> <td width="15" class="cadre"></td><td class="cadre"><a href="antre.php?page=news"><img src="images/blanc4.gif" /></a></td> <td width="15" class="cadre"></td><td class="cadre"><a href="antre.php?page=evenements"><img src="images/blanc4.gif" /></a></td> <td width="15" class="cadre"></td><td class="cadre"><a href="antre.php?page=categorie"><img src="images/blanc4.gif" /></a></td> <td width="15" class="cadre"></td><td class="cadre"><a href="antre.php?page=liens"><img src="images/blanc4.gif" /></a></td> </tr> </table> </div> <!-- Partie contenant le menu détaillé --> <div id="menu"> // Vérification de la personne connectée (ses droits et son pseudo) if(isset($_session['droit'])) $droit = $_SESSION['droit']; else $droit = 0; if(isset($_session['pseudo'])) $pseudo = $_SESSION['pseudo']; else $pseudo = ''; // Si le droit est différent de 0, c'est un membre ou un admin connecté, donc affichage du pseudo if ($droit!=0) <table class="cadre"> <tr><td class="cadre"></td> <td class="cadre">vous êtes connecté en tant</td></tr> <tr><td class="cadre"></td> <td class="cadre">que <font color="#ccccff"> echo $pseudo; </font><br /><br /></td></tr> <tr><td class="cadre"></td> <td class="cadre"><font size="-1"><a href="antre.php?page=compte"><u>mon compte</u></a></font></td></tr> // Si le droit est égale à 2, c'est un administrateur if ($droit==2) <tr><td class="cadre"></td> <td class="cadre"><font size="-1"><a href="antre.php?page=admin"><u>administration</u></a></font></td></tr> <tr><td class="cadre"></td> 36

37 <td class="cadre"><font size="-1"><a href="antre.php?page=logout"><u>déconnexion</u></a></font><br /><br /></td></tr> </table> // Si le droit est égale à 0, c'est un utilisateur non connecté donc affichage des champs de connection if ($droit==0) <table class="cadre"> <form method="post" action="antre.php?page=login"> <tr><td height="5" class="cadre"></td></tr> <tr> <td class="cadre" width="5"></td> <td class="cadre" height="10">login : </td><td class="cadre" colspan="3"><input type="text" name="login" size="10" /></td> </tr><tr> <td class="cadre" width="5"></td> <td class="cadre" valign="top">code : </td><td class="cadre"><input type="password" name="mdp" size="10" /></td> <td class="cadre" width="5"></td> <td class="cadre"> $position=$_get['page']; <input type="hidden" name="position" value=" echo $position; " /> <input type="image" src="images/boutonok2.gif" /></td> </tr> </form> </table> <table class="cadre"> <tr><td class="cadre" width="5"></td> <td class="cadre"><a href="antre.php?page=inscription"><font size="-1"><u>s'inscrire</u></font></a></td> </tr> <tr><td class="cadre" width="5"></td> <td class="cadre"><a href="antre.php?page=oubliemdp"><font size="-1"><u>code oublié?</u></font></a></td> </tr> </table> <br /> // Menu détaillé correspondant au menu génnéral sélectionné include($menu); </div> 37

38 </div> </body> </html> <!-- Partie contenant l'information --> <div id="contenu"> <table class="cadre"> <tr><td colspan="2" height="10" class="cadre"></td></tr> <tr><td height="10" width="10" class="cadre"></td> <td width="747" class="cadre"> // Page contenant l'information include($page); </td> </tr> </table> </div> <!-- Partie contenant le pied de page --> <div id="siteinfo"> <center> <table class="cadre"> <tr> <td class="cadre" height="15"></td> </tr> </table> <a href="antre.php?page=contact">contact</a> <a href="antre.php?page=partenariat">partenariat</a> <a href="antre.php?page=plansite">plan du site</a><br /> L'antre du dragon </center> </div> 38

39 Fichier login.php : // Appel de la page fonction pour utiliser la connexion et la deconnexion à la base de données require('./fonction/fonctionsutiles.php'); // On part du principe que le login est faux. Il passe à vrai si le login est confirmé $loginok = false; // Test pour vérifié que tous les champs sont remplis if ( isset($_post) && (!empty($_post['login'])) && (!empty($_post['mdp'])) ) extract($_post); // Decryptage du mot de passe $mdp = md5($mdp); require('./fonction/requete.php'); // Connexion à la base de données connexion(); // On va chercher le mot de passe afférent à ce login $req = mysql_query($requete10) or die('erreur SQL : <br />'.$requete10); // On vérifie que l'utilisateur existe bien if (mysql_num_rows($req) > 0) $data = mysql_fetch_assoc($req); // On vérifie que son mot de passe est correct if ($mdp == $data['mdp']) $loginok = true; // Deconnexion de la base de données deconnexion(); // Si le login a été validé on met les données en sessions if ($loginok) // On récupère le pseudo et les droits $_SESSION['pseudo'] = $data['pseudo']; $_SESSION['droit'] = $data['droit']; 39

40 session else // On récupère la page sur laquelle se trouve l'utilisateur avant sa connection if (isset ($_POST['position'])) $position=$_post['position']; else $position=''; // On le redirige vers la même page mais avec les informations concernant sa echo '<script>window.location.replace("antre.php?page='.$position.'");</script>'; // Si javascript est désactivé sur le navigateur de l'utilisateur : <noscript> Vous êtes maintenant connecté. <form action="antre.php?page= echo $position; " method="post"> <input type="submit" value="continuer" /> </form> </noscript> // Mauvais mot de passe ou champs non remplis echo '<center><h1>connexion</h1></center>'; echo 'Une erreur est survenue. <br />Veuillez réessayer ou en cas de problèmes, contacter un administrateur.'; $redir="antre.php?page=accueil"; redirection($redir); <noscript> <form action="antre.php?page=accueil" method="post"> <input type="submit" value="terminer" /> </form> </noscript> 40

41 Fichier logout.php : // On écrase le tableau de session $_SESSION = array(); // On détruit la session session_destroy(); <!-- Redirection vers la page d'accueil --> <script>window.location.replace("antre.php?page=accueil"); </script> <!-- Si javascript est désactivé --> <noscript> Vous êtes maintenant déconnecté. <form action="antre.php?page=accueil" method="post"> <input type="submit" value="continuer" /> </form> </noscript> Fichier panier.php : <center><h1>votre panier</h1></center> // Récupération du pseudo if(isset($_session['pseudo'])) $pseudo = $_SESSION['pseudo']; else $pseudo = ''; if(isset($_session['droit'])) $droit = $_SESSION['droit']; else $droit = 0; // Si le droit est égale à 2, c'est un administrateur, donc autorisation d'afficher la page if ($droit!=0) // Récupération de la date $date = date("d-m-y"); // Connexion à la base connexion(); $part=2; require('./fonction/requete.php'); // Envoie de la requete $result=mysql_query($requete20) or die('erreur SQL!<br>'.$requete20.'<br>'.mysql_error()); // Récupération des données $membre = mysql_fetch_array($result); $nummembre =$membre['num']; $part=0; require('./fonction/requete.php'); 41

42 // Envoie de la requete $result= mysql_query($requete21) or die('erreur SQL!<br>'.$requete21.'<br>'.mysql_error()); // Calcul du nombre total de résultat $total = mysql_num_rows($result); if ($total==0) // On recupère l'id du tableau pour la suppression de l'élément if(isset($_get['id'])) $id=$_get['id']; else $id=""; // Suppression de l'article de la session if ($id!="") // Récupération du panier $panier=$_session['panier']; $ref=$panier[0]; $quant=$panier[1]; // Tableaux temporaires $temp1=array(); $temp2=array(); $n=0; // On parcours le panier for ($i=0;$i<sizeof($ref);$i++) // Si l'indice est différent de l'id de l'article à supprimer if ($i!=$id) // On copie dans un autre tableau $temp1[$n]=$ref[$i]; $temp2[$n]=$quant[$i]; $n+=1; $panier=array($temp1,$temp2); //Nouveau panier $_SESSION['panier']= $panier; // Mise en session de ce panier // calcul du nombre de produits dans le panier $nbarticle=0; $panier=$_session['panier']; $ref=$panier[0]; $quant=$panier[1]; 42

43 // On affiche le panier for ($i=0;$i<sizeof($ref);$i++) $nbarticle += $quant[$i]; echo "<u>nombre d'articles</u> : ".$nbarticle."<br /><br />"; $total=0.0; <center> <table class="cadre"> <tr> <td valign="top" class="cadre" width="180"><b><center>référence</center></b></td> <td valign="top" class="cadre" width="220"><b><center>désignation</center></b></td> <td valign="top" class="cadre" width="100"><b><center>quantité</center></b></td> <td valign="top" class="cadre" width="80"><b><center>prix</center><br /></b></td> </tr> // Connexion à la base connexion(); for ($i=0;$i<sizeof($ref);$i++) // tanqu'il y a des produits dans le panier faire : $part=1; require('./fonction/requete.php'); //On envoie la requête $result= mysql_query($requete22) or die('erreur SQL!<br>'.$requete22.'<br>'.mysql_error()); // On récupere le numero de la categorie $article = mysql_fetch_array($result); $designation=$article['designation']; $prix=$article['prix']; <tr> <td class="cadre"><center> echo $ref[$i]; </center></td> <td class="cadre"><center> echo $designation; </center></td> <td class="cadre"><center> echo $quant[$i]; </center></td> <td class="cadre"><center> echo $prix; </center></td> <td class="cadre"><center><a href="antre.php?page=panier&id= echo $i; " class="style2">supprimer</a></center></td></tr> 43

44 else $total+=$prix*$quant[$i]; </table> </center> <br /><br /> echo '<b>total de la réservation : </b>'.$total.' euros'; if ($nbarticle!=0) <center> <form action="antre.php?page=commande" method="post"> <input type="hidden" name="total" value=" echo $total; " /> <input type="submit" value="envoyer la réservation" /> </form> </center> echo "Vous avez déjà effectué une réservation aujourd'hui.<br />Vous pouvez faire une réservation par membre et par jour."; // Sinon ce n'est pas un administrateur, donc interdiction d'accéder à cette page else echo'vous n\'êtes pas connecté.'; 44