Diffuser des fichiers statiques

Cette page vous explique comment diffuser un fichier CSS en tant que fichier statique.

Contrairement à un environnement d'hébergement Web traditionnel, Google App Engine ne diffuse les fichiers directement à partir du répertoire source de votre application que s'il est configuré pour le faire. Toutefois, vous pouvez diffuser des fichiers statiques tels que des images, du code CSS et du code JavaScript directement dans le navigateur Web. Vous pouvez faire en sorte qu'App Engine diffuse certains fichiers sans avoir à créer vos propres gestionnaires.

Ce tutoriel comporte plusieurs pages. Pour le suivre depuis le début et consulter les instructions relatives à la configuration, consultez la page Créer un livre d'or.

Définir des gestionnaires

Dans l'exemple de code suivant, deux nouveaux gestionnaires d'URL sont définis dans le fichier app.yaml :

  1. Lorsque App Engine reçoit une requête associée à une URL commençant par /stylesheets, il mappe le reste du chemin d'accès vers les fichiers du répertoire stylesheets, puis, s'il trouve un fichier approprié, renvoie le contenu du fichier au client.

  2. Toutes les autres URL correspondent au chemin d'accès /.* et sont gérées par le script helloworld.php.

    app.yaml 
    runtime: php55
api_version: 1

handlers:
- url: /stylesheets
  static_dir: stylesheets

- url: /.*
  script: helloworld.php

Les formats des chemins de gestionnaire URL sont testés dans l'ordre dans lequel ils apparaissent dans app.yaml. Ainsi, le format /stylesheets sera associé aux chemins appropriés avant le format /.*. Pour obtenir plus d'informations sur le mappage des URL et sur les autres options que vous pouvez définir dans le fichier app.yaml, consultez la documentation de référence sur app.yaml.

Ajouter la feuille de style

Dans l'exemple de code suivant, un fichier CSS est créé, puis ajouté à l'application.

  1. L'exemple de code ajoute le contenu suivant au fichier main.css du répertoire helloworld/stylesheets :

    stylesheets/main.css 
    body {
  font-family: Verdana, Helvetica, sans-serif;
  background-color: #DDDDDD;
}

    Par défaut, App Engine diffuse les fichiers statiques à l'aide d'un type MIME en fonction de l'extension du nom de fichier. Par exemple, un fichier dont le nom se termine par .css sera diffusé avec un type MIME text/css. Vous pouvez configurer des types MIME explicites en utilisant le paramètre mime_type lors de la configuration de vos gestionnaires dans le fichier de configuration app.yaml.

  2. Pour utiliser la feuille de style dans votre application, l'exemple de code insère les lignes suivantes après la ligne <html> en haut :

    helloworld.php
    <head>
  <link type="text/css" rel="stylesheet" href="/stylesheets/main.css" />
</head>