React + fetch API + 百度地图api + 跨域填坑

w1366352655

于 2018-12-22 13:13:00 发布

阅读量306

点赞数

本文链接：https://blog.csdn.net/w1366352655/article/details/86156216

版权

本文介绍了在React项目中使用fetch API调用百度地图API时遇到的跨域问题及解决方案。通过设置fetch的模式为'no-cors'虽能避免报错，但响应体为空。最终采用jsonp方式，借助fetch-jsonp库成功获取到正确的响应数据。

摘要由CSDN通过智能技术生成

React + fetch API + 百度地图api + 跨域填坑

做项目遇到一个百度地图api 的跨域问题。由于使用fetch ，在调用类似

http://api.map.baidu.com/geocoder/v2/callback=renderReverse&location=39.983424,116.322987&output=json&pois=1&ak=您的ak 的时候，不可避免的出现了跨域问题。


fetch(baseUrl + 'location=39,116&amp;output=json&amp;ak=您的ak&amp;callback=showLocation',{
    mode:'no-cors',
    // credentials: 'include',
    headers:{ Accept: 'application/json',}
  })
    .then( response =&gt; response.json() )
    // .then(data =&gt; console.log(dat