mixiモバイルアプリ開発 - 一般論 -
いつものごとくGoogle App Engine (Python)で実装しているのだけど、
mixiのモバイル(携帯電話)アプリの場合、Firebugが使えないためデバッグ環境が乏しい。
FirefoxのextensionのFireMobileSimulatorを入れて、
携帯の機種(User-Agent)を切り替えて行う必要がある。
バグと戯れる(1)
さて、簡単にモバイルアプリつくってみたのだけど
モバイルアプリ内でのページの遷移方法は
mixi developer centerでは以下のように書いてある
○
GETの場合
<a href="?url=http%3A%2F%2Fexample.com%2Ffoo%2Fbar%3Fa%3D1%26b%3D2">次のページ</a>
○
POSTの場合
<form action="?guid=ON&url=http%3A%2F%2Fexample.com%2Ffoo%2F" method="post">
<input name="field1" type="text" value="value1" />
<input type="submit" value="送信" />
</form>
要はリンク先はhrefにしろactionにしろ"?url=[エスケープ済みURL]"で記述しろとのこと。
そんなわけで早速エスケープ済みURLでGETリクエストを記述してみた
<a href="?url=http%3A%2F%2mytest.appspot.com%2Fhoge">次のページ</a>
ところが、
"
只今アプリケーションサーバーでエラーが発生しています。しばらくしてから再度アクセスしてください。"
というエラーに遭遇。
デバッグしようにもmixi側ではこのメッセージのみで他は何も表示されないし、
Google App Engine側のログを見る当たりリクエストすら飛んで行ってない。
現象としてエラーが表示されている画面のURLに見慣れない"s=xxx"のクエリ文字列(93桁)がついている。
"http://ma.test.mixi.net/xxxx/?url=http%3A%2F%252mytest.appspot.com%2Fhoge
&s=ZWJkZTEyMDNlNzY2MDZhN2Q5NmVmNWY2MDk....以下省略"
mixi側で勝手に変な文字列でもつけるのか?と思っていたのだけど、
どうも正しくないURLへアクセスした際に付いてくるデバックコードみたいなものっぽい。
上記のURLと自分で記述したaタグの中身をよーく見てみると一部書き変わっていることに気づく。
href="?url=http%3A%2F%2mytest.appspot.com%2Fhoge"
http://ma.test.mixi.net/xxxx/?url=http%3A%2F%252mytest.appspot.com%2Fhoge
ん?"52"ってなんだ?
あ。。。
hrefの記述の際に"/"のエスケープ文字列は"%2"ではなく"%2
F"なのを書き間違えたためにエラーが発生。
おいおい、気づけよ自分(--;
バグと戯れる(2)
またまたエラー発生。
今度のエラーは
"只今アプリケーションサーバーでエラーが発生しています。しばらくしてから再度アクセスしてください。(body)"
(1)と似たエラーだが、今度は"(body)"がついてきた。
結論から言うと
Python(サーバーサイド)からHTMLのbodyタグの内容が変な場合に起こる。
*main.py*
class TestHandler(webapp.RequestHandler):
def get(self):
self.response.headers['Content-Type'] = 'application/xhtml+xml; charset=Shift_JIS'
self.response.out.write('hoge')
application = webapp.WSGIApplication([
('/hello',TestHandler)], debug=True)
def main():
run_wsgi_app(application)
if __name__ == '__main__':
main()
3行目が原因なんだけど、乱暴な結果の返し方をすると怒られる。
通常はテンプレート(ここではtmpl/hello.html)を使って
*main.py*
class TestHandler(webapp.RequestHandler):
def get(self):
self.response.headers['Content-Type'] = 'application/xhtml+xml; charset=Shift_JIS'
template_values = {
'user_info': 'hoge',
'page_num':page,
}
path = os.path.join(os.path.dirname(__file__), './tmpl/hello.html')
self.response.out.write(template.render(path, template_values))
application = webapp.WSGIApplication([
('/hello',TestHandler)], debug=True)
def main():
run_wsgi_app(application)
if __name__ == '__main__':
main()
*tmpl/hello.html*
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/1.0) 1.0//EN" "i-xhtml_4ja_10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />
<title>Test</title>
</head>
<body>
<div style="text-align:center">
{% if user_info %}
User Info: {{ user_info }}
{% else %}
No user info.
{% endif %}
page_num:{{ page_num}}
</div>
</body>
</html>
みたいに書く。
とりあえず困ったらまずはmixiのモバイル開発用コミュニティRemixLabsで確認
1)RemixLabsのコミュニティにアクセス
パートナーアカウント、またはパートナーテストアカウントでmixiにログインし、「RemixLabs」コミュニティにアクセスします。
2)RemixLabsコミュニティに参加
コミュニティTOPページにある「このコミュニティに参加」ボタンをクリックし、コミュニティに参加します。