août 07 2010

[ASP.NET 4] Optimisation du référencement partie 3 : Routage d’URL

Category: ASP.NET | ASP.NET 4Nicolas Esprit @ 15:30

 Suite de la série de billets sur la Search Engine Optimization avec ASP.NET 4.0 et IIS 7 :

Dans ce chapitre nous allons tout d'abord voir un exemple concret du routage d'URL en ASP.NET 4.0. Le routage n'est pas à une nouveauté de la version 4.0 du Framework, il était déjà présent dans le SP1 du Framework 3.5. Cependant, le support est désormais natif et l'utilisation bien plus aisée.

Notez que nous parlons ici des applications Web Forms. Pour les applications ASP.NET MVC, vous pouvez consulter cette série d'articles traduits du site officiel ASP.NET. Globalement, en MVC, le format des URL est plutôt comme ceci : http://{Sitename}/{View}/{Action}/{options}.

Exemple de routage d'URL

Fixons-nous dans un premier temps un objectif et voyons comment il est possible de l'atteindre. Dans une application Web, nous avons deux pages : Achats.aspx et Ventes.aspx. Ces pages affichent respectivement les achats et les ventes d'un produit. Ceux-ci peuvent être affichés par année et par produit.

Actuellement, les informations concernant l'année et le type de produit sont passées à la page via des paramètres d'URL, ou des Query Strings. Par exemple, avec la page Achats.aspx nous pouvons consulter les achats de voitures en 2009, avec la page Ventes.aspx nous pouvons consulter les ventes de motos en 2010. Les voitures, ayant dans notre table TypeProduit l'id 3 et les motos l'id 5, nous utilisons donc respectivement les URL :

  • http://NomDuSite/Achats.aspx?Annee=2009&IdTypeProduit=3
  • http://NomDuSite/Ventes.aspx?Annee=2010&IdTypeProduit=5

Seulement, ces URL ne sont pas User-Friendly. Nous souhaiterions plutôt avoir des URL de la forme :

  • http://NomDuSite/Achats/2009/Voiture
  • http://NomDuSite/Ventes/2010/Moto

Commençons d'abord par le plus simple : utiliser une URL du type "http://NomDuSite/Achats/Année". Pour ce faire, il nous faut définir une route dans la table de routage de l'application. Cette définition se fait généralement dans l'évènement Application_Start du fichier Global.asax : using System.Web.Routing :

void RegisterRoutes(RouteCollection routes)
{
routes.MapPageRoute("VentesParAnnee",
"Ventes/{year}",
"~/Ventes.aspx");
}

protected void Application_Start(object sender, EventArgs e)
{
RegisterRoutes(RouteTable.Routes);
}

Comme vous pouvez le voir dans le bout de code ci-dessus, nous utilisons pour cela la collection statique Routes de la table de routage RouteTable. À cette collection, nous ajoutons une nouvelle route grâce à la méthode MapPageRoute. Nous utilisons trois paramètres qui sont :

  • routeName : chaîne de caractères représentant le nom de la route ;
  • routeUrl : chaîne de caractères représentant le format de l'URL pour la route ;
  • physicalFile : chaîne de caractères représentant l'URL physique de la route.

Notez que la méthode MapPageRoute est surchargée et qu'il est possible de renseigner les différents paramètres suivants :

  • checkPhysicalUrlAccess : booléen indiquant si ASP.NET doit valider que l'utilisateur a le droit d'accéder à l'URL physique de la route. Ce paramètre définit la propriété PageRouteHandler.CheckPhysicalUrlAccess ;
  • defaults : RouteValueDictionary contenant les valeurs par défaut pour les paramètres de la route ;
  • constraints : RouteValueDictionary contenant les règles ou contraintes qu'une requête pour une URL doit satisfaire pour être traitée comme la route qu'on définit ;
  • dataTokens : RouteValueDictionary contenant les valeurs associées à la route qui ne sont pas utilisées pour déterminer si une route correspond à un format d'URL.

Pour tester notre routage et les autres exemples du présent chapitre, nous allons créer une Web Application ASP.NET 4.0. Nous ajoutons ensuite la page Ventes dont le code est le suivant :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace RoutageExemple
{
public partial class Ventes : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
YearLiteral.Text = Page.RouteData.Values["year"].ToString();
}
}
}
<%@ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Site.master" 
CodeBehind="Ventes.aspx.cs" Inherits="RoutageExemple.Ventes" %>


<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<h2>
Ventes pour l'année : <asp:Literal ID="YearLiteral" runat="server" />
</h2>
</asp:Content>

Ainsi, en ajoutant le lien suivant à la page Default.aspx :


<asp:HyperLink ID="HLink1" runat="server" NavigateUrl="~/Ventes/2010">Ventes pour l'année 2010</asp:HyperLink>

le routage va bien prendre en compte notre demande "http://NomDuSite/Ventes/2010/", pour afficher la page Ventes.aspx. Notez l'utilisation de Page.RouteData dans le code-behind de la page Ventes.aspx, c'est une nouveauté apparue avec ASP.NET 4.0 et qui correspond en fait à HttpRequest.RequestContext.RouteData. RouteData permet d'obtenir dans notre page les informations contenues dans la route. Dans notre exemple, il s'agit de récupérer l'année des ventes.

