Originally Published in March 2013
Overview
Google App Engine is a service provided by Google that provides application hosting in Google’s cloud environment. This article will discuss using Google App Engine as a Content Delivery Network (CDN) for hosting static web content, web pages, and web sites.
What does Google App Engine provide?
Google App Engine provides a hosting platform from which you can serve web content, web pages, or even entire web sites. In addition to hosting web applications, Google App Engine can also be used to host static web content.
What is “Static Web Content?”
Static web content is content that doesn’t require any special programming on your web server to run your web site.
This includes:
HTML files (such as those with .html or .htm extensions)
Images (files with .jpg, .jpeg, .gif, and .png extensions)
Cascading Style Sheets (files with .css extensions)
XML and RSS / RDF / ATOM documents (files with .xml, .rss. .rdf, and .atom extensions)
Music and Videos (files with .wmv, .avi, .mpeg, .qt, .mp3, and many, many more)
Flash content (.flv files)
JavaScript files (.js files)
Text and word processing documents (.txt, .doc, .docx, .xls, .xlsx, .ppt, .pptx, etc.)
Archives (.zip, .tar, .gz, .bz2, etc. files)
There are many, many more times of files you can host on Google App Engine. In fact, if you avoid web server applications (like PHP , ASP, ColdFusion, Perl, .NET, .py, etc.) chances are, you can host it on Google App Engine.
Web applications that use JavaScript and Flash are acceptable too, so long as they don’t interact with applications on your Google App Engine account.
If you need to run a web application on your Google App Engine-hosted web site, it may be possible do that too, but that’s beyond the scope of this article.
How reliable is Google App Engine?
Applications that are deployed to Google App Engine are distributed to Google App Engine servers hosted all around the world. As a result they’re incredibly resilient to the everyday hazards that plague hosting facilities and take a bite out of web site uptime. With Google App Engine, whole data centers and multiple network connections can go down and your web site would continue to chug along without ever becoming inaccessible. In fact, Google offers a 99.9% Service Level Agreement (SLA) for standard accounts and 99.95% uptime for Premier Google App Engine accounts.
What does Google App Engine cost?
One of the best features about Google App Engine is it’s pricing model. With Google App Engine, you pay for the resources that you use. So, as your need for additional resources changes, Google App Engine keeps up. This works great if you have an application that has peaks of traffic a few times a year and is otherwise quiet the rest of the year (such as applications that handle course registration in a college environment).
Google App Engine offers a free account level where, if your application only uses a few resources, it can be hosted on Google App Engine for free!
If you need more resources than are available to the free Google App Engine level, you can enable billing. Billing costs a minimum of $2.10 / week (or $0.30 / day).
Once you enable billing, your application is invoiced according to the resources that it uses on a monthly basis. For example, the cost of transferring a gigabyte of traffic, after your first gigabyte per day (which is free), is $0.12 / gigabyte.
So, if you enable billing and the only resource your application uses is bandwidth, you’ll be paying about $0.30 / day which buys you just about 3.5 gigabytes of downloads per day (the first gigabyte is free and the remaining 2.5 gigabytes will be billed at at $0.12 / gigabyte).
If your average web page (and all of it’s images, stylesheets, etc.) is 100 kilobytes, you can serve an estimated 10,000 page views / day while remaining under the free quota. That’s almost 4 million page views per year… for free!
If you enable billing, you’ll be able to serve an estimated 35,000 page views / day (which is more than 13 million page views per year) before going above the minimum billing level.
For more information on billing and specific quotas, visit: https://developers.google.com/appengine/docs/quotas
What can be hosted on Google App Engine?
Lots of stuff! You can host web pages, stylesheets, JavaScript libraries, and even multimedia files. Each application in Google App Engine can host 10,000 files, each of which needs to be 32 megabytes or less.
Oh yeah, and you can also host web applications written in Java, Python, and Go, as well as any other language that can run in a JVM, including PHP, Ruby, and much more!
What can web pages hosted on Google App Engine look like?
They can look like anything you want! There is no limitation to the appearance of web content hosted on Google App Engine. Google App Engine doesn’t put anything on your web pages (like Google Sites does with the bar across the bottom of pages). You have free range to be creative just as if you were using any other web hosting service. Google App Engine, however, doesn’t permit adult / explicit content.
Cool! How do I get started?
For static web hosting, you’ll need a computer with an Internet connection, as well as a few free tools that can be downloaded from the Internet. That’s pretty much it. You won’t need to do any programming but you will need to change a single line from a simple configuration file.
Step 1: Download and install required tools
You’ll need both of these tools:
Python v2.7:
http://www.python.org/download/releases/2.7.3/
Google App Engine Python SDK
https://developers.google.com/appengine/downloads
Download and install Python first, then the Google App Engine SDK.
Step 2: Register your “application”
For each web site you’ll be hosting, you need to create an “application” with Google App Engine. Google App Engine treats applications like accounts in a way — each application is completely separate and has it’s own files and resources to work with.
Each application must have a unique name. There are a lot of applications hosted on Google App Engine already (with more being added every day), so you may need to be creative in your application naming.
Be careful with the name you choose as it will be publicly visible (unless you setup a custom domain mapping, which we’ll get to in another article). Until you setup a custom domain mapping, your web site will live at:
http://somename.appspot.com/
..where “somename” is the name you choose for your application.
To register your application, go to the Google App Engine site at:
https://appengine.google.com/
Click on the “Create Application” button at the bottom of the screen.
Note — if you haven’t used Google App Engine before, you will need to setup a developer account with Google App Engine. In order to confirm your identity, you will need to provide a phone number where Google can text a confirmation number. You will then have type that number back to Google. I’ve used Google Voice to setup a number that can accept text / SMS messages before and this has been sufficient for setting up a Google App Engine account.
Step 3: Prepare your web site
Google App Engine doesn’t need a lot in order to host your web site, but a little preparation doesn’t hurt.
Make sure that all of your HTML is valid and properly formed. Google App Engine doesn’t require this, but it is good practice. In fact, there are free tools that will do this for you — and it’s a good practice.
Make sure your images have “alt tags” that describe them, that you use CSS for formatting, and that all of your links work as expected.
Use “index.html” as your main page’s filename. Many web sites do this already, so you may not need to make any changes.
(* this is like having a “DirectoryIndex” in Apache set to “index.html”)
Make sure that your links are capitalized the exact same way as their file names on your computer. Your computer may understand when you link to “About.html” and the filename is actually “about.html” but Google App Engine is very picky — it’s sensitive to case. These can be tricky to find and the links will work fine from your computer but when you deploy your web site to Google App Engine, things suddenly stop working.
The best way to avoid issues like these is to use a consistent naming scheme. For example, it’s common to use all lowercase letters and replace all spaces with underscores (the ‘_’) character.
Use only relative links when linking to web content hosted on this web site. Otherwise, it will be very difficult to test your web site in the development environment.
A relative link is one that does not make reference to the server hosting the target of the link; they look like “/about_us.html” or “images/border.jpg” or “../style.css”.
The opposite of a relative link is an absolute link which makes reference to the server that is hosting the target of the link; they look like “www.example.com/about_us.html” or “http://www.example.com/images/border.jpg”.
Also, you’ll want to make sure that your links do not make reference to computer you’re using to develop the web site. These can be tricky to spot since the web site works great when you’re looking at it from your computer but it doesn’t work for anybody else. They look like “C:\web_sites\about_us.html” or “C:\Users\username\Desktop\my web site\”.
Verify that your web site is composed of only Static Web Content. A good way to be absolutely certain that your web site only uses Static Web Content is to test it through the Google App Engine Launcher’s development environment. We’ll talk about how to do this shortly.
Find where your web site is stored (even if temporarily) on your computer. In the example here, I’m storing my web site on a PC with the web site located in:
C:\web_sites\kdawebtest01
Your web site does not need to be on your local hard drive. It can be on a network file share mounted to your computer via CIFS / SMB.
(* note — the Google App Engine Launcher does not like paths like \\fileserver\path\to\site so you’ll need to map the location as a network drive; that way, you can use a path like n:\path\to\site which Google App Engine likes. You can use this mechanism so that multiple developers can share a single local copy of your web site, just make sure they all use the same network drive mapping)
Step 4: Launch the Google App Engine Launcher
When you installed Google App Engine’s SDK, it also installed a tool called the Google App Engine Launcher. This is a graphical tool that allows you to test and deploy your web site from your computer.
Step 5: Create a new application
Using the Google App Engine Launcher, go to the “File” menu and click on the “Create New Application” menu option.
Google App Engine Launcher
Next, you’ll want to change the Application Name to the name you picked earlier while on the Google App Engine web site. Then, make sure the Parent Directory is the directory above where you plan to store your web site.
In our example, we are storing our web site in:
c:\web_sites\kdawebstatic01\
so we would select a directory of:
c:\web_sites\
for this field. If the directory for your web site does not yet exist, Google App Engine Launcher will create it for you.
You can leave the Port field alone.
You should have something that looks like this:
Add New Application through the Google App Engine Launcher
Next, click on the ‘Create’ button. Your new application will show up in the Google App Engine Launcher.
Next, select your new application (left click on the application in the list in the main part of the application) and then click on the ‘Edit’ button at the top of the page.
This will load the configuration file for your application in your system’s default text editor.
You’ll want to replace the file that was loaded with the following text:
application: kdawebtest01
version: 1
runtime: python27
api_version: 1
threadsafe: yes
handlers:
- url: /
static_files: index.html
upload: index.html
- url: /static
static_dir: static
- url: /(.*)/
static_files: \1/index.html
upload: .*/index\.html
- url: /favicon\.ico
static_files: favicon.ico
upload: favicon\.ico
### OPTIONAL
#
# Secure URLs (secure connection via HTTPS)
# – url: /secure
# static_dir: secure
# secure: always
### OPTIONAL
#
# Require Authentication
#
## Any user
# – url: /auth
# static_dir: auth
# login: required
# secure: always
#
## Application administrators
# – url: /admin
# static_dir: admin
# login: admin
# secure: always
libraries:
- name: webapp2
version: “2.5.1″
This file can also be downloaded:
http://static.kdaweb.com/static/example-app.yaml
Notice that this file is very similar to the original that the Google App Engine Launcher provided.
The one edit that you absolutely need to make for your web site is to change the first line. You need to change the application listed to the name of your application.
So, if your application is called “foobar4000″, you need to change
application: kdawebtest01
to:
application: foobar4000
Save your file. If you used the downloaded version, you’ll want to make sure that you rename it to “app.yaml”.
Step 6: Test your web site
To test your web site, open the Google App Engine Launcher and select (left click) your application, then click “Run” button. An orange clock icon will appear to the left of the application’s name; after a few seconds, the icon will turn into a green icon that looks like the “Run” button.
If, instead, the icon turns into an exclamation mark on a yellow triangle, something didn’t load properly. This is probably something wrong with the app.yam file that we’ve just edited. Clicking on the “Logs” button in the Google App Engine Launcher will open a window with the logs; you can use these logs to see what the problem was.
If your application loaded properly, then your web site is now running on your local computer.
Google App Engine Launcher
While running on your local computer, only you can access it. Your web site can not be viewed across the network.
To view your web site with your web browser, you can select your application (left click on it) and then click on the “Browser” button. Alternatively, you can see what port the server is running on (the right-most column) and point your web browser to:
http://localhost:port/
Where “port” is the port that the Google App Engine Launcher reports the web site is running on. So, if the Google App Engine Launcher says that your web site is running on port ’8080′, then you would use a web site address of:
http://localhost:8080/
In testing your web site, you should make sure that all of your links, images, stylesheets, etc. all work from every page.
Step 7: Deploy your web site
From the Google App Engine Launcher, select (left click) your application that you want to make live on Google App Engine. Then, click on the “Deploy” button. This will tell the Google App Engine Launcher to deploy your web site,
The first time you use the “Deploy” action, the Google App Engine Launcher will ask you for an email address and a password. These are the email and address that you used when you setup your Google App Engine account.
Deploying your web site with the Google App Engine Launcher
After you successfully authenticate, the Google App Engine Launcher will copy your web site from your local system to Google App Engine. The Google App Engine Launcher will open a window and will spit out a bunch of text. If everything goes well, this text is safe to ignore. If, however, you run into issues this text will start you in the right direction towards fixing the problem.
The deployment process may take a while to complete depending on how many files you’re deploying and how large they are. The process will take almost a minute even for a tiny web site, so be prepared to multitask.
Once the process completes, the last line of text in the window will read:
You can close this window now.
Go ahead and close the window.
Step 8: View your web site
To view your web site online, open your web browser and point it to:
http://<your_application>.appspot.com /
with <your_application> replaced by the actual name of your application. So, for example, if your application was named “foobar4000″, you would go to:
http://foobar4000.appspot.com/
Step 9: Test your web site
Like with your development site, you should check every link on every page to make sure that each page works correctly.
Step 10: Declare victory!
Your web site is now hosted on Google App Engine! Congratulations!
Where to go from here
There are several additional topics that you may wish to consider as your development needs grow.
Custom Domain Mapping
You may wish to consider creating a “domain mapping” so that you can use your own domain name (i.e. not just something.appspot.com). Google App Engine supports this functionality. Look for a coming article on how to setup your own domain name mapping for your Google App Engine hosted web site!
Automating Deployments to Google App Engine
Google provides a UNIX / Linux SDK Python (Software Development Kit) that can be used to deploy applications to Google App Engine from the CLI (Command Line Interface) called “appcfy.py” This tool allows you to do everything that the graphical Windows tool can, but from the command line. This includes deploying your application to Google App Engine. As a result, it’s possible to use cron to automate the deployment of your web site. So you know, you can deploy your web site up to 1,000 times per day. Look for a coming article on automating your Google App Engine deployments!
Migrating Non-Static Content to Google App Engine
Many web sites rely on server-side scripting languages (like PHP, ASP, ColdFusion, and more) to deliver content that’s not necessarily static, but isn’t explicitly tied to the current browsing session. A good example of non-static content that’s not tied to a browsing session is if your homepage may display a calendar of events for that day. Content that’s tied to a browsing session includes pages that require login to deliver personalized content (such as the authenticated user’s email). For many of these sites, it may be possible to render your web site to a static form that can be hosted on Google App Engine. Check out Using WGET To Mirror Websites for more information.
Secure your web site with encryption and login requirements
You may have content that you would like to have delivered securely or which you would like to require a login in order to access. Google App Engine provides mechanisms to do the heavy lifting for you. Look for a coming article on how to secure your web site!
Setup caching to improve web site load times further
Google App Engine allows you to specify a cache duration for content on your web site. Doing so allows your users to store copies of certain files (images, stylesheets, JavaScript resources, etc.) in their web browsers instead of downloading them repeatedly for every page they view. Look for a coming article on setting up caching for your web site!
