Google App Engine SDK: テンプレートの使用
チュートリアルでは、フォーム画面の作成、データの格納へと移るが、飛ばして先に進む。
webapp フレームワークには、Django のテンプレートエンジンが含まれているらしい。と言っても、その Django がよくわからないのだが、とりあえず Using Templates - Google App Engine - Google Code を参考にやってみる。Django については、機会があれば勉強するということで……。
1. template のインポート
helloworld.py に次の 2 行を追加する:
import os
from google.appengine.ext.webapp import template
2 行目が template モジュールの読み込み。1 行目で os モジュールがインポートされているが、パスの結合に必要みたい。この場合、os.path だけでもいいような気がするが、気にせず続ける。
2. index.html の作成
チュートリアルの例をいきなり理解するのは無理だったので、簡単なものにしてみた。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>{{ title }}</title>
</head>
<body>
<p><span id="title">{{ title }}</span></p>
</body>
</html>
{{ title }} という部分が置換される部分。index.html という名前で保存。名前は別に index.html じゃなくてもいいかもしれない。
3. MainPage クラスの修正
self.response.out.write('<html><body><p>こんにちは、webapp の世界!</p></body></html>')
ここを次のように修正する:
template_values = {
'title': 'こんにちは、Google App Engine!'
}
path = os.path.join(os.path.dirname(__file__), 'index.html')
self.response.out.write(template.render(path, template_values))
リロードしてみると、ちゃんと {{ title }} の部分が置換されていた。Using Templates - Google App Engine - Google Code を見ると、if 文や for 文なんかも使えるようなので、あとでまたやってみる。とりあえず、ここまで。
関連記事
アメリカの銀行口座がなくても amazon.com のアソシエイトに参加可能に?
先日、アメリカの Amazon.com Associates に登録申請しました。その後、無事、承認されましたので、niiyan.net に広告を貼り付けています。
たしか以前は、amazon.com のアソシエイトに参加するには、アメリカ国内に店舗を持つ銀行の口座を持っていないとダメだったと思います(参考: ニート、アフィリエイトを学ぶ: 米国Amazonのアソシエイトをするには、米国の銀行口座が必要)。
ところが、先日、試しに「Join now」(Apply now)をポチっと押してみたら、銀行口座に関する入力を求める項目がなく、普通に申し込めました。その後、しばらくして、承認された旨のメールも届いたというわけです。
ただし支払いに銀行振込を選びたい場合は、やはり 9 桁の routing number/ABA number が必要のようです(Help - Amazon.com Associates Central より)。というわけで、とりあえずは小切手払いを選んでおきました。他に Amazon.com Gift Certificate(ギフト券?)も選べます。
Google App Engine SDK: webapp フレームワーク
Using the webapp Framework - Google App Engine - Google Code から、webapp フレームワークという WSGI 互換のフレームワークを使った作業に移る。
Google App Engine では、Django も使えるらしいので、この機会に勉強してみようかとも思っていたけど、webapp についてもちょっと読んでみる。The webapp Framework - Google App Engine - Google Code に webapp フレームワークのドキュメントがある。
以下、メモ。
out プロパティ
via Building the Response - Google App Engine - Google Code
self.response.out.write("<html><body><p>Hi there!</p></body></html>")
out プロパティは、レスポンスのボディを書き出すために使用されるファイル風のオブジェクト
Content-Type ヘッダ
via Building the Response - Google App Engine - Google Code
デフォルトは、「text/html; charset=utf-8」
debug モード
via Running the Application - Google App Engine - Google Code
application = webapp.WSGIApplication(
[('/', MainPage)],
debug=True)
「debug=True」でデバッグモード。例外が起きたときに、webapp にブラウザに stack trace を表示させるようにする。デフォルトでは、エラー発生時に HTTP 500 エラーを返す。
Google アカウントとの統合
via Using the Users Service - Google App Engine - Google Code
Google アカウントを使ってサインインさせたり、サインインしていないなら認証画面にリダイレクトしたりできるらしい。個人的に今のところ必要なさそうなので、サラッと読み飛ばす。
詳細は、The Users API - Google App Engine - Google Code
参考: WSGI
関連記事
あまびき開発日誌 #37 ~ #40
あまびき開発 37 ~ 40 日目。
37 日目
- Yahoo! 検索 Web サービスで検索した場合に、お取り置き欄のレイアウトが崩れていたのを修正。
- 前日、CSS で角を丸くした際に Yahoo! 経由での検索結果表示時の高さ調整を忘れていたのが原因。
- 検索結果表示欄とお取り置き欄の overflow 属性の設定を auto から scroll に変更。その親要素の overflow 属性を hidden にし、高さをより低くすることによって横スクロールバーを隠す。
38 日目
商品タイトルが長い場合には省略することにした。下のような感じで substr を使ってみたが、日本語でも問題なくカットできた(みたい)。
// 例:
var $title = $("Title", this).text();
if($title.length > 48){ // 48 文字より多い場合はカット
var $shorttitle = $title.substr(0, 48) + "..."; // 末尾に ... を追加
} else {
var $shorttitle = $title;
}
39 日目
Creators の Role 属性も取得して、「作者名(Role)」という形で表示することにした。Role 属性の値は attr() を使えば取得できる。
// 例:
var $role = $("ItemAttributes/Creator").attr("Role");
40 日目
- 検索フォームを JavaScript で生成するのをやめた。読み込んだときに、Opera で一番最初の select メニューが選択されないため。
- 「便利な機能」のヘルプを追加。
- jqueryselectcombo プラグインを 1.2 に更新したら IE で動作しなくなったので、結局 1.1 に戻した。Firefox では 1.2 も動くが、メインの select メニューを変更するたびにサブメニューの要素数が返ってくる(Firebug のコンソール画面で確認)。
この記事は、Amazon.co.jp 商品検索サイト「あまびき」の開発中につけていたメモを、ブログ用にまとめ直したものです。
Google App Engine SDK: Hello, World! を表示させるまで
Getting Started - Google App Engine - Google Code は、ゲストブックアプリケーションを題材にしたチュートリアルになっている模様。とりあえずザックリと読みながら、動かせるところまでやってみる。
The Development Environment
このチュートリアルでは、次の 2 つのコマンドを使用する。
- dev_appserver.py: 開発用の Web サーバーを起動する。
- appcfg.py: アプリケーションファイルをアップロード。
Hello, World!
1. スクリプトの作成
helloworld という名前のディレクトリを作成し、そこに helloworld.py という名前のファイルを作成する。
とりあえず、google_appengine の下に hellowordl というフォルダを作成してみた。コードは少し変えて、日本語にしてみる(UTF-8 で保存)。
# -*- coding: utf-8 -*-
print 'Content-Type: text/plain'
print ''
print 'こんにちは、世界!'
2. app.yaml の作成
YAML 形式の設定ファイル(app.yaml)を作成する。
Hello, World! - Google App Engine - Google Code に簡単な説明がある。
3. Web サーバーの起動
dev_appserver.py で Web サーバーを起動する。
コマンドプロンプトを起動して
cd "C:\Program Files\Google\google_appengine"
dev_appserver.py helloworld
「Allow dev_appserver to check for updates on startup?」と聞かれたので、とりあえず y と入力して Enter。
4. アプリケーションのテスト
ブラウザで http://localhost:8080/ にアクセスすると、こんな感じで表示された。

スクリプトを編集して保存、ブラウザをリロードすると変更が反映される。

サーバーをシャットダウンするには、Ctrl + C。一見何も起こらないようだったが、ブラウザをリロードするとエラーが出て接続できなくなっていた。コマンドプロンプトを閉じるには exit と入力して、Enter。



