UNI-APP使用SDK(H5)
UNI-APP使⽤SDK(H5)npm⽅式使⽤下⽅指令进⾏安装
npm install jweixin-module --save
在项⽬中引⽤
为了⽅便使⽤,我单独出⼀个相关的 js ⽂件,进⾏相关的初始化等操作。
wechat.js 「该⽂件我放置在项⽬共⽤⽬录,可以根据⾃⼰情况选择」
//⾃⼰封装的 quest
import http from'@/common/api'
var jweixin =require('jweixin-module');
export default{
/* 判断是否在中 */
isWechat:function(){
var ua = window.LowerCase();
if(ua.match(/micromessenger/i)=='micromessenger'){
//console.log('是客户端')
return true;
}else{
//console.log('不是客户端')
//以下是我项⽬中所需要的操作其他,可以⾃定义
uni.showModal({
title:'提⽰',
content:'请在浏览器中打开',
showCancel:false,
success:function(res){
firm){
// console.log('⽤户点击确定');
}else if(res.cancel){
// console.log('⽤户点击取消');
}
}
});
return false;
}
},
/
* 获取sdk初始化配置 */
initJssdk:function(callback){
//获取当前url然后传递给后台获取授权和签名信息
var url =encodeURIComponent(window.location.href.split('#')[0]);
<({
猪肉 价格
url:'getJsSdkInfo',//请求sdk配置接⼝地址
data:{
url: url
},
}).then(res =>{
//返回需要的参数appId,timestamp,noncestr,signature等
/鸳鸯的鸳怎么组词
/注⼊config权限配置
const{ data }= res.data;
debug: data.debug,
appId: data.appId,
timestamp: data.timestamp,
nonceStr: Str,
signature: data.signature,
jsApiList:[//这⾥是需要⽤到的接⼝名称
'checkJsApi',//判断当前客户端版本是否⽀持指定JS接⼝
'updateAppMessageShareData',//分享朋友
'updateTimelineShareData',//分享朋友圈
'updateTimelineShareData',//分享朋友圈
'getLocation',//获取位置
'openLocation',//打开位置
'scanQRCode',//扫⼀扫接⼝
'chooseWXPay',//⽀付
'chooseImage',//拍照或从⼿机相册中选图接⼝
'previewImage',//预览图⽚接⼝
'uploadImage'//上传图⽚
]
});
if(callback){
callback(res.data);
}
});
},
//在需要定位页⾯调⽤
getlocation:function(callback){
if(!this.isWechat()){
//console.log('不是客户端')
return;
}
this.initJssdk(function(res){
type:'gcj02',// 默认为wgs84的gps坐标,如果要返回直接给openLocation⽤的⽕星坐标,可传⼊'gcj02'      success:function(res){
// console.log(res);
callback(res)
},
fail:function(res){
console.log(res)
},
});
});
});
},
//打开位置
openlocation:function(data, callback){
if(!this.isWechat()){
//console.log('不是客户端')
return;
}
this.initJssdk(function(res){
jweixin.openLocation({//根据传⼊的坐标打开地图
latitude: data.latitude,
longitude: data.longitude
});
});
});
},
//选择图⽚
chooseImage:function(callback){
if(!this.isWechat()){
//console.log('不是客户端')
return;
}
//console.log(data);
this.initJssdk(function(res){
jweixin.chooseImage({
count:1,
sizeType:['compressed'],
sourceType:['album'],
success:function(rs){
callback(rs)
callback(rs)
}
})
});
});
},
//⽀付
wxpay:function(data, callback){
if(!this.isWechat()){
//console.log('不是客户端')
return;
}
this.initJssdk(function(res){
jweixin.chooseWXPay({
timestamp: data.timestamp,// ⽀付签名时间戳,注意jssdk中的所有使⽤timestamp字段均为⼩写。但最新版的⽀付后台⽣成签名使⽤的timeStamp字段名需⼤写其中的S字符
nonceStr: Str,// ⽀付签名随机串,不长于 32 位
package: data.package,// 统⼀⽀付接⼝返回的prepay_id参数值,提交格式如:prepay_id=\*\*\*)
signType: data.signType,// 签名⽅式,默认为'SHA1',使⽤新版⽀付需传⼊'MD5'
paySign: data.paysign,// ⽀付签名
success:function(res){
// console.log(res);
callback(res)
},
fail:function(res){
callback(res)
},
});
});
});
},
//扫码
脚上鸡眼怎么办
scanQRCode:function(callback){
发天空照朋友圈配句if(!this.isWechat()){
//console.log('不是客户端')
return;
}
this.initJssdk(function(res){
jweixin.scanQRCode({
needResult:1,// 默认为0,扫描结果由处理,1则直接返回扫描结果,
scanType:["qrCode","barCode"],// 可以指定扫⼆维码还是⼀维码,默认⼆者都有
success:function(res){
// console.log(res);
callback(res);
},
fail:function(res){
callback(res)
},
});
});
});
},
//⾃定义分享这⾥我统⼀调⽤了分享到朋友和朋友圈,可以⾃⾏定义
share:function(callback){
if(!this.isWechat()){
//console.log('不是客户端')
return;
}
this.initJssdk(function(res){
//我的分享配置由后台返回,可以⾃定义
<({
url:'getShareInfo'
url:'getShareInfo'
}).then(res =>{
如何查询中考成绩
const{ shareInfo }= res.data;
jweixin.updateAppMessageShareData({//分享给朋友
title: shareInfo.title,
desc: shareInfo.description,
imgUrl: shareInfo.image,
link: shareInfo.link,// 分享链接,该链接域名或路径必须与当前页⾯对应的JS安全域名⼀致      success:function(){
// ⽤户确认分享后执⾏的回调函数
callback(res);台湾旅游胜地
}
});
jweixin.updateTimelineShareData({//分享到朋友圈
title: shareInfo.title,
desc: shareInfo.description,
imgUrl: shareInfo.image,
link: shareInfo.link,// 分享链接,该链接域名或路径必须与当前页⾯对应的JS安全域名⼀致      success:function(){
// ⽤户确认分享后执⾏的回调函数
callback(res);
}
});
});
});
});
}
}
配置
我是挂载到全局中使⽤的
在main.js中引⼊
import wechat from'@/common/wechat '
Vue.prototype.$wx = wechat
在项⽬中使⽤
<template>
<button @click="scanQRCode">扫码</button>
</template>
<script>
export default{
data(){},
methods:{
scanQRCode(){
this.$wx.scanQRCode(function(res){
//如果needResult设置为1  调⽤扫码在IOS中会有偶发的延迟问题,实测⼤约需要2000ms
//这⾥我设置的延迟是2000ms
setTimeout(function(){
Msg =="scanQRCode:ok"){
//调⽤成功
let result = sultStr;//扫码结果
}
},2000)
});
}
}
}
</script>
<style>
</style>

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。