昆山农商行个人手机银行app前端图片优化方案

项目：昆山农商行个人手机银行app
日期：2017-06-05
版本：v1.0
作者：longbo
需求：优化前端图片请求，减少app流量消耗

前端请求的图片类型

1. 营销类宣传图片、广告：例如首页的轮播banner；
2. 应用图片，例如首页的九宫格图标；

所有图片都可以归纳为这两类。

• 第1类需要经常变动，且必须允许业务人员直接通过后台管理端变更。
• 第2类不需要经常变动，只有应用需要功能性的迭代时，通过升级资源包发布新版本的方式来变更。

这两种图片有各自不同的优化方式

优化1类图片

1. 原有的方式不变，即先发交易请求图片访问路径。再展示图片；
2. 图片需部署在图片服务器上并在服务器设置Etag缓存；
3. 手机银行的资源包缓存机制与webview自身的Etag缓存可以兼容共存，如设置成功，手机端访问图片将收到服务器返回的304响应码，从而转为从本地浏览器缓存获取图片，节约客户流量。

优化2类图片

1. 将图片全部转移至pmobile项目，例如“首页九宫格”、“全部功能”的小图标;
2. 打包发布后，pmobile资源包将包含这些2类图片，原生客户端会拦截资源包内已有的请求，做到0流量消耗；

完成