beach adventure
chithtra kathawa
Introduction
A lot of information can be found on the internet about hosting static websites on Amazon S3. Static websites have regained popularity, because they are easy to maintain and will handle a large volume of traffic. To give an example: Obama’s election campaign in 2012 used a static website to handle the enormous number of visitors. S3 already exists for a while therefore it makes sense that quite a few has been written about it. However, Google now offers a very good alternative with Google Cloud Storage. As usual, Google’s documentation is a bit technical and there’s little to no information to be found on the internet about setting up a website on Google’s infrastructure. In this article I show you how you can have your website online with Google Cloud Storage in five steps.
What do you need?
- a Google account (like what you log into Gmail with),
- a credit card and
- a website with at least one
index.htmlfile and preferably also a404.htmlfile.
The website can not use a database or (CGI) scripts written in something like PHP or Perl. Javascript is obviously no problem as that’s located on the client side.
Building blocks of Google Cloud Storage
Before we get started with Google’s Cloud Storage it’s good to introduce some terminology. The building blocks of Cloud Storage are projects, buckets and objects. Every project can hold one or more buckets and in turn every bucket can hold one or more objects. Summarized:
Projects > Buckets > Objects
Objects are generally just files. A collection of files is stored in a bucket and every bucket belongs to a single project. In Google Cloud Storage, projects are mostly used for bookkeeping purposes such as billing. This means that the storage costs of all buckets within a project are grouped. This is handy if you want to, for example, keep the costs of private projects and projects related to your business separated.
Google Cloud storage also offers a few tools for using the service:
- the Google API Console,
- the new Google Cloud Console which used to be the Cloud Storage Manager in the API Console, and
- the command line tool gsutil.
You use the API Console to create new projects and to enable billing. You use the Cloud Console to manage buckets and objects (upload, delete, set access rights, etcetera). These two consoles can be accessed online with a browser. The
gsutil is a program which you must install on a local machine. Also, you must grant gsutil access or ‘authenticate’ it and your computer on Google Cloud Storage after installing the program.Action plan
Do you have a Google account, a credit card and an HTML website? If yes, then follow the five steps below to get your website online.
Step 1: create a new project or select an existing one
Go to the Google API Console, create a new project and give it a name. The name of the project has no implications for the website itself and you can always change it later so don’t spend too much time thinking about a suitable name. While you create the project, activate Google Cloud Storage as a service. Do you already have a project that you want to use? Then go ahead and select it. Just make sure Google Cloud Storage is activated as a service.
Once you have created a new project, you must enable billing for it in the API Console. You can only enable billing with a credit card and billing is required to use Cloud Storage in your project.
Step 2: create a bucket
As soon as you have a project, you can create a new bucket using the Google Cloud Console. By default, buckets are created in a data center in the United states and it’s not possible to select Europe as a location using the Cloud Console. If you want this (and this is highly recommended if your target audience is primarily located in Europe), then you must use
gsutil.
Be aware that every bucket must have a unique name within all of Cloud Storage. Two different users can therefore not create buckets with the same name. See Bucket Name Requirements for more requirements that the name of a bucket must adhere to. In order to host a website it is anyway required that the bucket be given the domain name of the website as it’s own name. Here we use the website ‘www.example.com’ as an example so that will also be the name of the bucket. Note that the prefix ‘www.’ is mandatory if that’s how visitors will type in your URL to get to your site!
With the next command we create a bucket with the name ‘www.example.com’ in a data center located in Europe:
gsutil mb -l "EU" gs://www.example.com
Check this with the following command:
gsutil ls -L -b gs://www.example.com
Next to
LocationConstraint it should say EU. Refresh the Google Cloud Console and the new bucket should appear. For my website this looks like the following:
If you’ve accidentally created a bucket via the console and the bucket is located in the US, you can simply delete it and create a new one using
gsutil like above.Step 3: upload your website
Go to the root of your local website (for example the
_site folder if you are using Jekyll or the good old public_html folder on an Apache server) and copy all files to the bucket:gsutil cp -R * gs://www.example.com
The
-R flag ensures that all (sub)folders and the files in these folders are copied.Step 4: configure your bucket to behave like a website
Now that all files are on Cloud Storage the bucket must be configured to act like a web server. Read the documentation on Website configuration for more information.
First we configure the bucket as a website by setting
index.html as the main page and 404.html as an error page:gsutil setwebcfg -m index.html -e 404.html gs://www.example.com
Something that’s missing in the documentation, but which is necessary, is to make all files readable for everyone:
gsutil -m setacl -R -a public-read gs://www.example.com
Go ahead and make the files public by default, otherwise you have to do the above every time you upload new files or change existing files:
gsutil setdefacl public-read gs://www.example.com
By the way, it is also possible to do this while you are copying files with the
-a flag:gsutil cp -R -a public-read * gs://www.example.com
Remember that changed files may not immediately propagate online, because Cloud Storage uses a cache with a default duration of one hour.
Step 5: configure DNS
Change the CNAME record for your domain name to point to
c.storage.googleapis.com. You have to do this via the registrar for your domain. Now it should be clear why the name of the bucket must be exactly the same as your domain name: Google connects the DNS record to the correct bucket!
Post a Comment