1.这什么东西-MaterLiu.doc

手机QQ页面本地化 解决方案及接入方式，Android/iPhone QQ v4.3+ 1.这什么东西？ 简单来说，就是允许你的网页静态资源（html, js, css, 图片等）永久缓存到手Q本地的一套机制，允许用户在网络慢甚至网没络的情况下都可以访问你的页面。另外还提供升级机制，允许你通过上传更新包到管理后台来更新手Q的本地资源。重要的系统模块还可以随手Q安装包打包一份静态资源，保证第一次访问页面也能直接快速的从本地加载。 [图1] 手机QQ页面本地化整体架构简介 2.这东西能干嘛？ 能让用户爽！首先是加载速度快，因为缓存后的资源文件都在本地，无需走我国龟速且超高延迟的2G网络，让用户感觉你的页面非常高级，一点链接就能打开。只要一经缓存，即使用户在没网络的情况下也能顺利的访问页面，结合HTML5的LocalStorage等技术，允许页面做出很多媲美原生客户端的牛逼体验。 啥？你页面的逻辑和样式又有变动？一周要发好几次版本？产品又变需求？没问题，只要把更新包按下面接入说明的格式打包好扔给我们的管理后台，手Q会自动检测更新，并将更新包取回来增量覆盖本地内容，下次用户访问页面的时候就可以看到更新后的内容。 3.很牛逼！怎么接入？ 你大致要做这几件事： 如果你这模块很重要，第一次也要从本地加载，请先联系我们的产品MM chloezhu； 还是找产品MM chloezhu帮你申请一个bid，这个bid用于标识你的业务，让手Q检测更新； 按照[3.1]的格式打包你的静态资源到一个zip包，提交到我们管理后台； 用手Q访问对应页面的时候，在你希望触发更新检查的页面(通常是首页)的url上带上你的_bid参数。 3.1.准备zip包 3.1.1.准备目录和文件 如果你选择的离线加载模式为“相对路径模式”，那你只需要把所有内容放到一个目录下面即可。如果使用“拦截替换模式”，则需要把所有涉及到的域名打包，假设你的页面用到了、、等好几个域名，如下图2所示，请为每个域名建一个目录（你只用到一个域名？那建一个目录就可以了），然后按照资源的url建立各级子目录并把资源放到相应的子目录下。 比如你有这样一个html页面：HYPERLINK /module1/helloworld.html /module1/helloworld.html 把该页面文件放到目录/module1下即可，见图2 [图2] 离线包目录结构 3.1.2.打包 目录准备好后，全选最上层的域名目录，打包成一个.zip文件即可，如下图3所示： [图3] 选择域名目录并打包成zip文件 3.2.上传到管理后台 管理后台有分正式环境和测试环境： 测试环境：HYPERLINK /index.html /index.html 正式环境：HYPERLINK /index.html /index.html [图4] 管理后台 要上传刚才打包好的zip包，请在左侧菜单选择“业务后台管理 QQ本地化 手Q离线版本管理”，然后点击页面上的“添加数据”按钮，在弹出的表单中填写相应信息和选择zip包，点击保存即可。表单的参数如下： 兼容版本：若0，则只有手Q本地有大于或等于这个版本号的离线包时才能拉取到更新； 所属业务：选择你自己所属的业务； 手Q版本：若0，则只有大于或等于这个版本号的手Q才能拉取到更新； 支持版本：可选择更新包是针对iOS的还是Android的； 数据包：选择你的zip包文件 加载模式：支持相对路径模式和拦截替换模式两种，具体区别见[3.3]； 时间频率：最小更新检查频率，最小值为1分钟，这个参数不是说手Q会固定以这个时间间隔去不停检查更新，而是手Q会保证两次触发更新检查之间的时间间隔不会低于这个值； 是否灰度：你懂的，要是选了灰度可以填入灰度的Q号。 表单填完后请点击保存。保存成功后，请在列表上选择对应的记录，点击列表顶部的“发布数据”。 3.3.加载模式 由于android系统版本的差异，这里为了对加载模式进行了细分，以满足不同的产品需求(默认为：相对路径模式)： 相对路径模式：支持iOS、Android全部版本。这个模式下，手Q加载离线web内容的时候，将会把本地离线内容当作一个虚拟站点加载访问，里面的内容所有都必须是相对路径，如果是绝对路径将会访问网络内容，如：入口地址为： /index.html，这个页面里面包括了一个cdn的资源： /main.js, 则提供离线包的时候，只需要按域名建立目录一起打包即可， 需要把main.js转换成相对路径。 即js加载地址为：main.js或放到子目录：js/main.js 拦截替换模式。支持iOS全部版本、Android4.0+版本。这个模式在牺牲android低版本的情况下，提供了更灵活的离线加载方式，特别是在