GAE＋Pythonでテンプレートの共通化。: 俺の砂箱

<< GAEアプリをアップロードする方法。 | TOP | GAE＋Pythonの標準モジュールだけでXML解析。簡単なRSSリーダーを作ってみる。 >>

2011年05月24日

GAE＋Pythonでテンプレートの共通化。

以前に GAE for Python の webapp フレームワークでテンプレートエンジンを使ったデザインの外部化を行ったわけだが、今度は更にデザインのメンテナンス性を高めるためにテンプレートの共通化を行ってみる。

まず、各画面共通のテンプレートを作成する。
ファイル名は base.html とした。

<html>
    <head>
        <title>{% block title %}{% endblock %}</title>
    </head>
    <body>
        {% block content %}{% endblock %}
        <br/>
        <a href="{% block linkURL %}{% endblock %}">{% block linkName %}{% endblock %}</a>
    </body>
</html>

次に、上記の共通テンプレートへ挿し込む画面(というか文字列)を定義する。
ここではそれぞれ page1.html 、 page2.html とした。それぞれのページで共通テンプレートを適用してみるということだ。

page1.html

{% extends "base.html" %}

# タイトル部分
{% block title %} Page1 - Helloworld App {% endblock %}

# コンテンツ部分
{% block content %}
This is Page1.
{% endblock %}

# リンク先URL
{% block linkURL %}/page2{% endblock %}
# リンク先名
{% block linkName %}page2へ{% endblock %}

page2.html

{% extends "base.html" %}

# タイトル部分
{% block title %} Page2 - Helloworld App {% endblock %}

# コンテンツ部分
{% block content %}
This is Page2.
{% endblock %}

# リンク先URL
{% block linkURL %}/page1{% endblock %}
# リンク先名
{% block linkName %}page1へ{% endblock %}

重要なのは先頭行の {% extends "base.html" %} という部分だ。これは共通テンプレート "base.html" を読み込むための記述である。

で、お馴染みの helloworld.py を以下のように編集する。

# -*- coding: utf-8 -*-
import cgi
import os

from google.appengine.ext import webapp
from google.appengine.ext.webapp.util import run_wsgi_app
from google.appengine.ext.webapp import template


class Page1(webapp.RequestHandler):
  def get(self):
    template_values = {}
    path = os.path.join(os.path.dirname(__file__), 'page1.html')
    self.response.out.write(template.render(path, template_values))

class Page2(webapp.RequestHandler):
  def get(self):
    template_values = {}
    path = os.path.join(os.path.dirname(__file__), 'page2.html')
    self.response.out.write(template.render(path, template_values))

application = webapp.WSGIApplication(
                                     [('/page1', Page1),
                                      ('/page2', Page2)],
                                     debug=True)

def main():
  run_wsgi_app(application)

if __name__ == "__main__":
  main()

開発用サーバを起動し、 http://localhost:8080/page1 と http://localhost:8080/page2 へアクセスしてみよう。
それぞれのページ(page1.html, page2.html)が同じテンプレート(base.html)を使い回していることが分かるはずだ。

これで画面のメンテナンス性がグッと向上するわけである。

ここはひとつポチっとよろしく。