Preface

In the previous article, I migrated the navigation page of www.tangwudi.com to Cloudflare Pages (see article:Home Data Center Series: Building a New Home for the www Navigation Page Using GitHub + Cloudflare Pages), but this method is not suitable for the www homepage corresponding to my ICP-filed domain name. This is because when Tencent Cloud CDN uses domestic acceleration traffic packages, pointing the origin host to the domain name on Cloudflare will cause issues (although adding Tencent Cloud's origin IPs to the whitelist on Cloudflare is possible, the actual experience is very unstable. Moreover, this practice links the domestic ICP-filed domain name with the foreign domain name actually in use, which carries risks).

Therefore, I had to research domestic free static page hosting solutions similar to GitHub Pages and Cloudflare Pages. However, after looking around, I found that there are no completely free ones. Gitee Pages is an option, and although there are limits on maximum capacity and single file size, this doesn't affect me much. The most annoying part is that it requires real-name authentication and is very sensitive to uploaded content (every update requires re-review, which easily leads to deployment failures; what if I want to study static blogs in the future?). Furthermore, custom domains and automatic deployment both cost money, which sounds very troublesome. Especially after experiencing the free GitHub + Cloudflare Pages, my standards have risen significantly, and I just can't look at these options.

So, if there is no good free solution (which is indeed a bit of a luxury in China), is there a solution that costs just a little bit of money? Yes, there is: the combination of Tencent Cloud CDN + Tencent Cloud COS. The annual cost ranges from 9.77 to 29.77 RMB (depending on whether you already have an annual Tencent Cloud CDN traffic package; since I already bought one, it only costs me 9.77 RMB). This gives you a 1-year COS storage with 10GB of space, without any messy restrictions. If you haven't purchased a Tencent Cloud domestic CDN package, buying a 1-year 100GB traffic package is only 20 RMB, so the total is 29.77 RMB. For 29.77 RMB, you can't go wrong; you get a static page hosting service with 10GB of space, which is extremely cost-effective. The only barrier is that it requires an ICP-filed domain name.

I happen to have one, so I ultimately chose this solution.

Configuration Process

Prerequisites: An existing domain name and completed ICP filing

If you don't have a domain name yet, you need to choose a domain registrar to purchase one (or get a free one if you can). It doesn't have to be Tencent Cloud's DNSPod, but the ICP filing step cannot be skipped because the domains accelerated by domestic CDN providers must be ICP-filed. For example, when adding an acceleration domain in Tencent Cloud CDN, if it is not an ICP-filed domain, it will display as follows:

Note: Actually, if your domain name is not ICP-filed but you have this need, you can just use GitHub Pages, Cloudflare Pages, etc., and you don't need to read this article.

Create a Bucket in Tencent Cloud COS

Follow the image process below to create a bucket in the Tencent Cloud Object Storage (COS) console:

Upload Web Directory

P.S. Why is it so troublesome? Because uploading a compressed package directly and then extracting it seems to cost money... and uploading files only allows uploading single files, which forced me to go through this hassle. Actually, you can use tools like COSBrowser to upload, but currently, I don't have much demand for COS other than hosting a static homepage, so I didn't bother. I might play around with it in the future when I have domestic testing needs.

Note: Actually, if you use Tencent Cloud CDN later, the following steps to enable the static website feature do not need to be configured. Since they are both Tencent products, they can communicate via the "default domain name" (internal domain name). However, if you use a non-Tencent Cloud CDN, you will need to perform the following configuration, so I will still write down the steps.

Enable static website hosting:

The next section will use the concept of "default domain name". This default domain name is actually the request domain name on the page of the last step of creating the bucket, which can also be seen in the following location:

CDN

There are two ways to publish the bucket content to Tencent Cloud CDN:
Custom CDN acceleration domain name in the bucket

The subsequent operations are the same as the general steps for adding a Tencent Cloud CDN acceleration domain name, so I won't repeat them. After adding, you need to remember the CNAME address in the red box:

The CNAME address is required for subsequent domain name resolution configuration. However, if you are using a domain name hosted on Tencent Cloud's DNSPod, you can automatically add the CNAME with one click.

Domain Name Resolution

This step is simple: just add a CNAME record in the console of your domain registrar pointing to the CNAME address from the previous section. Taking Tencent Cloud DNSPod as an example:

This way, visits to abc.example.com will be sent to the CDN for processing.

Summary

Using Tencent Cloud CDN + Tencent Cloud COS for static page hosting has very prominent advantages and disadvantages:
Advantages

• COS itself is cheap, and the biggest expense is the cost of the storage space itself.
  
  
  
  A standard storage capacity package of 10GB for one year costs only 9.77 RMB. With 10GB of space, what page can't you fit? And if you are a new user, there is also a 180-day free trial of 50GB space.
• Combining it with Tencent CDN saves public network traffic fees.

Tencent COS originally has public network traffic fees (which are expensive, and due to a 2-hour billing delay, if you directly use COS to publish public network applications and encounter hotlinking or traffic abuse of COS resources, you might lose thousands or tens of thousands of RMB in a few hours) and read/write request fees. However, because it is paired with Tencent CDN, both of these fees are saved. This is because CDN origin-pull from COS is an internal network request and is free of charge, so you only need to pay for the CDN traffic itself. Many people already have CDN traffic packages (like me), and the price is very low, costing only 20 RMB for 100GB per year:

• By default, COS lacks convenient file upload/download and basic file management functions.

Therefore, if you need to perform frequent file operations on COS, you still need to map the COS bucket to your local PC or use tools like COSBrowser for management.

• COS cannot perform version control.

If this static page changes rarely, it's fine (like me, just putting up a static page to pass the ICP filing inspection). But if it is modified frequently, having to determine what was changed and selectively upload files every time is very troublesome. Therefore, it is best to combine it with other continuous integration projects, using COS only as the final storage.

In addition, you can configure some protective settings on Tencent Cloud CDN based on the characteristics of your deployed application (such as preventing malicious traffic attacks). For example, since I am only hosting a page to pass the ICP filing inspection, many parameters are set very strictly, as it is only for inspectors to see, including:

There are many other options that can be used for security protection; you can configure them according to your actual situation. In the domestic environment, being able to achieve static page hosting with such a small amount of money is, in my opinion, quite acceptable.

Subsequently, I migrated some other static sites used domestically to COS. So far, all my static sites, whether facing domestic or foreign audiences, are hosted in the cloud. It is indeed very convenient. Next, I will also set up a static blog, export articles from WordPress to the static blog, and host it directly online. It's perfect as a redundant site, much more convenient and hassle-free than using a Tencent Cloud server to make a mirror site.