第三篇 微信jssdk中的使用
1.jssdk使用
获取地址：
function location(params) {
wx.ready(function () {
wx.getLocation({
type: 'wgs84', // 默认为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; // 位置精度
var str = " 您好！<br>当前位置：<br>纬度：" + res.latitude + "<br>经度：" + res.longitude + "<br>速度：" + res.speed + "<br>精度：" + res.accuracy + "<br>";
return str;
},
fail: function () {
//$("#msgDiv").html(userid + " 您好！<br>获取位置信息失败");
alert("erro获取位置信息失败");
}
});
});
}
在调用之前需要对签名认证：
function init(url) {
getConfig(url).then(function (data) {
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: data.appId, // 必填，公众号的唯一标识
timestamp: data.timestamp, // 必填，生成签名的时间戳
nonceStr: data.nonceStr, // 必填，生成签名的随机串
signature: data.signature, // 必填，签名，见附录1
jsApiList: ['getLocation'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
});
});
}
验证历程（狗血的历程）：
一般验证逻辑是：
后台获取：
appId = appId,
timestamp = timestamp,
nonceStr = nonceStr,
ticket = ticket,
signature = signature
这里需要HTML前台访问的URL这个URL在微信中调用就是有CODE,STATE的那个URL,
http://app.xxxxxxx.com/xx/xxx/xxx/index?code=te4pwVnqFuM48OFJUIhJ8Vg2Upc-uWmgR79NNswOi8s&state=1
把这个URL传回后台得到signature，然后再把：
appId = appId,
timestamp = timestamp,
nonceStr = nonceStr,
ticket = ticket,
signature = signature
传回前台JS处理：
当执行到：
function location(params) {
wx.ready(function () {
wx.getLocation({
type: 'wgs84', // 默认为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; // 位置精度
var str = " 您好！<br>当前位置：<br>纬度：" + res.latitude + "<br>经度：" + res.longitude + "<br>速度：" + res.speed + "<br>精度：" + res.accuracy + "<br>";
return str;
},
fail: function () {
//$("#msgDiv").html(userid + " 您好！<br>获取位置信息失败");
alert("erro获取位置信息失败");
}
});
});
}
就可以通过了
Angularjs中的应用分主享:
其中URL中的参数url=后台的就是上面那个地址
return $http({
method: 'GET',
url: BASE_URL + '/getWXConfig?url=' + encodeURIComponent(url),
}).then(function(res) {
return res.data;
});
可以把所有wx.xxxx()全部放到service中调用。
//微信服务
.factory("WXServices", ['$http', 'BASE_URL', function ($http, BASE_URL) {
var WXServices = {};
WXServices.init = init;
WXServices.pay = pay;
WXServices.location = location;
return WXServices;
function init(url) {
getConfig(url).then(function (data) {
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: data.appId, // 必填，公众号的唯一标识
timestamp: data.timestamp, // 必填，生成签名的时间戳
nonceStr: data.nonceStr, // 必填，生成签名的随机串
signature: data.signature, // 必填，签名，见附录1
jsApiList: ['getLocation'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
});
});
}
function location(params) {
wx.ready(function () {
wx.getLocation({
type: 'wgs84', // 默认为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; // 位置精度
var str = " 您好！<br>当前位置：<br>纬度：" + res.latitude + "<br>经度：" + res.longitude + "<br>速度：" + res.speed + "<br>精度：" + res.accuracy + "<br>";
return str;
},
fail: function () {
//$("#msgDiv").html(userid + " 您好！<br>获取位置信息失败");
alert("erro获取位置信息失败");
}
});
});
}
function getConfig(url) {
return $http({
method: 'GET',
url: BASE_URL + '/getWXConfig?url=' + encodeURIComponent(url),
}).then(function(res) {
return res.data;
});
}
}
])
在controller中 调用即可
.controller('signCtrl', ['$scope', 'WXServices', '$location', 'BASE_URL', function ($scope,WXServices, $location, BASE_URL) {
var vm = this;
var absurl = $location.absUrl();
var okurl = BASE_URL + pathUrl;
var url=absurl.split('#')[0];
WXServices.init(url);
vm.locationStr=WXServices.location();
}
])
如果出现：
{errMsg: "config:invalid signature"}
{errMsg: "config:fail"}
检查你的URL与生成signature用的url是否一至
appId timestamp nonceStr ticket signature
这几个检也要看一下.
如果是spa有可能会有#xxx/xxx/xx这一段要去掉
以上是二天的研究结果,与大家分享!
my god！
