js和jq使用jsonp解决百度地图api跨越问题

最新推荐文章于 2024-04-28 23:53:03 发布

Dragonfly Fly

最新推荐文章于 2024-04-28 23:53:03 发布

阅读量1k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/baidu_39188121/article/details/95456337

博客主要提及了JS以及JQ添加代码dataType: “jsonp”的内容，聚焦于信息技术中前端开发方面的相关操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.js

var url = 'http://api.map.baidu.com/reverse_geocoding/v3';
var data = {
    ak:'你的ak',
    output:'json',
    coordtype:'bd0911',
    location:'40.02641073822578,116.66585564897912',
    callback: 'jsonpcallback',//对应值为自定义回调函数名
};
//组合url
var buffer = [];
for (var key in data) {
    buffer.push(key + '=' + encodeURIComponent(data[key])); //encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。
}
var fullpath = url + '?' + buffer.join('&'); //组合成了url
console.log(fullpath);
CreateScript(fullpath);
//生成script标签添加到body中
function CreateScript(src){
    var el = document.createElement('script');
    console.log(el);
    el.src = src;
    el.async = true;
    el.defer = true;
    document.body.appendChild(el);
}
//自定义回调函数
function jsonpcallback(rs) {
    console.log(rs);//百度地图返回值
}

2. jq 加代码dataType: “jsonp”

$.ajax({
    type: "get",
    url: 'http://api.map.baidu.com/reverse_geocoding/v3/',
    data:{
        ak:'你的ak',
        output:'json',
        coordtype:'bd0911',
        location:'40.02641073822578,116.66585564897912'

    },
    dataType: "jsonp",
    jsonpCallback: "success_jsonpCallback",
    success: (msg) => {
        //执行方法
        console.log(msg)
    },
});