Réécriture d'URL

Dans : Chroniques

Je découvre avec la gestion des modes de vues (complète ou partielle) des modules TODD, le concept d'"URL propres" (Clean URLs) ou de la "Réécriture d'URL" (URL Rewriting).

Le principe de la réécriture d'URL

Le serveur web (Apache) possède un module appelé mod_rewrite. On fournit un fichier .htaccess qui agit comme un "traducteur" caché entre le navigateur et un fichier PHP.

Actuellement, voici comment un serveur lit la règle ^([0-9]+)/?$ index.php?id=$1 :

  • Navigateur : Je veux voir la page todd_view/25
  • .htaccess : Je vois des chiffres (25). Je les capture dans une variable $1. En cachette, je lance le vrai fichier index.php?id=25.
  • PHP : Il lit $_GET['id'] et trouve 25.

Pour répondre à certaines exigences qui demande de livrer à un utilisateur le minimum d'information sur les paramètres derrière une vue, nous allons modifier ce traducteur pour qu'il soit capable de capturer un deuxième groupe de chiffres (le mode 1 ou 2) et de l'envoyer à PHP sous forme de variable $_GET['mode_id'].

Voici les 4 étapes pour implémenter cette architecture.

Étape 1 : Mettre à jour le .htaccess

Dans le fichier .htaccess situé dans le dossier todd_view de l'arborescence, nous remplaçons la règle actuelle par celle-ci :

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    # NOUVEAU : Capture l'ID ($1) et de façon optionnelle le Mode ($2)
    RewriteRule ^([0-9]+)(?:/([0-9]+))?/?$ index.php?id=$1&mode_id=$2 [L,QSA]
</IfModule>

(Explication technique de l'expression régulière : Le (?:/([0-9]+))? indique que le slash et le deuxième chiffre sont optionnels. Ainsi, todd_view/25 continuera de fonctionner par défaut sans générer d'erreur 404).

Étape 2 : Le contrôleur principal index.php

Dans le fichier index.php qui intercepte cette URL (celui dans le dossier todd_view ). Nous allons lire ce nouveau paramètre mode_id et le traduire en mots compréhensibles pour nos modules (complete ou partial).

Juste avant l'inclusion de $viewFile, nous ajoutons cette logique :

$module_code = $content['module_code'];
$payload = json_decode($content['payload_json'], true);
if (!is_array($payload)) {
    $payload = [];
}

// --- NOUVEAU : Traduction de l'URL vers le moteur TODD ---
// Si l'URL contient /2, c'est partiel. Sinon (vide ou /1), c'est complet.
$mode_id = isset($_GET['mode_id']) ? intval($_GET['mode_id']) : 1;
$render_mode = ($mode_id === 2) ? 'partial' : 'complete';
// ---------------------------------------------------------

$viewFile = BASE_PATH . "plugins/todd/modules/" . $module_code . "/view.php";
if (!file_exists($viewFile)) {
    die("Vue manquante pour le module " . htmlspecialchars($module_code) . ".");
}

Étape 3 : Le fichier view.php du module

Puisque index.php inclut view.php directement, la variable $render_mode que nous venons de créer est automatiquement disponible.

Dans le fichier view.php d'un module, par exemple ToddEvent (plugins/todd/modules/todd_event/view.php), nous remplaçons la récupération de l'ancien $_GET['mode'] par notre nouvelle variable globale :

if ($moduleInstance) {
    // NOUVEAU : On utilise la variable traduite par l'index principal (fallback sur complete)
    $mode = isset($render_mode) ? $render_mode : 'complete';

    global $module_head_content;
    $module_head_content = '
        <link rel="stylesheet" href="' . BASE_URL . 'plugins/todd/modules/todd_event/assets/css/public.css">
        <script src="' . BASE_URL . 'plugins/todd/modules/todd_event/assets/js/client.js"></script>
    ';
    
    // On passe le mode traduit (complete/partial) au moteur TODD
    $moduleInstance->display($mode);
}

Étape 4 : Mettre à jour le JavaScript du Dashboard

Enfin, nous devons changer la façon dont ton tableau de bord construit les liens dans le sous-menu Aperçu afin de donner la possibilité au créateur de contenu de voir les différents mode d'affichage de son contenu.

Dans plugins/todd/assets/js/pages/todd_dashboard_contents.js, nous modifions la création des deux variables publicLink :

// 1. Création des deux liens propres avec URL Rewriting
var publicLinkComplete = baseUrl + 'todd_view/' + row.id + '/1';
var publicLinkPartial = baseUrl + 'todd_view/' + row.id + '/2';

var $tpl = $($('#tpl_todd_content_actions').html());

$tpl.find('.edit-content, .submit-content, .approve-content, .reject-content, .archive-content, .delete-content').attr('data-id', row.id);

// 2. UTILISATION DES VARIABLES : On les injecte dans les nouveaux boutons du sous-menu
$tpl.find('.btn-view-public-complete').attr('href', publicLinkComplete);
$tpl.find('.btn-view-public-partial').attr('href', publicLinkPartial);

// 3. UTILISATION (Suite) : On assigne le lien complet au bouton "Copier le lien"
$tpl.find('.btn-copy-public-link').attr('data-link', publicLinkComplete);

// Visibilité du bouton copier le lien
if (row.status !== 'approved') {
	$tpl.find('.btn-copy-public-link').remove();
}

// Visibilité du Sous-Menu "Aperçu" complet
if (row.status == 'approved' || (row.status == 'draft' && canEdit)) {
	if (row.status == 'draft') $tpl.find('.view-label').text('Aperçu (Public)');
} else {
	// On supprime le sous-menu s'il n'a pas lieu d'être affiché
	$tpl.find('.dropdown-submenu-view, .divider-view').remove();
}

Avec cela, les boîtiers physiques recevront des URL propres, et la logique interne de ton framework reste orientée objet.