hesc-jsapi v1.1.4

H5混合开发框架2.0版

JSAPI能力是为H5应用提供调用手机原生能力，帮助开发者高效使用拍照，定位等手机系统能力，融合H5和原生开发。

面向对象：公司前端，终端开发人员

使用说明

1.使用npm安装
npm install hesc-jsapi --save
2.在main.js文件里进行全局引入，并注册为全局变量
import {hesc} from 'hesc-jsapi'
Vue.prototype.$hesc = hesc
3.在单页面的 index.html 文件中引入 CDN 链接。
https://cdn.jsdelivr.net/npm/hesc-hybrid-master@1.0.4/index.min.js

接口约定

• 所有接口都为异步
• 接受一个object类型的参数
• 成功回调 onSuccess(某些异步接口的成功回调，将在事件触发时被调用，具体详情请查看相关onSuccess回调时机)
• 失败回调 onFail

this.$hesc.命名空间.功能.方法({
    参数1: '',
    参数2: '',
    onSuccess: function(result) {
    //成功回调
    /*
    {
        //所有返回信息都输出在这里
    }*/
    },
    onFail: function(){
    //失败回调
    }
})    

JSAPI总览

JSAPI用法

1容器

获取容器版本号

this.$hesc.soft.version({
	onSuccess: function(result) {
         /*
         {versionCode:Number,versionName:String}	
        */  
    },
    onFail: function(){}
})

2弹窗

2.1 alert

    this.$hesc.device.notification.alert({
        message: "亲爱的",
        title: "提示",//可传空
        buttonName: "收到",
        onSuccess : function() {
            //onSuccess将在点击button之后回调
            /*回调*/
        },
        onFail : function(err) {}
    });

2.2 confirm

    this.$hesc.device.notification.confirm({
        message: "你爱我吗",
        title: "提示",
        buttonLabels: ['爱', '不爱'],
        onSuccess : function(result) {
            //onSuccess将在点击button之后回调
            /*
            {
                buttonIndex: 0 //被点击按钮的索引值，Number类型，从0开始
            }
            */
        },
        onFail : function(err) {}
    });

2.3 toast

this.$hesc.device.notification.toast({
    text: String, //提示信息
    duration: Number, //显示持续时间，单位秒，默认按系统规范[android只有两种(<=2s >2s)]
    delay: Number, //延迟显示，单位秒，默认0
    onSuccess : function(result) {
        /*{}*/
    },
    onFail : function(err) {}
})

2.4 单选

this.$hesc.biz.util.select({
    title: “单选”, //选择框标题
buttonLabels: ['确定', '取消'],  //按钮文本
array:[ '中国', '美国','加拿大', '英国'],  //选项
onSuccess : function(result) {
        //onSuccess将在点击button之后回调
        /*
        {
            buttonIndex: 0 //被点击按钮的索引值，Number类型，从0开始，
		item：“中国”		//返回的值
        }
        */

    },
    onFail : function(err) {}
})

2.5 多选

this.$hesc.biz.util.multiSelect({
    title: “多选, //选择框标题
buttonLabels: ['确定', '取消'],  //按钮文本
array:[ '中国', '美国','加拿大', '英国'],  //选项
onSuccess : function(result) {
        //onSuccess将在点击button之后回调
        /*
        {
            buttonIndex: 0 //被点击按钮的索引值，Number类型，从0开始，
		items：[“中国”, “美国”]		//返回的值
        }
        */

    },
    onFail : function(err) {}
})

3设备

3.1获取网络类型

this.$hesc.device.connection.getNetworkType({
    onSuccess : function(data) {
        /*
        {
            result: 'wifi' // result值: wifi mobile unknown none   none表示离线
        }
        */
    },
    onFail : function(err) {}
});

3.2获取uuid

this.$hesc.device.base.getUUID({
    onSuccess : function(data) {
        /*
        {
            uuid: '3udbhg98ddlljokkkl' //
        }
        */
    },
    onFail : function(err) {}
});

3.3获取手机基础信息

this.$hesc.device.base.getPhoneInfo({
    onSuccess : function(data) {
        /*
        {
            screenWidth: 1080, // 手机屏幕宽度
            screenHeight: 1920, // 手机屏幕高度
            brand:'Mi'， // 手机品牌
            model:'Note4', // 手机型号
            version:'7.0'. // 版本
            netInfo:'wifi' , // 网络类型 wifi／4g／3g 
            operatorType :'xx' // 运营商信息
        }
        */
    },
    onFail : function(err) {}
});

