Bien débuter avec le Framework Silex – Première route

03 décembre 2017 - : MVC Silex - : Pas de commentaire

Bien débuter avec le Framework Silex – Première route

Cet article fait suite à l’article Bien débuter avec le Framework Silex – Généralités – Installation et va apporter les premières précisions sur le fonctionnement du Framework Silex.

Nous allons ci-dessous créer notre page d’accueil et notre première route.

Pré-requis : le .htaccess

Afin de faire fonctionner les routes utilisées par le framework Silex, nous allons utiliser le module de réécriture d’URL de notre serveur Apache.

Le code à insérer dans ce fichier .htaccess est le suivant :

<IfModule mod_rewrite.c>
    Options -MultiViews

    RewriteEngine On
    #RewriteBase /monprojet/web/
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [QSA,L]
</IfModule>

Attention, le fichier doit se trouver dans le dossier /web.

Mais que font ces différentes lignes ?

  • IfModule mod_rewrite.c : Vérifie si le module de réécriture existe
  • Options -MultiViews : désactive la négociation de contenu (qui permettrait, si activée, d’accéder à un fichier « fichier.html » en tapant http://monsite.fr/fichier
  • RewriteEngine On : Active le module de réécriture d’URL
  • RewriteBase : Indique où commence la réécriture d’URL (ici cette ligne est commentée. Elle pourrait être nécessaire chez certains hébergeurs)
  • RewriteCond : Décrit une condition qui, si elle est vérifiée, activera la RewriteRule qui suit
    • %{REQUEST_FILENAME} représente le chemin complet du fichier ou dossier qui est accédé
    • !-d : n’est pas un dossier
    • !-f : n’est pas un fichier
    • Nos conditions vérifient qu’on n’essaie d’accéder ni à un dossier, ni à un fichier. Nous réécrirons donc les URLs uniquement pour des dossiers virtuels (routes)
  • RewriteRule : Règle de réécriture de l’URL si les conditions sont vérifiées
    • Suit la syntaxe RewriteRule URL_a_réécrire URL_réécrite [drapeau]
    • ^ : Signifie que nous réécrirons toutes les URLs
    • index.php : toutes les URLs réécrites seront index.php
    • [QSA,L] : QSA nous permet de conserver tous les paramètres de l’URL (en cas de Query String par exemple) et L permet de stopper la réécriture après cette ligne (si d’autres RewriteCond et RewriteRule étaient présentes ensuite, elles ne seraient pas exécutées)

Première route

Avec Silex, nous pouvons écrire les routes et appeler le contrôleur correspondant grâce à une fonction anonyme.

Nous verrons régulièrement une variable PHP $app dans de nombreux fichiers. Cette variable contient l’instance de l’application et permet de faire fonctionner Silex.

Le contrôleur

Regardons le contenu de controllers.php (dans le dossier src), et principalement

$app->get('/', function () use ($app) {
    return $app['twig']->render('index.html.twig', array());
})
->bind('homepage')
;

Ces lignes permettent de créer la page d’accueil. Il s’agit de la route « / » et du contrôleur de cette page, à l’intérieur de la fonction.

La méthode de cette page est get, ce qui permet d’y accéder en affichage simple. Si la méthode avait été post, nous n’aurions pu accéder au contrôleur qu’à la condition d’avoir transmis des données en méthode post. Nous y reviendrons un peu plus tard.

Décryptons ce fonctionnement :

  • $app->get() : nous accédons à cette route en méthode get
  • ‘/’ : chemin correspondant à notre route, http://monsite.fr/ (ou http://localhost/monprojet/web en local)
  • function () use ($app) { } : Fonction anonyme du contrôleur
  • ->bind(‘homepage’) : attribue le nom homepage à la route / pour y faire référence dans les vues par exemple

Dans notre exemple, le contrôleur effectue une unique chose, charger la vue de la page d’accueil.

ATTENTION : il est important de conserver en tête que la dernière instruction exécutée par un contrôleur DOIT être un return.

  • $app[‘twig’] : indique au contrôleur qu’il doit utiliser le moteur de templates Twig (composant de Silex)
  • ->render() : fonction effectuant le rendu de la vue. Elle prend 2 paramètres
    • ‘index.html.twig’ : nom du fichier de la vue. Doit se trouver dans le dossier templates.
    • array() : array contenant les données à passer à la vue

La vue

Notre contrôleur affiche la vue ‘index.html.twig’ située dans le dossier templates.

{% extends "layout.html.twig" %}

{% block content %}
    Welcome to your new Silex Application!
{% endblock %}

La syntaxe de ce fichier peut paraître déroutante à priori mais elle est relativement simple à appréhender.

  • {% extends « layout.html.twig » %} : nous appelons le fichier de thème principal dans lequel le contenu de notre fichier va être injecté
  • {% block content %} : nous créons un bloc de contenu qui sera injecté dans le fichier appelé dans le « extends »

Allons regarder le contenu de « layout.html.twig »

<!DOCTYPE html>
<html>
    <head>
        <title>{% block title '' %} - My Silex Application</title>

        <link href="{{ asset('css/main.css') }}" rel="stylesheet" type="text/css" />

        <script type="text/javascript">
            var _gaq = _gaq || [];
            _gaq.push(['_setAccount', 'UA-XXXXXXXX-X']);
            _gaq.push(['_trackPageview']);

            (function() {
                var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
                ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
            })();
        </script>
    </head>
    <body>
        {% block content %}{% endblock %}
    </body>
</html>

Ce fichier contient le code html d’une page complète, du doctype à la balise /html.

Nous avons surtout 2 emplacements réservés qui peuvent être remplacés « dynamiquement » :

  • {% block title %} : nous pourrons « injecter » ici le titre de notre page
  • {% block content %}{% endblock %} : ce bloc sera remplacé par le contenu de index.html.twig dans l’exemple qui nous intéresse.

Nous avons donc maintenant une meilleure compréhension de la mise en place d’une route et d’un contrôleur, et de l’affichage de la vue correspondante.

Cet article est le 2ème d’une série permettant d’apprendre pas à pas l’utilisation de Silex.

L’article suivant explique l’accès à la base de données

Commentaires

Ecrire un commentaire

Pas encore de commentaire

Laisser un commentaire