静的ファイルの提供

このページでは、CSS を静的ファイルとして提供する方法を説明します。

従来のウェブ ホスティング環境とは異なり、Google App Engine では、特に構成しない限り、アプリケーションのソース ディレクトリからファイルを直接提供することはありません。ただし、画像、CSS、JavaScript コードなどの静的ファイルを直接ウェブブラウザに提供することもできます。また、独自のハンドラを作成せずに特定のファイルを提供するように App Engine に指示できます。

このページは複数のページからなるチュートリアルの一部です。設定の手順を最初から見ていくには、ゲストブックの作成に移動してください。

ハンドラの定義

次のサンプルコードでは、app.yaml ファイルで URL に 2 つの新しいハンドラを定義しています。

  1. /stylesheets で始まる URL のリクエストを App Engine が受け取ると、stylesheets ディレクトリのファイルのパスの残りの部分がマッピングされ、該当するファイルが見つかれば、そのファイルの内容がクライアントに返されます。

  2. 他のすべての URL は /.* パスと一致し、helloworld.php スクリプトによって処理されます。

    runtime: php55
    api_version: 1
    
    handlers:
    - url: /stylesheets
      static_dir: stylesheets
    
    - url: /.*
      script: helloworld.php
    

URL ハンドラパスの複数のパターンは、app.yaml の中に出現する順序でテストされます。この場合、/stylesheets パターンを照合してから、/.* パターンの照合を行います。URL マッピングと app.yaml で指定可能なオプションの詳細については、app.yaml リファレンスをご覧ください。

スタイルシートの追加

次のサンプルコードでは、CSS ファイルを作成してアプリケーションに追加しています。

  1. このサンプルコードでは、helloworld/stylesheets ディレクトリの main.css ファイルに次のコンテンツを追加します。

    body {
      font-family: Verdana, Helvetica, sans-serif;
      background-color: #DDDDDD;
    }

    デフォルトでは、App Engine はファイルの拡張子に基づいた MIME タイプを使用して静的ファイルを提供します。たとえば、.css という拡張子を持つファイルの場合、text/css の MIME タイプで提供されます。app.yaml 構成ファイルでハンドラを構成するときに mime_type 設定を使用すると、明示的な MIME タイプを構成できます。

  2. アプリケーションでスタイルシートを使用するため、このサンプルコードでは先頭の <html> 行の後に次の行を挿入します。

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

このページは役立ちましたか?評価をお願いいたします。

フィードバックを送信...

PHP の App Engine スタンダード環境