Une autre nouveauté apparue avec la version 4.0 du Framework, nommée RouteValue expression, permet également d'accéder dans la page aux informations contenues dans la route. La différence avec Page.RouteData est que cette expression peut être utilisée dans le markup de la page. Ainsi pour obtenir le même résultat qu'avec Page.RouteData, nous aurions pu utiliser ce code dans la page Ventes.aspx :

Ventes pour l'année :  <asp:Literal ID="YearLiteral" runat="server" Text="<%$RouteValue:year%>"/>

Il est également possible de faire l'inverse. C'est-à-dire utiliser la table de routage pour déduire l'URL de la page routée. Notre lien vers les ventes 2010 dans la page Default.aspx aurait très bien pu être construit comme ceci :

<asp:HyperLink ID="HLink2" runat="server" NavigateUrl="<%$RouteUrl:RouteName=VentesParAnnee,year=2010%>">Ventes pour l'année 2010</asp:HyperLink>

Voici deux autres nouveautés qui vous seront utiles : RedirectToRoute et GetRouteUrl. Pour rediriger vers une page routée, par exemple vers les ventes de l'année 2009, nous pouvons utiliser la méthode RedirectToRoute comme ceci :

Response.RedirectToRoute("VentesParAnnee", new { year = 2009 });

Le premier paramètre indique le nom de la route et le second contient la collection de paramètres pour cette route. Notez qu'il existe plusieurs surcharges de cette méthode. Vous pouvez utiliser également GetRouteUrl afin d'obtenir une URL mappée dans une page. Ainsi, l'appel ci-dessous nous renverra la chaîne "/Ventes/2009" :

Page.GetRouteUrl("VentesParAnnee", new { year = 2009 });

 

Utilisation des contraintes de routage

Revenons maintenant à notre exemple de départ, à savoir afficher les ventes pour une année et un type de produit précis, comme les ventes de motos de l'année 2010. Nous allons, en plus du type de produit, ajouter deux contraintes. La première pour le paramètre year : celui-ci doit être composé de quatre chiffres et aura par défaut l'année courante comme valeur. Pour le second paramètre : celui-ci sera uniquement composé de lettres et se verra assigner la valeur "Voiture" s'il n'est pas renseigné. Pour ce faire nous utilisons les paramètres defaults et contraints de la méthode MapPageRoute, qui correspondent à des RouteValueDictionary. Les contraintes nous offrent la possibilité d'utiliser des expressions régulières, ce qui est très pratique. Dans le Global.asx nous enregistrons une nouvelle route :

void RegisterRoutes(RouteCollection routes)
{
routes.MapPageRoute("VentesParAnneeEtProduit",
"Ventes/{year}/{product}",
"~/Ventes.aspx", true,
new RouteValueDictionary {
{ "year", DateTime.Now.Year.ToString() },
{ "product", "Voiture" }, },
new RouteValueDictionary {
{ "year", @"\d{4}" },
{ "product", @"[A-Za-z]+" } });
}

Dans la page Default.aspx, nous allons ajouter ces différentes liens :

<asp:HyperLink ID="HLink1" runat="server" 
NavigateUrl="<%$RouteUrl:RouteName=VentesParAnneeEtProduit,year=2010,product=Moto%>">
Ventes de motos pour l'année 2010
</asp:HyperLink>
<br />
<asp:HyperLink ID="HLink2" runat="server"
NavigateUrl="<%$RouteUrl:RouteName=VentesParAnneeEtProduit,year=2010,product=123%>">
Ventes de 123 pour l'année 2010
</asp:HyperLink>
<br />
<asp:HyperLink ID="HLink3" runat="server"
NavigateUrl="<%$RouteUrl:RouteName=VentesParAnneeEtProduit,year=2010%>">
Ventes pour l'année 2010
</asp:HyperLink>
<br />
<asp:HyperLink ID="HLink4" runat="server"
NavigateUrl="<%$RouteUrl:RouteName=VentesParAnneeEtProduit,product=Moto%>">
Ventes de motos
</asp:HyperLink>
<br />
<asp:HyperLink ID="HLink5" runat="server"
NavigateUrl="<%$RouteUrl:RouteName=VentesParAnneeEtProduit,year=910,product=Voiture%>">
Ventes de voitures pour l'année 910
</asp:HyperLink>

Voici ce que nous obtenons dans le navigateur :

Vous remarquez que certains liens ne sont en fait que du texte. Que s'est-il passé au juste ?

  • year=2010 et product=Moto : le lien est correctement affiché ;
  • year=2010 et product=123 : ne s'affiche pas. Le paramètre product ne répond pas à la contrainte, à savoir être constitué uniquement de lettres ;
  • year=2010 : s'affiche correctement. Cependant, il correspond à "http://NomDuSite/Ventes". Si nous suivons ce lien, on s'aperçoit que lors du routage la valeur "Voiture" est ajoutée par défaut au paramètre type de produit ;
  • product=Moto : s'affiche correctement, l'année 2010 est utilisée par défaut pour le paramètre year ;
  • year=2010 et product=Voiture : ne s'affiche pas. Le paramètre year n'est pas composé de trois chiffres.

C'est la fin de cette série d'article sur la Search Engine Optimization avec ASP.NET 4.0 et IIS 7.0.

Tags: , , , , , ,

Les commentaires sont clos