我喜欢你>_<

核心架构思考#

数据的单一来源 与 规避代码坏味道 构成了前后端规约及业务联调过程中的准则。如果在前端组件中随处将 CDN 协议及域名写死（例如 http://cdn.xxx.cn/...）进行访问和展示的话，将会极大地增加工程长期维护的包袱。

核心准则：数据库存“相对路径”获取物理灵活性，前端在运行时拼接“绝对路径”满足渲染需求。 这种架构隔离方式，使得资源域名发生变化时，只需在基础配置常量处修改一层即可，业务层的多处调用完全解耦。

知识内化与经验总结#

1. 接口契约（api.d.ts）的边界与作用： 契约文件不仅仅是后端服务提供的“调用说明书”，更是自动化的“前置保镖”。配合 TypeScript 体系，可以在开发或编译时便能规避不规范或者突变的入参类型，提前防御潜在的调用灾难。自动生成的请求类型层更是能避免双端沟通的滞后问题。

2. 前端云存储直传流程解析： 相比由后端接收资源流再传输至 OSS/COS 节点的方式，前端直传规避了由于后端宽带和业务阻塞导致的上传瓶颈。具体的流转时序如下：

   • 请求凭证（后端）：生成包含上传有效期的 STS“通行证”（临时密钥），不承担文件实体流转（节省带宽成本）。
   • 发起上传（前端）：附带 STS 凭证，依照特定签名将表单格式的二进制文件推至腾讯云（COS 等）。
   • 返回元数据（云存储）：下发成功回执，返回文件上传最终落地的路径和名称。
   • 信息闭环：前端将纯相对路径推给业务后端落库。

3. CDN 存储最佳实践： “相对路径”是核心特征，“绝对路径”是端态映射。 在数据库底层维护如 cat/avatar/xx.jpg 的纯相对路径；在前端渲染或网络请求层，基于全局通用函数诸如 getCDNUrl(path) 做协议或域名的动态组装。这种范式让基础设施或者提供商在未来具备无痛切流和迁移的能力。

总结#

不管是“云开发机制”还是“CDN全链路”，其底层拆解后依然是受限于计算机网络通信与架构设计的字符串流转。通过剔除工程当中的“代码坏味道”，技术解构所带来的架构清爽度才是前端工程化的魅力所在。