公司有需求,通过企业号打卡项目,需要用到企业微信定位
demo是基于微信、企业号平台的一个定位,地图展示项目
后台使用springboot架构搭建的与微信交互的服务,使用httpclient连接池,调用微信接口,并且使用到Sha-1加密签名。
客户端使用微信提供的js-sdk,遵守微信认证规则,授权使用微信开放接口
使用微信、企业号定位并展示效果图:
前期准备:
1、项目初始化获取access_token(access_token作为企业号与微信交互的令牌,项目初始化时可通过调用微信接口,换取access_token,并在本地缓存,有效期两小时)
代码示例:
public static void refreshAccessToken() {
if(access_token_time !=0 && System.currentTimeMillis() < access_token_time ) return;
Map params = new HashMap();
params.put("corpid", CORPID);
params.put("corpsecret",CORPSECRET);
String resJson = HttpClientUtil.doGet(
"https://qyapi.weixin.qq.com/cgi-bin/gettoken", params);
WeChatAccessTokenResres = JSONObject.toJavaObject(JSONObject.parseObject(resJson), WeChatAccessTokenRes.class);
access_token = res.getAccess_token();
access_token_time = System.currentTimeMillis()+6900;
}
2、换取jsapi_ticket(使用微信的sdk,需要使用access_token换取jsapi_ticket作为票据,有效期也是两小时)
代码示例:
public static void getJsapiTicket() {
if(jsapi_ticket_time !=0 && jsapi_ticket_time > System.currentTimeMillis()) return;
String resJson = HttpClientUtil.doGet(
"https://qyapi.weixin.qq.com/cgi-bin/get_jsapi_ticket?access_token="
+ access_token, null);
JSONObject jsonRes = JSONObject.parseObject(resJson);
jsapi_ticket = (String) jsonRes.get("ticket");
jsapi_ticket_time = System.currentTimeMillis()+6900;
}
3、生成签名: signature(拿到了jsapi_ticket,后需要访问的url,时间戳,jsapi_ticket,拼成字符串使用sha-1加密算法生成签名)
代码示例:
public static String getSignature(String noncestr, String timestamp,
String url) throws NoSuchAlgorithmException,
UnsupportedEncodingException {
String item = "jsapi_ticket="+jsapi_ticket + "&noncestr=" + noncestr + "×tamp="
+ timestamp + "&url=" + url;
MessageDigest crypt = MessageDigest.getInstance("SHA-1");
crypt.reset();
crypt.update(item.getBytes("UTF-8"));
String signature = byteToHex(crypt.digest());
return signature;
}
4、拿到签名后,需要将 时间戳,签名回调 给前端
代码示例:
@RequestMapping("getSignature")
@ResponseBody
public Map getSignature(String url){
WechatConfigs.refreshAccessToken();
WechatConfigs.getJsapiTicket();
String noncestr = WechatConfigs.creatNoncestr();
String timestamp = WechatConfigs.getTimeStamp();
String signature ="";
try {
signature = WechatConfigs.getSignature(noncestr, timestamp, url);
} catch (NoSuchAlgorithmException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (UnsupportedEncodingException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
Map result = new HashMap();
result.put("noncestr", noncestr);
result.put("timestamp", timestamp);
result.put("signature", signature);
return result;
}
1、类库引用
2、初始化获取签名,时间戳,随机字符串
代码示例:
var url =window.location.href;
var noncestr = "";
var timestamp = "";
var signature = "";
debugger;
$.ajax({
url:"../demo/getSignature",
type:"post",
data:{url:url},
dataType:"json",
async:false,
success:function(res){
noncestr = res.noncestr;
timestamp = res.timestamp;
signature = res.signature;
}
});
3、微信初始化配置
代码示例:
wx.config({
beta: true,// 必须这么写,否则wx.invoke调用形式的jsapi会有问题
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,企业微信的corpID
timestamp:timestamp, // 必填,生成签名的时间戳
nonceStr: noncestr, // 必填,生成签名的随机串
signature: signature,// 必填,签名,见 附录-JS-SDK使用权限签名算法
jsApiList: ['openLocation','getLocation'] // 必填,需要使用的JS接口列表,凡是要调用的接口都需要传进来
});
4、调用微信js-sdk接口
代码示例:
wx.getLocation({
type: 'gcj02', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
success: function (res) {
debugger;
var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
var speed = res.speed; // 速度,以米/每秒计
var accuracy = res.accuracy; // 位置精度
wx.openLocation({
latitude: latitude, // 纬度,浮点数,范围为90 ~ -90
longitude: longitude, // 经度,浮点数,范围为180 ~ -180。
name: '武汉', // 位置名
address: '', // 地址详情说明
scale: 16, // 地图缩放级别,整形值,范围从1~28。默认为16
});
}
});