静的なファイルを使う
Using Static Files
CSSファイル、JSコード、画像、Flashアニメーションなど、本来はサーバー側においてそこから読み取られる情報をローカルで実現させる仕組み?
まず、helloworld.pyの場所に新しくstylesheetsフォルダを作成します。
その後、app.yamlファイルのhandlersに先ほど作成したstylesheetsフォルダを静的にアクセスできる場所として指定するため、以下を追加します。
handlers:
- url: /stylesheets
static_dir: stylesheets
stylesheetsフォルダにmain.cssという名前でスタイルシートファイルを作成
body {
font-family: Verdana, Helvetica, sans-serif;
background-color: #DDDDDD;
}
最後に、index.htmlにmain.cssを読み込ませる。
これで、完了。
リロードすると、スタイルが適用される。
app.yamlのhandlers指定が無いとスタイルが適用されません。
じゃあ、これは一体なにしてるの?
handlers:
- url: /stylesheets
static_dir: stylesheets
これは、/stylesheetsを要求されたときにAdd Engine側で参照しに行く場所を追加指定しています。
つまり、index.htmlでhref="/stylesheets/main.css"と要求されたとき、サーバー側にファイルが無いためスタイルが実行されないけど、handlers指定することで、ローカルのディレクトリを参照してその結果を返してくれるようになります。
その他のファイル形式(画像、スクリプト等)でも同じように指定する必要があります。
handlers:
#スタイルシート
- url: /stylesheets
static_dir: stylesheets
#Javascriptコード
- url: /js
static_dir: js
#画像
- url: /images
static_dir: images
#Flashアニメーション
- url: /animations
static_dir: animations
みたいな感じになるのか。ちょっと面倒くさいな。