The way to host the website with Google Drive
You can use Google Drive as like a hosting server with DriveToWeb. It only hosts the static files but it seems to create a small website and blog.
Prepare the Google Drive
Store the files to test
Create the directory at the root of your Google Drive. This directory name is the URL to access it (for example, www.example.com).
Then, create index.html on the local PC, and upload to the directory.
Publish settings
It is necessary to set the general access option of the share to "Anyone with the link".
Enable to host with Google Drive
Go to https://drv.tw and select "Host on Google Drive". The URL is created when you allow DriveToWeb to access your Google Drive. Then, the web page is displayed using index.html when access to this URL.
DriveToWeb provides an SSL certificate from Let's Encrypt and allows you to connect over HTTPS. However, you cannot use a custom domain because it is a domain-validated certificate.
Configuration for the custom domain
The domain of the web pages on DriveToWeb is randomly generated. You can enter the string, that you would like to use, as "Your site name" with at least 22 characters.
e.g. https://xxx.on.drv.tw/www.example.com/
If you want a different URL, it is necessary to register your own domain with the domain name registrer service and set the DNS record.
Record | value |
---|---|
CNAME | xxx.on.drv.tw |
According to the official documentation, you don't need to set the TXT record. And it describes that it takes max 72 hours so as to access your site with your custom domain. In my case, I was able to access my test site after about an hour.
Reference:Using a custom domain name :: DriveToWeb Docs
Connect over HTTPS
The SSL certificate will not be used if you only set the DNS record with your domain. In order to enable HTTPS connection, you need to access via CDN (Content Delivery Network).
CDN caches your web content and speeds up its delivery, so the web page doesn't change immediately when you replace the content.
The documentation recommends Cloudflare, but I used Amazon CloudFront instead. CloudFront offers the free usage tier, so it's usually free for personal use.
Reference: Amazon CloudFront CDN - Plans & Pricing - Try For Free
Issue the SSL Certificate
Issue the SSL certificate of your custom domain using AWS Certificate Manager (ACM). ACM provides the certificate free of charge. In CloudFront, you can only use the certificate that is issued in us-east-1 region (N. Virginia).
When you issue the public certificate, you need to verify your domain ownership in the following ways:
- DNS Verification
- Email Verification
In my case, I verified through the DNS record. Please refer to the official documentation for details.
Reference: Issuing and managing certificates - AWS Certificate Manager
Configuration for Amazon CloudFront
Option | Value |
---|---|
Origin domain | xxx.on.drv.tw |
Protocol | HTTPS |
Origin path | /www.example.com/ |
In settings of Custom SSL certificate - optional, enter the certificate you issued and alternate domain names (your custom domain).
Configuration of DNS
When using CDN, it is necessary to set the TXT and CNAME records of www.example.com. TXT is the domain of DriveToWeb and CNAME is the distribution domain name of CloudFront.
Record | Value |
---|---|
TXT | DRVTW=xxx.on.drv.tw |
CNAME | yyy.cloudfront.net |
Then, you can use the hosting of Google Drive over HTTPS.
Lighthouse score
When I deployed the template of Next.js, it showed the following score by Lighthouse. However, I think it was actually slower than below.
Mobile
Reported by Lighthouse
Mobile
Reported by Lighthouse
P.S.
It appears that Microsoft Drive can be used as a hosting server. Google Drive ended web hosting around 2015 due to the expansion of functionality of GCP and Firebase.