Sunday, November 02, 2008

Configuring app.yaml for static websites

In case you want to publish a static website on Google App Engine (http://appengine.google.com/) then the following configuration can be used (app.yaml):

application: appname
version: 1
api_version: 1
runtime: python

handlers:
- url: /(.*)
static_files: static/\1
upload: static/(.*)


This assumes the following:

1) The application name is appname (change it to your registered application name on appengine.google.com)
2) All static pages are under the static directory (appname/static)

This works fine, but any request to http://appname.appspot.com/ (or another domain in case you are using Google Apps) will not automatically be redirected to http://appname.appspot.com/index.htm (or index.html). In case you want such a behavior, create a python script (like main.py) under the application directory (appname/) with the following content:


import cgi

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

class MainPage(webapp.RequestHandler):
def get(self):
self.redirect('/index.htm')

application = webapp.WSGIApplication(
[('/', MainPage)],
debug=True)

def main():
run_wsgi_app(application)

if __name__ == "__main__":
main()


and change the app.yaml to:


application: appname
version: 1
api_version: 1
runtime: python

handlers:
- url: /
script: main.py

- url: /(.*)
static_files: static/\1
upload: static/(.*)

2 comments:

Unknown said...

You can go completely without Python and stick to static HTML and app.yaml using the following settings and hack (PURE HTML REDIRECT) (Everything I had static was for documentation, so it's under /doc whereas / could have been used just as easily and the hack would not have been necessary):

###START APP.YAML SECTION###
- url: /favicon.ico
static_files: doc/favicon.ico
upload: doc/favicon.ico
mime_type: image/vnd.microsoft.icon

- url: /doc/(.+)
static_files: doc/\1
upload: doc/(.+)

- url: /doc/
static_files: doc/index.html
upload: doc/index.html

- url: /doc
static_files: doc/redirect.html
upload: doc/redirect.html
###END APP.YAML SECTION###

The entry for /doc/ and /doc could have been identical except for the browser looking for all included files like CSS, JS and images in / instead of /doc. So, we serve /doc up as a redirect.html nothing but a meta tag in the head to request a refresh to another page.

<html><head><meta
http-equiv="refresh" content="0;
url=/doc/"></head><body>Redirecting
to /doc/</body></html>

Watch the static pages with AJAX updates all served through static app.yaml syntax.

http://bothole.appspot.com/doc GO

http://bothole.appspot.com/doc/ GO

http://bothole.appspot.com/doc/index.html GO

All three are nearly identical except for a slight client delay with the /doc url, you might not even notice with a broadband connection and powerful pc.

twl said...

request to http://appname.appspot.com/ could be handled by add follows codes to ur yaml file if you have a static directory:

- url: /
static_files: static/index.html
upload: static/index.html

if you put your homepage under your project directly, like appname/index.html, just omit static/:
- url: /
static_files: index.html
upload: index.html