静的ファイルの提供

 ここまで、Webブラウザに表示する画面はすべてプログラムで生成してきましたが、Webアプリケーションを作る上においては、当然のことながら、画像やcssファイル等々の静的なファイルを使う必要があります。

 Google App Engineでそれらの静的コンテンツを提供するには、app.yamlに関連する設定を記述すればいいようです。

 例として、/images/...というURLにアクセスされたら、imagesフォルダ以下の画像を表示することにしましょう。また、サイトのアイコンであるfavicon.icoも同じフォルダに用意し、/favicon.icoにアクセスがあったら、images/favicon.icoを返すようにします。

app.yaml

handlers:
- url: /images
  static_dir: images

- url: /favicon.ico
  static_files: images/favicon.ico
  upload: images/favicon\.ico
  mime_type: image/x-icon

これで、/favicon.icoおよび/images/...へのアクセスに対して静的コンテンツを返すようになりました。さっそく、templates/welcome.htmlから、二つのファイルを呼び出すように変更します。

templates/welcome.html

<html lang="ja">
<head>
    <link rel="shortcut icon" href="favicon.ico">
    <title>金星翻車魚(キンボシマンボウ)</title>
</head>
<body>
    <img src="/images/kinboshi_sunfish.jpg">
    <h1>金星翻車魚(キンボシマンボウ)</h1>
    <hr>
    <p>ようこそ</p>
    <p>あなたは{{counter}}番目のお客様です。</p>
</body>
</html>

例によって、ローカルでdev_appserver.pyを使って確認し、appcfg.py update コマンドでGoogle App Engineにアップロードしました。

金星翻車魚(キンボシマンボウ)