This guide walks you through setting up a free bucket to serve a static website through a custom domain name using Google Cloud Platform services.
Sign in to Google Cloud Platform, navigate to Cloud DNS service and create a new public DNS zone:
By default it will have a NS (Nameserver) and a SOA (Start of Authority) records:
Go to you domain registrar, in my case I purchased a domain name from GoDaddy (super cheap). Add the nameserver names that were listed in your NS record:
PS: It can take some time for the changes on GoDaddy to propagate through to Google Cloud DNS.
Next, verify you own the domain name using the Open Search Console. Many methods are available (HTML Meta data, Google Analytics, etc). The easiest one is DNS verification through a TXT record:
Add the TXT record to your DNS zone created earlier:
DNS changes might take some time to propagate:
Once you have verified domain, you can create a bucket with Cloud Storage under the verified domain name. The storage class should be “Multi-Regional” (geo redundant bucket, in case of outage) :
Copy the website static files to the bucket using the following command:
1 | gsutil rsync -R . gs://www.serverlessmovies.com/ |
After the upload completes, your static files should be available on the bucket as follows:
Next, make the files publicly accessible by adding allUsers entity with Object Viewer role to the bucket permissions:
Once shared publicly, a link icon appears for each object in the public access column. You can click on this icon to get the URL for the object:
Verify that content is served from the bucket by requesting the index.html link in you browser:
Next, set the main page to be index.html from “Edit website configuration” section:
Now, we need to map our domain name with the bucket we created earlier. Create a CNAME record that points to c.storage.googleapis.com:
Point your browser to your domain name, your website should be served:
While our solution works like a charm, we can access our content through HTTP only (Google Cloud Storage only supports HTTP when using it through a CNAME record). In the next post, we will serve our content through a custom domain over SSL using a Content Delivery Network (CDN).
Drop your comments, feedback, or suggestions below — or connect with me directly on Twitter @mlabouardy.
