写在前面的
如果平时开发有用到微信接口的小伙伴肯定遇到过一些需要跨域访问申请Token或者Ticket的问题,由于.NET或者JAVASE本身封装了一些web工具类,所以在使用跨域调用的时候只需要设置一些参数即可。但是,如果使用JS来进行跨域调用需要怎样进行?下面贴代码。
使用AJAX实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>使用Ajax来实现跨域申请AccessToken</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script type="text/javascript">
function ajax(){
var _appid = "这里是公众号的APPID";
var _appsecret = "这里键入你微信公众号的APPSecret";
var _url="https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=" + _appid + "&secret=" + _appsecret;
$.ajax({
url:_url,
type:"get",
dataType:'jsonp', <!--jsonp是Ajax专门为了应对跨域而提供的一个解决方案-->
crossDomain:true, <!--将Ajax的跨域访问参数置为True-->
success:function(data){
alert(data);
},
error:function(data){
console.log(data);
}
})
}
</script>
<body>
<form method=get action="">
<input type="button" value="点我进行跨域" onclick="ajax();"/>
</form>
</body>
</html>
测试结果
如果测试成功,那么在console中就会出现刚刚申请的热乎乎的Access_Token
总结
单纯使用jsonp可以解决跨域问题,但是我们并不推荐这种方法,由于跨域调用会出现很多无法预料的安全问题,json在返回的过程中非常容易遭到非法拦截,所以还需要使用其他的辅助手段来进行加密,或尽可能的在结构上避免跨域调用的出现。