今、ものすごくfacebookにはまっておりまして、アプリの作成方法を調査しました。
(参考はFacebook.com上のアプリ)
1.Facebook Developersグループページ右側にある「Set up New App」をクリックします。(下図参照)
2.アプリケーション名の入力を行い、規約の「同意する」を選択し、「アプリケーションを作成」ボタンを押す。
(ここでは、test_maitoという名前を入力。)
3.ボタンを押した後、下のような画面に遷移する
4.左側の「facebook Integration」を選択し、キャンバスページとキャンバスページURLの入力を行い「変更を保存」ボタンを押す
(下の例では、キャンバスページは、http://apps.facebook.com/test_maito
キャンバスページURLは、http://●●●●●●●●/test/)
5.保存完了後、「サンプルコードを使って、今すぐスタート」をクリックし、アプリの動作確認を行う。
6.動作確認結果
この時、facebookからアクセスされる時に、動くプログラムは下のようになっております。
#!/usr/bin/env python
import os
import urllib
from google.appengine.ext import webapp
from google.appengine.ext.webapp import util
from google.appengine.ext.webapp import template
class MainHandler(webapp.RequestHandler):
def post(self):
signed_request = self.request.get('signed_request')
auth_url = "http://www.facebook.com/dialog/oauth?client_id="
auth_url = auth_url + "●●●●●●●●●●" #アプリID
redirect_url = "http://apps.facebook.com/test_maito/" #キャンバスページ
redirect_url = redirect_url.encode('utf-8')
auth_url = auth_url + "&redirect_uri=" + urllib.quote_plus(redirect_url)
if not signed_request:
self.response.out.write("<script>top.location.href='")
self.response.out.write(auth_url)
self.response.out.write("</script>")
else:
template_values = {}
path = os.path.join(os.path.dirname(__file__), 'index.html')
self.response.out.write(template.render(path, template_values))
def main():
application = webapp.WSGIApplication(
[('/test/', MainHandler)],
debug=True
)
util.run_wsgi_app(application)
if __name__ == '__main__':
main() |
facebook上にアプリを表示する際に、上のプログラムが2回呼び出されます。
まず始めに、facebook側のサーバーがPOSTでアクセスを試みます。
その後、こちら側で変数auth_urlで設定したurlにリダイレクトを行うと、再度、上のプログラムが呼び出されます。
(上の例ではtop.location.hrefを使ってリダイレクトされています。)
2回目に呼び出される時に、facebook側のサーバーでは、「signed_request」というPOST変数も一緒に送信を行います。
一度目は、signed_requestは送信されません。
なので、1回目と、2回目を区別する方法として、signed_requestのあるなしで判定を行います。
変数が存在する場合は、htmlを表示するように指示を行っております。
(上のプログラム例では、index.html)
index.htmlは下のようになっております。
<html>
<head>
<title>facebook app test</title>
</head>
<body>
<center>
Hello facebook apps!!<br>
this is test apps.
</center>
</body>
</html> |
0 コメント:
コメントを投稿