巧用CDN加速对象存储 提高网站访问速度

网站优化/运营
462
0
0
2022-06-01
标签   CDN

巧用CDN加速对象存储 提高网站访问速度

刚建立一个汽车资讯车友交流网站。主站用Php搭建,有10GB的图片素材,部分JS文件。目前购买一台ECS放置所有程序代码,并在ECS上安装MySQL数据库。随着用户访问量的不断增长,不少用户反映,访问网站的速度越来越慢,图片加载慢,网站响应慢。网站技术人员也发现用户上传的图片越来越多,快超过 1TB了。

研究了阿里云提供的服务发现,可以利用 OSS 和 CDN 可以对网站进行架构优化,实现上图提到的动静分离的产品架构,提升用户访问体验,同时成本也在可控的范围内。具体的解决方案和步骤如下:

1.对ECS上的网站程序进行整理,把动态程序部分和静态部分分不同的目录管理起来。

1)建立Images目录,放置所有网站高清素材图片;

2)建立Javascript目录,放置所有的JS脚本;

3)建立Attachment目录,放置所有用户上传的图片和附件。

2.进行 CDN 加速。

1)进入到 OSS控制台首页,单击 CDN加速 。

2)单击 新建Bucket。

巧用CDN加速对象存储 提高网站访问速度

3)根据所在的ECS区域选择 bucket 所在区域,权限选择 公共读,bucket 名称与ECS上新建的目录的名称对应,比如 “acar-image-bucket”,单击 提交 。

4)输入 image.acar.com 作为网站高清素材图片的加速域名,单击 下一步。

5)选择默认的自动添加阿里云解析,单击 完成。

巧用CDN加速对象存储 提高网站访问速度

3.上传文件,体验加速效果。

1)单击 立即上传文件,体验加速效果 。

2)把在第 1 步中建立在 ECS 上的 Images 目录下的所有图片文件上传到这里(acar-image-bucket 下)。可以使用 OSS 客户端工具更加方便灵活的完成图片的上传。

3)单击列表中已经上传文件的 获取地址,就能获取到该文件的 CDN 加速的访问地址,通常为您输入的加速域名+’/’+’文件名’的格式。

4)逐一完成图片文件的上传。

4.按照前 3 步的示意,把其他两个文件也通过 CDN加速 的方式上传,分别建立“acar-js-bucket”和”acar-csimages-bucket”两个使用CDN加速的OSS bucket。

5.在原本ECS系统中,找到原本访问静态文件的代码,把访问URL修改为加速访问的地址。以后用户访问您的网站的静态文件就全部通过OSS+CDN的方式访问,不再占用ECS的资源。

需要注意的是: 如果想把用户上传的文件自动同步到“acar-csimages-bucket”中,可以参考 OSS 相关 SDK 和 API 的 PutObjcet 部分,实现代码级别自动上传。

CDN自动刷新

如果使用了阿里云的 CDN 并绑定了加速域名回源到 OSS,可以使用 OSS 的 CDN 缓存自动刷新功能,此功能在覆盖写的情况下(包括覆盖一个已有的文件、删除一个已有的文件),OSS 会主动刷新 CDN,回源到 OSS 获取覆盖后的文件,用户不需要显式调用 CDN 的刷新接口。刷新的 URL 规则如下:

加速域名 + / + Object

例如绑定的加速域名是image.acar.com,如果这个域名绑定的 bucket 覆盖上传了一个文件test.jpg,则 OSS 会刷新掉image.acar.com/test.jpg这个URL,刷新生效的时间以 CDN 保证的刷新生效时间为准,一般在十分钟以内。