4日历

4.1日期选择器

this.$hesc.biz.util.datepicker({
    format: 'yyyy-MM-dd',//注意：format只支持android系统规范，即2015-03-31格式为yyyy-MM-dd
    value: '2015-04-17', //默认显示日期
    onSuccess : function(result) {
        //onSuccess将在点击完成之后回调
        /*{
            value: "2015-02-10"
        }
        */
    },
    onFail : function(err) {}
})

4.2时间选择器

this.$hesc.biz.util.timepicker({
    format: 'HH:mm',
    value: '14:00', //默认显示时间
    onSuccess : function(result) {
        //onSuccess将在点击完成之后回调
        /*{
            value: "10:00"
        }
        */
    },
    onFail : function(err) {}
})

4.3日期及时间选择器

this.$hesc.biz.util.datetimepicker({
    format: 'yyyy-MM-dd HH:mm',
    value: '2015-04-17 08:00', //默认显示
    onSuccess : function(result) {
        //onSuccess将在点击完成之后回调
        /*{
            value: "2015-06-10 09:50"
        }
        */
    },
    onFail : function(err) {}
})

5导航栏

5.1 设置导航栏颜色

this.$hesc.biz.navigation.setbg({
    bgcolor: '#CCF5F5F5',//ARGB格式 --- 透明度，红色，绿色，蓝色
       onSuccess : function() {
        //onSuccess将在点击完成之后回调
    },
    onFail : function(err) {}
})

5.2设置导航栏标题

this.$hesc.biz.navigation.setTitle({
    title : '邮箱正文',//控制标题文本，空字符串表示显示默认文本
    onSuccess : function() {
       //onSuccess将在点击完成之后回调
    },
    onFail : function(err) {}
});

5.3设置左侧导航按钮文本

this.$hesc.biz.navigation.setLeft({
    control: true,//是否控制点击事件，true 控制，false 不控制
    text: '',//控制显示文本，空字符串表示显示默认文本
    onSuccess : function() {
        //如果control为true，则onSuccess将在发生按钮点击事件被回调
    },
    onFail : function(err) {}
});

5.4关闭当前页面

使用说明
调用此接口可以关闭当前浏览器窗口

this.$hesc.biz.navigation.close({
    onSuccess : function() {
    },
    onFail : function(err) {}
})

5.5设置导航栏右侧单个按钮

this.$hesc.biz.navigation.setRight({
    show: false,//控制按钮显示， true 显示， false 隐藏
    control: true,//是否控制点击事件，true 控制，false 不控制
    text: '发送',//控制显示文本，空字符串表示显示默认文本
    onSuccess : function() {
        //如果control为true，则onSuccess将在发生按钮点击事件被回调
    },
    onFail : function(err) {}
});

5.6返回上一级页面

使用说明 调用此接口会返回前端页面的上级浏览页面，如果是H5的根页面，调用此接口会关闭当前浏览窗口。

this.$hesc.biz.navigation.goBack({
    onSuccess : function(result) {
        /*result结构
        {}
        */
    },
    onFail : function(err) {}
})

5.7替换页面

使用说明 使用新的页面替换当前页面，当前页面会被立即销毁，展示新页面，无动画。

this.$hesc.biz.navigation.replace({
    url: 'https://xxx.com',// 新的页面链接
    onSuccess : function(result) {
        /*
        {}
        */
    },
    onFail : function(err) {}
});

5.8显示隐藏标题栏

使用说明 控制标题栏的显示和隐藏。

this.$hesc.biz.navigation.display({
    show: false,//控制按钮显示， true 显示， false 隐藏
    onSuccess : function(result) {
        
    },
    onFail : function(err) {}
});

6UI控件

6.1设置顶部进度条颜色

this.$hesc.ui.progressBar.setColors({
    colors:"#CCFFFFFF" //ARGB
    onSuccess: function(data) {
        
    },
    onFail: function() {
    }
})

7扫码

7.1扫二维码

this.$hesc.biz.util.scan({
    type: "qrCode" , //String type 为 qrCode
    onSuccess: function(data) {
    //onSuccess将在扫码成功之后回调
      /* data结构
         { 'text': String}
      */
    },
   onFail : function(err) {
   }
})

8存储

8.1设置存储信息

