How to Cache a Static Site on Alibaba Cloud Function Compute Using CDN

Introduction

When accelerating a static website hosted on Alibaba Cloud Function Compute with a CDN, special configuration is required to ensure that the CDN caches the content instead of fetching it from the origin on every request.

1. Assign a domain and create a CNAME record

Bind a dedicated domain (e.g., blog.xxx.dengchao.fun) to the Function Compute instance so that end users can access the site via the public domain blog.dengchao.fun.

2. Add a custom domain and configure routing

In the Function Compute console, add the assigned domain under Custom‑Domain . HTTPS is not enabled because Function Compute does not yet support SSL protocol version configuration.

3. Create a CDN acceleration domain

In the CDN console, create a new acceleration domain (e.g., blog.dengchao.fun) and select the origin type Function Compute Domain . The business type selection does not affect performance.

Because the custom domain on Function Compute does not support HTTPS, set the origin port to 80.

4. Add a CNAME record for the CDN acceleration domain

After saving the origin settings, Alibaba Cloud provides a CDN provider domain. Create a CNAME record that points your acceleration domain ( blog.dengchao.fun) to this provider domain.

5. Configure CDN cache

5.1 Add a cache expiration rule

Set a rule that caches all files under the site root for 1 day via the CDN cache‑management page.

After a period of operation, the cache‑hit rate remained low. Inspection of the origin response headers showed that the origin returned Cache-Control: public, max-age=0, which prevents caching.

5.2 Fix the Cache-Control header

Two approaches were considered:

Modify the origin HTTP server : Changing the website-fc plugin’s Express server would require patching the plugin source, which may be updated frequently, leading to maintenance overhead.

Configure CDN to delete the header : Alibaba Cloud CDN offers a “Configure Origin HTTP Response Header” feature that can strip the Cache-Control header from the origin response.

The CDN feature was used to remove the unwanted header.

6. Effect comparison

For a low‑traffic blog the impact was minimal, but a higher‑traffic site showed clear improvements: after removing the Cache-Control header, origin traffic dropped significantly and both byte‑hit and request‑hit rates increased.

Conclusion

After configuring the CDN acceleration domain and appropriate cache‑expiration rules, always verify the origin’s response headers. If the origin already supplies caching directives, adjust them either on the origin server or via CDN settings. Refer to the official documentation for Cache‑Control ( https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Cache-Control ) and Alibaba Cloud CDN cache configuration ( https://help.aliyun.com/document_detail/27136.html , https://help.aliyun.com/document_detail/155769.html ) to avoid common pitfalls.