我目前开发的平台的前端静态资源是使用 go embed 机制内嵌到后端服务中,
当访问量比较大的时候,服务器会有比较大的 IO 消耗,因此进行前端静态资源分离。

方案一 需要代理服务器


                                                    /*.(html|js|css)    ┌───────────────┐
                                                                        │               │
                                                            ┌──────────▶│      CDN      │
                                                            │           │               │
                                                            │           └───────────────┘
┌──────────┐    example.com     ┌───────────────┐           │
│          │                    │               │           │
│   user   ├───────────────────▶│  proxy server │───────────┤
│          │                    │               │           │
└──────────┘                    └───────────────┘           │           ┌───────────────┐
                                                            │           │               │
                                                            └──────────▶│   api server  │
                                                                        │               │
                                                           /api/*       └───────────────┘

调整事项:

优点:

  1. 不太需要调整已有的代码

缺点:

  1. 需要一个代理服务器,同样有一定的压力

方案二 不需要代理服务器,入口文件放 CDN


┌──────────┐    example.com     ┌────────────┐         /api/*        ┌───────────────┐
│          │                    │            │                       │               │
│   user   ├───────────────────▶│    CDN     │──────────────────────▶│   api server  │
│          │                    │            │                       │               │
└──────────┘                    └────────────┘                       └───────────────┘

调整事项:

优点:

  1. 加快用户访问速度
  2. 方便部署回滚,避免 CDN 缓存问题

缺点:

  1. 如果接入一些第三方登录,可能会有跨域问题

方案三 不需要代理服务器,入口文件不放 CDN


┌──────────┐     example.com      ┌───────────────┐
│          │                      │               │
│   user   │──────────┬──────────▶│   api server  │
│          │          │           │               │
└──────────┘          │           └───────────────┘
                      │
                      │
                      │           ┌──────────────┐
                      │           │              │
                      └──────────▶│    CDN       │
                                  │              │
                /*.(js|css)       └──────────────┘

调整事项:

优点:

  1. 加快用户访问速度
  2. 方便部署回滚,避免 CDN 缓存问题

缺点:

  1. 需要等 CDN 上传成功才可以提供服务