Facebook Apps with Google App Engine

The internet’s simplest introduction to writing a facebook application with Google App Engine, in Python, with Django.

So let’s start with an easy introduction to writing a facebook app with app engine. First of all, you need to sign up for an application with Facebook. You can do this here, just click “set up new application” once you’ve added the facebook developer application, and give them your preferences. You should then come to a page full of settings, with titles like “Essential Information”, and “Basic Information”. Use the navigation on the left to edit the “canvas” settings. Keep this page open.

Now you must sign up for a new application with Google App Engine. That can be done here. Next, you need to write your standard app.yaml file (To illustrate the process, I’m going to be making a simple counter, to count how many times an application “canvas” is viewed). I’m going to call my application “fbstcntr” (as in “facebook stat counter”) The app.yaml file is going to look like this (the stylesheets director is for you to use later when designing your canvas):

application: fbstcntr

version: 1

runtime: python

api_version: 1

handlers:

- url: /stylesheets

static_dir: stylesheets

- url: /.*

script: main.py

Now go back to the facebook settings page, and where it says “Canvas Callback URL”, enter http://(your-application-name).appspot.com. Also, enter the name of your application in “Canvas Page URL”.

Next, you’ll need to make your canvas.html file (this is the one that facebook will use for your application’s canvas). Mine just looks like this (remember I’m using Django, but that’s by no means essential for this tutorial):

<html>

<body>

{{ stat }}

</body>

</html>

Save this file in the same folder as your app.yaml file (the folder I’m using is just called “fb”). Next, we’ll make our main.py file – this is where things get slightly more complicated, but I’ll keep it simple yo.

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

from google.appengine.ext import db

# this is a file we’ll make next

import facebook

# just a little datastore model

class Stat (db.Model):

visit = db.IntegerProperty(default = 0)

class Canvas(webapp.RequestHandler):

def get(self):

#these are found in facebook’s ‘My Applications’ page

_FbApiKey = ‘your api key’

_FbSecret  = ‘your secret key’

# Add an element to your datastore

visit = Stat()

visit.put()

# find out how many elements there are in the datastore

query = db.GqlQuery(“SELECT __key__ FROM Stat”)

results = query.fetch(1000)

stat = str(len(results))

# put this value in your template values

template_values = {“stat”: stat}

path = os.path.join(os.path.dirname(__file__), ‘canvas.html’)

self.response.out.write(template.render(path, template_values))

application = webapp.WSGIApplication((‘/’, Canvas)],

debug=True)

def main():

run_wsgi_app(application)

if __name__ == “__main__”:

main()

Save this file as “main.py”. Next, visit this page, and save all of that code straight into a file called “facebook.py”, and make sure that file is in the same folder as the rest of your application. Well done! You’ve just made the skeleton of your facebook application! Now, run your command prompt, and make it go to where your application is stored (its directory). For me it looks like this:

D:\Graeme\Work and Fun\Python\GAE\fb:

Type in “appcfg.py update ” and the name of the file that is holding your application files. Fire this off and it will update your application!

Every time you visit this application’s page at apps.facebook.com/your-app-name/, it will update the datastore and display the amount of visitors that have been there previously. You can grow this application more by working on your canvas.html file, and including more functions that are available with facebook.py. There are so many possibilities still for facebook apps, and now you can make them and host them for free off Google’s servers – so best of luck!

PyThoughts

One Response to “Facebook Apps with Google App Engine”
  1. py 19 August 2010 at 1:25 am #

    The URL to the page with the facebook.py code (http://blog.pythoughts.com/facebook) seems to link back to this post…

Leave a Reply