做项目遇到一个百度地图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&output=json&ak=您的ak&callback=showLocation',{ mode:'no-cors',// credentials: 'include',headers:{ Accept: 'application/json',} }) .then( response => response.json() ) // .then(data => console.log(data)) .catch( e => console.log(e,111))
设置 mode:'no-cors'
,是解决了报错问题,但是响应的body会为空。
仔细查看百度地图api文档后,决定从jsonp入手,
于是找到这个库fetch-jsonp
上代码
import fetchJsonp from 'fetch-jsonp' fetchJsonp(baseUrl + 'location=39,116&output=json&ak=您的ak',{ // mode:'no-cors',},jsonCallbackFunction:'showLocation' }) .then( response => response.json() ) .then(data => console.log(data))
这时候便可以得到正确的response body了。
ps: 喜欢请点赞o( ̄▽ ̄)ブ
ps: 有更好方法的请赐教~
原文链接:https://www.f2er.com/react/302984.html