直接上代码
// 微信API封装
(function (global, factory) {
// 插入微信JSDK
function init(callback) {
var src = 'https://res.wx.qq.com/open/js/jweixin-1.2.0.js'; //微信JSDK
var scr = global.document.getElementsByTagName('script')[0];
var doc = global.document || window.document;
var v = doc.createElement('script');
v.type = 'text/javascript';
v.async = true;
v.src = src;
v.onload = function() {
callback();
}
scr.parentNode.insertBefore(v, scr);
}
typeof wx === "undefined" ? init(factory) : factory();
})(window, function () {
var weixin_token = {};
var curUrl = window.location.href;
// 获取js-sdk
// 公共的配置微信参数
function wxConfig (jsApiList, wxReadyFn, wxErrorFn) {
Fetch.post("/syx/wx/jsapi", {
url: location.href.split('#')[0]
}).then(res => {
weixin_token = res
wx.config({
debug: false, //
appId: weixin_token.appId, // 必填,公众号的唯一标识
timestamp: weixin_token.timestamp, // 必填,生成签名的时间戳
nonceStr: weixin_token.nonceStr, // 必填,生成签名的随机串
signature: weixin_token.signature,// 必填,签名,见附录1
jsApiList: jsApiList
});
wx.ready(function () {
console.log("wx ready");
console.log(wxReadyFn);
if(wxReadyFn) {
wxReadyFn();
}
});
wx.error(function (res) {
if(wxErrorFn) {
wxErrorFn();
}
console.log(res, 'err')
//alert("微信初始化失败,请稍候再试或联系管理员!");
});
})
}
/**
* 扫一扫
* params 个性化配置。支持params={needResult:0,scanType:[''],successCb:function(res){}}
*/
function scanQRCode (params) {
wxConfig(['scanQRCode'], function() {
console.log("scanQRCode callback");
var conf = {
needResult: 0, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
scanType: ["qrCode","barCode"] // 可以指定扫二维码还是一维码,默认二者都有
}
conf = Object.assign({}, conf, params);
console.log(conf);
wx.scanQRCode({
needResult: conf.needResult, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
scanType: conf.scanType, // 可以指定扫二维码还是一维码,默认二者都有
success: function (res) {
// var result = res.resultStr; // 当needResult 为 1 时,扫码返回的结果
if(conf.successCb) {
conf.successCb(res);
}
}
});
});
}
/**
* 获取地理位置
* params 个性化配置。支持params={type:'',successCb:function(res){},cancelCb:function(res){},failCb:function(res){}}
*/
function getLocation (params) {
wxConfig(['getLocation'], function() {
var conf = {
type: 'wgs84', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
}
conf = Object.assign({}, conf, params);
wx.getLocation({
type: conf.type, // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
success: function (res) {
//var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
//var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
//var speed = res.speed; // 速度,以米/每秒计
//var accuracy = res.accuracy; // 位置精度
// callback
if(conf.successCb) {
conf.successCb(res);
}
},
cancel: function (res) {
if(conf.cancelCb) {
conf.cancelCb(res);
}
},
fail: function (res) {
if(conf.failCb) {
conf.failCb(res);
}
}
});
});
}
// 分享
function showShare (opts, callback) {
wxConfig(['showOptionMenu', 'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo'], function() {
// 加载完成后回调
wx.showOptionMenu();
menuShareTimeline(opts, callback);
menuShareAppMessage(opts, callback);
menuShareQQ(opts, callback);
menuShareWeibo(opts, callback);
});
}
// 禁止分享
function hideShare (otps) {
wxConfig(['hideMenuItems','hideAllNonBaseMenuItem'], function() {
// 加载完成后回调
wx.hideAllNonBaseMenuItem();
});
}
function menuShareTimeline (opts, callback) {
wx.onMenuShareTimeline({
title: opts.title || "", // 分享标题
imgUrl: opts.img || "", // 分享图片
link: opts.link || "", // 分享链接
desc: opts.desc || "", // 分享描述
success: function () {
callback && callback(opts)
},
error: function (res) {
},
fail: function (res) {
}
});
}
function menuShareAppMessage (opts, callback) {
wx.onMenuShareAppMessage({
title: opts.title || "", // 分享标题
imgUrl: opts.img || "", // 分享图片
link: opts.link || "", // 分享链接
desc: opts.desc || "", // 分享描述
success: function (res) {
callback && callback(opts)
},
cancel: function (res) {
},
fail: function (res) {
}
});
}
function menuShareQQ (opts, callback) {
wx.onMenuShareQQ({
title: opts.title || "", // 分享标题
imgUrl: opts.img || "", // 分享图片
link: opts.link || "", // 分享链接
desc: opts.desc || "", // 分享描述
success: function (res) {
callback && callback(opts)
},
cancel: function (res) {
},
fail: function (res) {
}
});
}
function menuShareWeibo(opts, callback) {
wx.onMenuShareWeibo({
title: opts.title || "", // 分享标题
imgUrl: opts.img || "", // 分享图片
link: opts.link || "", // 分享链接
desc: opts.desc || "", // 分享描述
trigger: function (res) {
callback && callback(opts)
},
success: function (res) {
},
cancel: function (res) {
},
fail: function (res) {
}
});
}
function menuShareQZone (opts) {
wx.onMenuShareQZone({
title: opts.title || "", // 分享标题
imgUrl: opts.img || "", // 分享图片
link: opts.link || "", // 分享链接
desc: opts.desc || "", // 分享描述
success: function () {
},
cancel: function () {
}
});
}
// 将封装的微信API接口都别名定义到全局变量G上,然后进行暴露到window引用里面
G.wxShowShare = showShare;
G.wxhideShare = hideShare;
G.wxScanQRCode = scanQRCode;
G.wxGetLocation = getLocation;
// 暴漏接口
window._ = Object.assign({}, window._, G);
});
在需要用的地方引入即可 扫一扫举例:
// 参数可以任选,也可以没有
_.wxScanQRCode({
needResult: 0, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
scanType: ["qrCode","barCode"] // 可以指定扫二维码还是一维码,默认二者都有
successCb: function(res) {
console.log("xxx.vue successCb");
console.log(res);
that.callback(res);
}
});