html页面代码
<a id='downloadAndroid' class="button-text " href="http://tqy.res.***.com/freeapk/tqy.apk" target="_bank"><img src="http://www.tqy.com/images/android_08ced5b.png"/> Android 下载</a>
<script>
function queryAppVersion(obj){
if(obj.code==200){
document.getElementById('downloadAndroid').setAttribute('href',obj.url);
}else{
console.log(obj.message);
}
}
window.onload = function(e){
var script = document.createElement('script');
script.src = 'https://tqy.***.com/v3/app_version/get?callback=queryAppVersion';
script.onerror = function(e){
console.log(e.responseText);
};
document.body.insertBefore(script,document.body.firstChild);
}
</script>
原理
1、利用script标签可以跨域访问 2、script标签中定义了一个queryAppVersion方法,window.onload使得页面 一加载的时候就执行该函数,在html中增加了“<script src="https://tqy.***.com/v3/app_version/get?callback=queryAppVersion"></script>”,其中src请求服务端的Controller 3、以上请求返回的结果是queryAppVersion({"code":200,"releaseNote":"","url":"http://tqy.res.***.com/apk/tqy-release-v3.2.4-c25-160707_signed.apk","versionName":"3.2.4.c1607070934u"}); 4、由于 在 script标签中已经定义了queryAppVersion方法,冰球返回的结果存放在script里面,相当于执行了window.queryAppVersion方法,其中传入的参数就是{"code":200,"releaseNote":"","url":"http://tqy.res.***.com/apk/tqy-release-v3.2.4-c25-160707_signed.apk","versionName":"3.2.4.c1607070934u"} 5、服务端所要做的事就是,将json返回数据包装下,变成queryAppVersion();这种格式,这样才会变成调用方法的格式
服务端代码
@RequestMapping(value = {"/v{version}/app_version/get", "/v3.2/app_versions.jsonp"}, produces = {"text/javascript; charset=UTF-8"})
@ResponseBody
public String getLatest(@RequestParam(value = "version_code", required = false, defaultValue = "") String code,
@RequestParam(value = "callback", required = false, defaultValue = "queryAppVersion") String callback) {
AppVersionVo vo = new AppVersionVo();
callback += "(%s);";
vo.setCode(200);
vo.setUrl(DEFAULT_URL);
return String.format(callback, JSON.toJSONString(vo));
}
效果
这样,原先的标签就变成了
<a id="downloadAndroid" class="button-text " href="http://tqy.res.***.com/apk/tqy-tqyrelease-v3.2.4-c25-160707_signed.apk" target="_bank"><img src="http://www.tqy.com/images/android_08ced5b.png">Android 下载</a>