this.$hesc.util.domainStorage.setItem({
     name:'key' , //String 存储信息的key值，必须唯一  
     value:'value', //String 存储信息的Value值  
     onSuccess : function(info) {
          /*{
                result:true
          }*/
     },
     onFail : function(err) {
          alert(err);
     }
 });

8.2获取存储信息

this.$hesc.util.domainStorage.getItem({
     name:'key' , // 存储信息的key值
     onSuccess : function(info) {
        /*{
             value: 'value' // 获取存储的信息
         }*/
     },
     onFail : function(err) {
          alert(err);
     }
 });

8.3删除存储信息

this.$hesc.util.domainStorage.removeItem({
     name:'key' , // 存储信息的key值
     onSuccess : function(info) {
          /*{
		        result:true
          }*/
     },
     onFail : function(err) {
          alert(err);
     }
 });

9地图

9.1获取当前GPS坐标

this.$hesc.device.geolocation.get({
    tiandi:true,//是否采用天地图 true天地图  false其它地图平台
    key:'',//天地图的开发者key，请申请服务端应用的key
    poi:true,// 是否获取该GPS位置的地理信息 true获取  false不获取 -- 只有天地图模式会返回地理信息
    onSuccess : function(result) {
        /* 坐标 result 结构
        {
            longitude : Number,//经度
            latitude : Number,//纬度
            /* 如采用了天地图，会返回天地图的地理信息
            province: 'xxx', // POI所在省会，可能为空
            provinceCode: 'xxx', // POI所在省会编码，可能为空
            city: 'xxx', // POI所在城市，可能为空
            cityCode: 'xxx', // POI所在城市，可能为空
            adName: 'xxx', // POI所在区名称，可能为空
            adCode: 'xxx', // POI所在区编码，可能为空
            title: 'xxx', // POI的名称
            address: 'xxx', // 详细地址，可能为空
            formatted_address:'xxx', // 格式化地址
            */
        }
        */
    },
    onFail : function(err) {}
});

9.2打开地图并定位

使用说明 默认采用天地图形式

this.$hesc.biz.map.locate({
    latitude: 39.903578, // 纬度，非必须
    longitude: 116.473565, // 经度，非必须
    baseUrl:String， //天地图底图地址
    annotation：String， //天地图标注地址 
    parturl：String,//部件地址
    key:'xxx',//申请的天地图key
    mapExtent:{minX:116.46,minY:31.72,maxX:116.71,maxY:31.87},//地图初始化范围
    onSuccess: function (result) {
        /* result 结构 */
 	{
            province: 'xxx', // POI所在省会，可能为空
            provinceCode: 'xxx', // POI所在省会编码，可能为空
            city: 'xxx', // POI所在城市，可能为空
            cityCode: 'xxx', // POI所在城市，可能为空
            adName: 'xxx', // POI所在区名称，可能为空
            adCode: 'xxx', // POI所在区编码，可能为空
            distance: 'xxx', // POI与设备位置的距离
            postCode: 'xxx', // POI的邮编，可能为空
            snippet: 'xxx', // POI的街道地址，可能为空
            title: 'xxx', // POI的名称
	        address: 'xxx', // 详细地址，可能为空
            latitude: 39.903578, // POI的纬度
            longitude: 116.473565, // POI的经度
        }
    },
    onFail: function (err) {}
});

10业务

10.1 打开应用

使用说明 打开手机上其它APP应用

this.$hesc.biz.microApp.openApp({
    agentId: '123',// iOS:应用scheme;   Android:应用包名
    appId: '234',// Android: APP入口activity  cn.com.hesc.xxxActivity
    onSuccess : function() {},
    onFail : function(err) {}
})

11 文件

11.1 下载文件

this.$hesc.biz.util.downloadFile({
    url: 'http://static.dingtalk.com/media/lADOADTWJM0C2M0C7A_748_728.jpg_60x60q90.jpg', //要下载的文件的url
    name: '一个图片.jpg', //定义下载文件名字
    onSuccess : function() {
        /*下载完成
            {path:'xxxxx'}
        */
    },
    onFail : function() {}
})

12 图片

12.1 拍照

