Contents
CSS や JS(JavaScript)などの静的な外部ファイルを利用するには、まず app.yaml の handlers セクションで静的ファイルを含むディレクトリのパスなどを定義する必要があるらしい。Using Static Files - Google App Engine - Google Code を参考にやってみた。
CSS ファイルの利用
今回は外部 CSS ファイルで試してみました。
1. app.yaml の変更
handlers: - url: /css static_dir: css - url: /.* script: helloworld.py
上から順にマッチするかテストされるので、/css から始まる URL にリクエストがあると、css ディレクトリにあるファイルから適当なファイルを探すようになるらしい。……が、
<class 'google.appengine.tools.dev_appserver.InvalidAppConfigError'>: regex invalid: unbalanced parenthesis
というエラーが出てうまくいきませんでした。代わりに次のようにしてみたら動いた:
- url: /css/(.*\.css) static_files: css/\1 upload: css/(.*\.css)
app.yaml の書き方については、Configuring an App - Google App Engine - Google Code を参照。
2. css の作成
外部スタイルシートを作成して、css ディレクトリに保存。
/* 例です */ body { background: #eaeaea; color: #333333; } #title { color: #333399; font-style: italic; }
3. テンプレートの変更
テンプレートファイルの index.html の head 要素に CSS へのリンクを追加。
<head> <link type="text/css" rel="stylesheet" href="/css/test.css" /> </head>
こんな感じで JavaScript や Flash なんかも利用可能になるらしいです。
メモ
MIME タイプ
MIME タイプは基本的に拡張子を元に決定される。追加オプションで変更することも可能。
関連記事
- Google App Engine に登録してみた
- Google App Engine SDK: Hello, World! を表示させるまで
- Google App Engine SDK: webapp フレームワーク
- Google App Engine SDK: テンプレートの使用
コメント(過去分)
※コメントがインポートできなかったため、旧ブログ時代にいただいたコメントについては、記事の末尾に再掲載する形を取らせていただいています。
app.yaml の変更
はじめまして。
.css ファイルをなかなか別ファイルにできずにあきらめかけて
いたのですが、参考になりました。 ありがとうございました。
Posted by kw at 2008/04/15 (Tue) 23:09:33
Re: app.yaml の変更
お役に立てて何よりです。
kwさんのサイト、RSS リーダーに登録させていただきました。
これから Datastore API の勉強をしようと思っていたので、参考にさせていただきます。
Posted by にーやん at 2008/04/16 (Wed) 00:50:30