先去把官方demo 下载过来,
写一个简单页面, 加一个按钮,下面js代码贴出来
通过按钮触发下面的onLoad函数,就可以拿到数据了.
<script type="text/javascript">
let base_url = location.href.split('#')[0] //获取真实地址
console.log(encodeURIComponent(base_url));//编码
$.ajax({
async: false,
url: 'http://api.xxx.cn/api/jsapi_config?url=' + encodeURIComponent(base_url) + '', //api.xxx.cn 这个地址要提前设置,公众号->公众号设置-> JS接口安全域名
success: function (data) {
console.log("11111====>",data.nonceStr)
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: data.appId, // 'wxb41fa7a42e19cf1e', // 必填,公众号的唯一标识
timestamp: data.timestamp, //必填,生成签名的时间戳
nonceStr: data.nonceStr, //必填,生成签名的随机串
signature: data.signature, //必填,签名
jsApiList: data.jsApiList , // 必填,需要使用的JS接口列表
});
},
error: function (err) {
console.log("error")
}
})
function onLoad() {
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 mydata = {}
mydata.latitude = res.latitude;
mydata.lng = res.longitude;
mydata.speed = res.speed;
mydata.accuracy = res.accuracy;
wx.request({
url: 'api.myfda.cn/getWeixinInfo',
data: mydata,
method: 'PUT',
success: function (res) {
console.log('success !!!!');
console.log(res);
},
fail: function (res) {
},
complete: function (res) {
}
})
}
});
}
</script>
java代码,也从官方demo里拷出来的,还要加上access_token缓存+jsapi_ticket缓存 ,几个配置字段,通过接口返回
import java.util.UUID;
import java.util.Map;
import java.util.HashMap;
import java.util.Formatter;
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
import java.io.UnsupportedEncodingException;
class Sign {
public static void main(String[] args) {
String jsapi_ticket = "jsapi_ticket";
// 注意 URL 一定要动态获取,不能 hardcode
String url = "http://example.com";
Map<String, String> ret = sign(jsapi_ticket, url);
for (Map.Entry entry : ret.entrySet()) {
System.out.println(entry.getKey() + ", " + entry.getValue());
}
};
public static Map<String, String> sign(String jsapi_ticket, String url) {
Map<String, String> ret = new HashMap<String, String>();
String nonce_str = create_nonce_str();
String timestamp = create_timestamp();
String string1;
String signature = "";
//注意这里参数名必须全部小写,且必须有序
string1 = "jsapi_ticket=" + jsapi_ticket +
"&noncestr=" + nonce_str +
"×tamp=" + timestamp +
"&url=" + url;
System.out.println(string1);
try
{
MessageDigest crypt = MessageDigest.getInstance("SHA-1");
crypt.reset();
crypt.update(string1.getBytes("UTF-8"));
signature = byteToHex(crypt.digest());
}
catch (NoSuchAlgorithmException e)
{
e.printStackTrace();
}
catch (UnsupportedEncodingException e)
{
e.printStackTrace();
}
ret.put("url", url);
ret.put("jsapi_ticket", jsapi_ticket);
ret.put("nonceStr", nonce_str);
ret.put("timestamp", timestamp);
ret.put("signature", signature);
return ret;
}
private static String byteToHex(final byte[] hash) {
Formatter formatter = new Formatter();
for (byte b : hash)
{
formatter.format("%02x", b);
}
String result = formatter.toString();
formatter.close();
return result;
}
private static String create_nonce_str() {
return UUID.randomUUID().toString();
}
private static String create_timestamp() {
return Long.toString(System.currentTimeMillis() / 1000);
}
}
我最终的问题是因为签名字段nonceStr传值写死了.导致一直提示config:invalid signature ,
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#62
解决方案肯定是安照官方文案去查排:
invalid signature签名错误。建议按如下顺序检查:
总结: 要好好看文档,安照文档 把各个端的接口,api地址,公众号设置都先调好,再去测试微信的代码.
PS:微信接口所有的错误返回结果都是:config:invalid signature,没有api接口 || 在测试公众号上||没设置js安全域名 || 白名单没设置 都提示了验签失败…