百度API调用JSONP解决跨越问题 been blocked by CORS policy: No ‘Access-Control-Allow-Origin‘ header

简介: 百度API调用JSONP解决跨越问题 been blocked by CORS policy: No ‘Access-Control-Allow-Origin‘ header

百度API调用时会出现跨域,导致been blocked by CORS policy: No 'Access-Control-Allow-Origin' header

使用JSONP的解决方案如下:

封装IP函数

    function getIp(ip) {
        var url = 'http://api.map.baidu.com/location/ip?ak=11Z8uiP8kIz6AG0Vjiwzbc5f9Ii0cdHd&ip=' + ip + '&coor=bd09ll&callback=callBack';
        return url;
    }

生成script

    //生成script
    function createScript(src) {
        var el = document.createElement('script');
        console.log(el);
        el.src = src;
        document.body.appendChild(el);
    }


回调函数

    //回调函数
    function callBack(rs) {
        var city = rs['content']['address'];
        console.log(city);
    }


执行渲染

createScript(getIp("39.185.200.145"));

Done!

相关文章
|
3月前
|
API
【Azure Function】Function本地调试时遇见跨域问题(blocked by CORS policy)
【Azure Function】Function本地调试时遇见跨域问题(blocked by CORS policy)
【Azure Function】Function本地调试时遇见跨域问题(blocked by CORS policy)
|
3月前
|
API
【API Management】使用 APIM Inbound Policy 来修改Content‐Type Header的值
【API Management】使用 APIM Inbound Policy 来修改Content‐Type Header的值
【API Management】使用 APIM Inbound Policy 来修改Content‐Type Header的值
|
3月前
|
Web App开发 缓存 小程序
【Azure API 管理】从微信小程序访问APIM出现200空响应的问题中发现CORS的属性[terminate-unmatched-request]功能
【Azure API 管理】从微信小程序访问APIM出现200空响应的问题中发现CORS的属性[terminate-unmatched-request]功能
|
3月前
|
API
【Azure API 管理】APIM中的Policy是否有调用速率的方法(熔断机制)
【Azure API 管理】APIM中的Policy是否有调用速率的方法(熔断机制)
|
3月前
|
存储 API 开发工具
【Azure API 管理】API Management如何有效且快速更新呢?如对APIs/Policy等设置内容
【Azure API 管理】API Management如何有效且快速更新呢?如对APIs/Policy等设置内容
|
3月前
|
存储 API
【Azure API 管理】为调用APIM的请求启用Trace -- 调试APIM Policy的利器
【Azure API 管理】为调用APIM的请求启用Trace -- 调试APIM Policy的利器
|
3月前
|
API
【Azure API 管理】Azure API Management在设置 Policy时,如何对URL进行解码呢? 使用 HttpUtility.UrlDecode 出错
【Azure API 管理】Azure API Management在设置 Policy时,如何对URL进行解码呢? 使用 HttpUtility.UrlDecode 出错
|
3月前
|
JSON 小程序 API
【Azure API 管理】APIM CORS策略设置后,跨域请求成功和失败的Header对比实验
【Azure API 管理】APIM CORS策略设置后,跨域请求成功和失败的Header对比实验
|
5月前
|
安全 前端开发 中间件
中间件在API跨域资源共享(CORS)
【6月更文挑战第16天】
80 7
|
5月前
|
前端开发 对象存储 数据安全/隐私保护
阿里云前端直传has been blocked by CORS policy: Response to preflight request doesn‘t pass access control
阿里云前端直传has been blocked by CORS policy: Response to preflight request doesn‘t pass access control
649 2