天山

技术 框架

think

why

传统HTML5相比app原生效果不佳的窗体切换、长列表滚动、下拉刷新、大容量选项卡切换等，导致体验不流畅。
各种渠道层出不穷。

how

APP：加载tianshan的SDK。
微信：加载提供的js文件，修改配置。

what(功能)

• 一套资源包同时支持app(iOS, Android)，微信，手机浏览器。
• 资源包可以静默/提醒升级
• 欢迎页动态更新
• 原生功能：手机设备信息(唯一号)、系统信息、网络信息/变化，地理位置，拍照，语音输入，本机存储等。
• android原生功能：设备按键(返回，退出)
• 业务功能：第三方授权登录(微信,QQ)，第三方分享(微信等)，支付(微信,支付宝)，条码扫描/输入，外部App打开(如打开支付宝app)
• 支持本地/远程内容访问(二选一)：资源包(html)，远程网址。

架构

应用app

信息

• icon
• 名称
• 欢迎页图片
• 引导页图片

配置

• 远程网址(默认是无)
• api网址
• 是否系统自启动
• 是否允许静默升级
• 欢迎/引导页图片更新api名称，相对地址
• 横竖屏
• 屏锁定
• 消息推送
  配置有：第三方服务类型(如jpush等)，服务参数(如秘钥等)。
  初始化时需检查类型和参数，如有错误需提示。
• 数据统计
  配置有：第三方服务类型(如百度统计等)，服务参数(如秘钥等)。
  初始化时需检查类型和参数，如有错误需提示。

组件自定义

• 升级：提示文字

后端接口自定义

• 升级协议

js接口扩展(后续提供)

系统设置

系统权限

资源包

• html

结构

• 启动：如MainApplication，只需要启动天山
• 自定义组件：如自定义升级对话框

天山库

结构

• 核心(core)
  
  • 启动(startup)
  • 启动(sys)：app升级检查，资源包升级检查
  • javascript对接(interface)：功能调用类。如

getLocation() {
    this.locationService.get();
}

• 系统(sys)
  
  • 坐标(location)
  • 网络
• 服务(service)
  
  • 支付(pay)：微信，支付宝
  • 第三方授权(auth)
• 资源(res)
  
  • 页面(page)
    
    • 欢迎
    • 引导
    • 容器
  • 组件(component)
    
    • 升级对话框(UpgradeDlg)
• 基础库(base)

方案

功能

App原生

后端

后端接口定制化

当前情况：tianshan有对应后端接口的业务类BeService，使用了接口IBeApi(对应后端接口)
BeService有所有业务和流程，无接口实现。

应用app定制步骤
1. 创建CustomBeApi，实现接口IBeApi。
2. 将CustomBeApi注入到tianshan。

组件定制化

当前情况：tianshan的组件UpgradeDlg，实现接口IUpgradeDlg

应用app定制步骤
1. 创建CustomUpgradeDlg，实现接口IUpgradeDlg。
2. 将CustomUpgradeDlg注入到tianshan。

远程网址原理

远程网址配置后，版本检查相关的配置和流程都无需执行
原生功能不能调用

后退(android)

if (双击)
    退出系统
if (远程) {
    浏览器后退
} else { // 本地
    调用js接口
}

流程

App端

手动升级资源包

H5触发App方法
1. 用户点击升级资源包，触发本地手动更新资源包方法。
App执行更新
2. App请求资源包接口，检查是否有版本更新

if(YES){
    //提示用户正在下载更新包
    //下载完成后，重新加载更新包
}else{
    //提示用户已经是最新版本
}

资源包升级方案

资源包下载、解压、运行目录

初始目录（SD）
持久化目录（PD）
资源包存放名称：page.zip
配置项：首页文件名字：index.html

• LPF存放在PD
• 资源包解压路径为：PD/page
• 程序第一次运行时，将资源包从SD拷贝到PD.

iOS
- 每次进入程序检查RD目录是否有首页文件，不存在则从PD的对应目录拷贝至RD
- 运行目录（iOS特有）：WebView加载资源包的路径tmp/www

安卓
- 安卓只有PD，没有RD，即PD和SD是同一个目录，每次WebView从PD加载资源包。

资源包升级流程

app当前所用的资源包版本:LV(localVersion)
app当前下载成功的资源包版本DV(downloadVersion)
请求更新接口后，服务器返回的资源包版本AV(apiVersion)
强制更新版本号FV(forceVersin)

流程图

ios

安卓

• 参考
• app启动流程
• 资源包升级流程

欢迎页可以动态更新(app端流程)

1. 请求资源包更新接口后，得到服务器返回的数据;

2. 根据接收到的数据做相应处理;

   if(haveUpdate){
   //1.下载欢迎页图片至指定目录
   //2.更新appIsFirstOpen = YES;
   //3.下次启动显示新的欢迎页
   }

远端页面转换成本地页面

1.原理：通过拦截包含特定字符串的URL，替换成本地的URL地址，加载替换后的URL
2.本地的URL地址： 
                ios:运行目录(RD)地址+index.html;
                Android:持久化目录(PD)地址+index.html；

安卓自动升级

1. App启动，请求App更新接口
2. 如果有更新，弹出提示框提示用户更新。

同步支付

App支付成功后，App将微信客户端返回的信息传给服务端，服务端使用这些信息去请求微信服务器，判断是否支付成功。

欢迎页页面显示

1. App启动，读取本地 appIsFirstOpen;
2.

 if(appIsFirstOpen == YES || appIsFirstOpen == NULL){
        //显示欢迎页面;
        //设置appIsFirstOpen = NO;
        //持久化存储appIsFirstOpen;
 }

1. 欢迎页消失，加载首页;

后端

后端资源包升级流程

1. app请求资源包更新接口，传入参数LV;

2. 服务端获取到AV、FV,通过与LV比较，返回给App相应参数。

   if(LV<AV){
       isLatest = ture;
       if(LV<FV){
           isForce = ture; 
       }else{
           isForce = false;
   }else{
       isLatest = falese
   }
   }

3. App接收到参数进行相应处理。

欢迎页可以动态更新(服务端流程)

1. 如果欢迎页有更新，则返回的数据为

   {
       haveUpdate = YES;
       imageURL = {
           url1 = " ";
           url2 = " ";
           ...
       }
   }

使用TODO

说明

功能所需的系统权限清单

如网络功能需要开网络权限

步骤

参考

app升级：编辑，查看
app原生功能清单