lundi 14 novembre 2016

Ajouter un bandeau permanent sous IIS 7

Pour identifier un serveur de test qui se comporte à l'identique d'un serveur de production, j'ai souhaité faire apparaître un bandeau permanent à l'affichage.



Sous IIS 7 je n'ai pas trouvé de fonctionnalité native qui permettant d'obtenir ce résultat, mais un moyen détourné le permet.


Dans le gestionnaire des services Internet (IIS), à la page d'accueil de la racine du serveur, dans le groupe IIS, si vous n'avez pas le module URL Rewrite (cf capture suivante), rendez vous sur le site IIS pour l'installer :  https://www.iis.net/downloads/microsoft/url-rewrite


Sa fonction première est de créer des règles agissant sur les URL demandées (url courtes, amélioration référencement, etc...) mais pas seulement ! Il permet également de définir des règles en sorties sur les headers ou le contenu de la réponse, et ce que nous allons utiliser.

(je vais me contenter d'une traduction de l'article d'origine qui est très bien fait)


Dans le panneau d'action sur le côté droit, cliquer sur "Add Rules..." et sélectionner "Blank rule" dans la catégorie "Outbound rules" puis "Ok".












Il faut donc définir cette nouvelle règle en sortie. Dans l'URL Rewrite Module 2.0, elle se définit par plusieurs critères :
  • Le nom de la règle
    Ce nom est un identifiant unique libre pour la règle, par exemple : "Ajout bandeau permanent".
  • Une précondition optionnelle qui défini quand la règle doit s'appliquer à la réponse.
    Dans notre cas, on veut modifier le rendu HTML des demandes faites au serveur (et non les images, pdf, etc...) donc on peut se limiter à toutes les réponses HTTP avec un content-type du header vaut "text/html". Ces règles en sorties sont très gourmandes en CPU et peuvent potentiellement nuire aux performances du serveur, il faut donc cibler au plus précis où agir grâce à ces préconditions.

    Pour la créer, sélectionner dans la liste déroulante
     Precondition, l'élément "<Create New Pre-condition...>". Cela ouvre l'éditeur de pré-conditions où on peut définir les infos suivantes : 
    • Name: "IsHTML"
    • Using: "Regular Expressions"
    • Faire "Add" pour ouvrir la fenêtre "Add condition" et définir les infos suivantes :
      • Condition input: "{RESPONSE_CONTENT_TYPE}"
      • Check if input string: "Matches the pattern"
      • Pattern: "^text/html"
    On obtient donc l'écran suivant, à valider en faisant OK.
  • Définir la zone de recherche et le pattern à utiliser pour rechercher le texte
    Les règles de rewrite en sortie peuvent agir sur le contenu du header HTTP ou celui du corps de la réponse. Dans notre cas, on agit sur le contenu du corps, il faut donc définir le "Matching Scope" sur "Response".

    Notre astuce consiste à ajouter du contenu HTML à la réponse, pour cela nous allons donc remplacer la balise de fin par notre contenu à insérer suivi de la balise de fin.

    Dans la liste déroulante "Content", on va préciser "Matches the Pattern", et dans "Using:", on sélectionne "Exact match" pour notre code HTML précis.

    On saisit dans “Pattern” le texte de la balise recherchée : </body>
  • Un ensemble de conditions optionnelles
    Aucune dans notre cas, on souhaite que cela s'applique tout le temps.
  • L'action à réaliser si le pattern est trouvé et toutes les conditions sont satisfaites
    Choisir “Rewrite” dans la liste "Action type".
    Et saisir dans "Value", la valeur de remplassement souhaitée.

    Pour mon exemple, j'ai créé une box que je positionne en haut à gauche de la fenêtre, en statique, avec un fond rouge, en travers et avec le texte Serveur de test !! . Ce qui donne le code suivant :

    <div style="position: absolute; top: 45px; left: -70px; width: 250px; margin: 0px; padding: 6px; background-color: darkorange; border: 5px solid red; color: #f0f0f0; font: 18px Arial; transform:rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); text-align: center;"><span style="margin: auto; padding-left: 20px; background: url(/ffv/images/famfamfam/icons/error.png) no-repeat center left">Serveur de test !!</span></div></body>


Sources : 
Ce tip m'est venu en faisant un parallèle entre cette insertion de bandeau et ce qui doit être fait avec les ajouts de code de tracking pour analytics, Voilà donc l'article d'origine (très bien fait, en anglais) avec l'astuce pour cette insertion de code sur tout un site :  https://www.iis.net/learn/extensions/url-rewrite-module/using-outbound-rules-to-add-web-analytics-tracking-code

Aucun commentaire:

Enregistrer un commentaire