Setting up a static website using Google Cloud Platform

Note: This guide is based on assumption that you already have a registered custom domain.

To summarise the steps that will follow, we will be setting up a Custom Domain CDN for Google Cloud Storage using a load balancer to serve our site’s content using HTTPS. Skip the load balancer part and just create a CNAME record pointing to your GCS bucket if serving over HTTP works fine for you. Most of the hassle is mostly because GCS buckets don’t allow serving content over HTTPS.

First register your domain with google cloud DNS. It involves associating your domain to a resource record that helps map your domain to the IPv4/IPv6 address of the computer hosting your domain.

Setup a cloud DNS management zone and a resource record for your domain. Refer the GCP’s Quickstart guide for the same.

Note: CNAME, if required, can also be setup from the same location on google cloud console. Refer the above link for the same.

Next verify your ownership of the domain with google

Note: This is required if you’re planning to setup a domain-named bucket for your website, i.e. a bucket name that matches your domain name. Also if you intend to host your website using cloud storage bucket, this is the recommended way.

1. Go to GCP’s Search Console and fill in the domain or subdomain you want to authorise your ownership for.

• From the popup that appears next, copy the generated key.

2. Go to Cloud DNS under Network Services on GCP and select the zone for your domain that was setup previously.

3. Add a TXT record in the record set of your zone and paste the auth key copied in step 1.

4. Go back to GCP’s Search Console and press the verify button on the popup for authentication.

Setup cloud storage bucket to host the contents of your website

1. Open the GCPs Cloud Storage Browser and create a storage bucket (preferably with the same name as your domain/cname) for your website. Follow the instructions to choose the desired configurations for your storage bucket.

Note: When you create a storage bucket with the same name as your website, storage manager tries to map the storage bucket to your registered domain. If not verified as in the previous step, the bucket creation might throw error.

2. Upload files to the storage bucket and set the MainPageSuffix and NotFoundPage properties on the bucket.

Note: NotFoundPage is not really necessary if you are handling invalid paths in your app but you must set the MainPageSuffix for the bucket to know the entry point for your website.

Testing deployment

Hit your domain to check if the file specified as ***MainPageSuffix*** is loaded.

Also check if the CNAMEs (if added) work fine.

Setting up custom domain CDN for Google Cloud Storage

1. Go to Load Balancing section under Network Service for your project on GCP.
2. Create new HTTPS load balancer and click on the configuration button.

3. In Backend configuration, select option to create a new backend bucket.

• Provide a name for the load balancer and select the desired cloud storage bucket from the bucket browser.
• Check the Enable Cloud CDN option and click create.

4. Skip the Host and path rules section for now unless required.

5. In Frontend configuration, select HTTPS protocol.

• From IP address drop down select create IP address option and enter a short-relevant name in Reserve a new static IP address popup.

• Since we’re creating a load balancer that handles HTTPS traffic, select Create new certificate option under Certificate header.

• Enter a short-relevant name for the certificate in the certificate configuration form and select Create Google managed certificate in Create mode.
• Under Domains enter the custom domains or CNAMEs that you want to authorise and click on the Create button.
• Finalise the Frontend configuration by clicking on Done button.

Note: Can optionally add another front-end at this point if needed, for example, to allow HTTP.

6. Review all configurations and click Create button. The load balancer and SSL certificate provisioning will start.

Note: It may take some time for the DNS changes to take effect around the world as the records are updated everywhere.

As a final step, under the Cloud DNS tab of Network services on GCP follow the steps below:

1. Create an A type resource record and add the IP address of the load balancer from the previous step.
2. Create a CNAME resource record with a sub domain and CNAME as the domain name specified in step 1.

Hitting the domain create in step 2 under previous heading should redirect you to the default page (if set) of the backend bucket.

And…that’s about it. Thanks for reading through. Go ahead and hit the clap button to show you liked this post. Go ahead and hit follow to show you would like more posts like this one :)

Cheers!!