this.$hesc.device.media.capture({
	custome:true， //true 自定义相机  false 系统相机
compress:true,//true 进行压缩
thumbnail:false,//true 优先返回缩略图base64，后台上传图片，false不需要缩略图，直接后台上传图片
mediaUrl:’’,//附件服务器地址
onThumbnail : function(result) {
         /*拍摄图片后返回100*100的缩略图base64编码的字符串
          {
                thumbnails：['./9XXXXXXXXXXXXXXXXXX’,''}]
          }
        */

},
onSuccess : function(result) {
        /*图片上传成功后返回url地址
          {  
		pics:[
                {path : http://yf.hesc.com.cn/hesc-fileservice/upload/file/2018/04/04/20180404160840998550.jpg}
        ]
	}
        */
    },
    onFail : function() {}

})

12.2 选择图片

this.$hesc.device.media.select({
   image:{multiple:true,compress:false,max:9},//multiple true进行多选 compress true进行压缩，max最多选9张，如果multiple设置为false，max默认赋值1
thumbnail:false,//true 优先返回缩略图base64，后台上传图片，false不需要缩略图，直接后台上传图片
mediaUrl:’’,//附件服务器地址
onThumbnail : function(result) {
         /*拍摄图片后返回100*100的缩略图base64编码的字符串
          {
             thumbnails：['./9XXXXXXXXXXXXXXXXXX’,''}]
          }
        */

},
onSuccess : function(result) {
        /*图片上传成功后返回url地址
          {  
            pics:[
                    {path : http://yf.hesc.com.cn/hesc-fileservice/upload/file/2018/04/04/20180404160840998550.jpg}
            ]
          }
        */
    },
    onFail : function(err) {}
})

12.3 图片预览

this.$hesc.biz.util.previewImage({
    urls: [String],//图片地址列表
    current: String,//当前显示的图片链接 可不填
    onSuccess : function(result) {
        /**/
    },
    onFail : function(err) {}
})

13电话

13.1 拨打电话

this.$hesc.biz.telephone.call({
    phone: ‘’, //电话号码
    onSuccess : function() {},
    onFail : function() {}
})

13.2 发送短信

this.$hesc.biz.telephone.smg({
phone: ‘’, //电话号码
msg:’发送的信息’,//要发送的信息
    onSuccess : function() {},
    onFail : function() {}
})

14音频

14.1 开始录音

this.$hesc.device.audio.startRecord({
    mediaUrl:’’,//附件服务器地址
    onSuccess : function () {//默认20秒。
    },
    onFail : function (err) {
    }
});

14.2 停止录音

this.$hesc.device.audio.stopRecord({
    mediaUrl:’’,//附件服务器地址
    onSuccess : function(res){
        res.mediaUrl; // 返回音频的url地址，可用于本地播放和音频下载
        res.duration; // 返回音频的时长，单位：秒
    },
    onFail : function (err) {
    }
});

14.3 监听录音自动停止

使用说明 当语音录制时间超过20秒时，自动停止语音录制，同时将录制的语音上传到服务端，返回音频资源的url。 推荐在调用 device.audio.startRecord 前设置监听录音自动停止的回调。

this.$hesc.device.audio.onRecordEnd({
    onSuccess : function(res) {
        res.mediaUrl; // 停止播放音频url地址
        res.duration; // 返回音频的时长，单位：秒
    },
    onFail : function (err) {
 
    }
});

14.4 播放语音

this.$hesc.device.audio.play({
    localAudioId : "mediaUrl",//音频的url地址
    onSuccess : function () {
 
    },
 
    onFail : function (err) {
    }
});

14.5 暂停播放

this.$hesc.device.audio.pause({
    localAudioId : "mediaUrl",
    onSuccess : function() {
    },
    onFail : function(err) {
    }
});

14.6 恢复暂停播放的语音

this.$hesc.device.audio.resume({
    localAudioId : "mediaUrl",
    onSuccess : function() {
    },
    onFail : function(err) {
    }
});

14.7 停止播放语音

this.$hesc.device.audio.stop({
    localAudioId : "mediaUrl",
    onSuccess : function () {
    },
    onFail : function (err) {
    }
});

14.8监听播放自动停止

this.$hesc.device.audio.onPlayEnd({
    onSuccess : function () {
    },
    onFail : function (err) {
    }
});

15打开新页面

15.1在新窗口上打开链接

this.$hesc.biz.util.openLink({
    url:"http://www.dingtalk.com",//要打开链接的地址
    onSuccess : function() {
        /**/
    },
    onFail : function(err) {}
})

16调用原生功能

16.1直接调用原生功能

this.$hesc.biz.native.method({
    param:object,//任何内容都可以
    onSuccess : function() {
        /**/
    },
    onFail : function(err) {}
})