前端库

unpkg.com

七牛云

直传

目前(2016)公司项目图片资源所用的CDN为 七牛云。但是为了防止文件命名问题（包含重命名，文件重复上传），采用的方案是：

1. 用户先上传图片到 自己的WebApp服务器

2. 自己的WebApp服务器上：

   1. 计算文件MD5，
   2. 将其MD5值作为CDN上的文件名，并上传
   3. WebApp服务器上并不存储文件内容，仅仅在数据库内只保留元信息。

3. Web前端再通过JS，使用七牛云的图片处理API修改URL参数来适应不同的手机屏幕。

缺点：时不时被反馈用户上传慢，因此在考虑使用浏览器端计算文件MD5值。

七牛云的直传API 支持通过魔法变量来自动使用七牛云ETAG $(etag) 来设定文件名。

虽然七牛云ETAG不是MD5值，也不是标准的SHA1算法，但也能起到防重复上传的作用。但是仍有一下问题：

1. 用户只有将图片上传到七牛云服务器上之后，才知道是否重复上传了，可能会白白浪费带宽。
2. 使用七牛云ETAG作为文件名的话，将绑定到七牛云上，不利于更换其他API，能自己指定文件名防止重复的话最好。
3. 七牛云ETAG类库的JS版本，只能运行再Node环境下，如果要其运行再浏览器环境下，需要使用browserify，生成的JS文件在未压缩前有500K+, 即便使用 uglify-js 压缩了， 也仍然有 400K+。因此，并不太实用。

搜索了一下，可用的相关JS类库有 sjcl、 crypto-js、 SpartMd5，但最推荐的当属 Web Cryptography API，可以在MDN上看到详尽的API ， 在CanIUse网站上可以看到，除了IE旧版本之外，其他的基本都支持了。

但是 Web Cryptography API 不支持 MD5的方式。

对应微信内的APP不支持直接文件上传，该如何对应CDN直传？

安卓版微信文件上传提示只能上传SD卡内容. 图片上传的话，只能使用 微信JS-SDK 先上传到微信的服务器上， 在通知服务器去下载。 如果要上传其他类型文件就不行了。

七牛云支持fetch API 来处理。

阿里云OSS

阿里云OSS 配合其 CDN 服务，是已经在用的网站静态资源网站存储的方案。

支持通过URL进行图片处理。但是没有类似七牛云的fetch 的 API。