使用 React Native 获取 JSONP
Fetching JSONP with React Native
我正在尝试将此 API https://www.petfinder.com/developers/api-docs 与 React Native 结合使用。我遇到的问题是 returns JSONP 而不是 JSON 所以使用 fetch 在 JSON 错误中给了我一个意外的标记。我试过使用像 fetch-jsonP 这样的库,但是它在 React Native 中不起作用,因为没有文档(与 jquery 相同),关于如何使用 React Native 获取 jsonP 数据有什么想法吗?
App.js
class Home extends Component {
componentDidMount() {
fetch(
`http://api.petfinder.com/pet.find?format=json&key=${API_KEY}&animal=dog&location=84070&callback=callback`
)
.then(res => res.json())
.then(responseText => console.log(responseText))
.catch(err => console.log(err));
}
render() {
const width = Dimensions.get("window").width;
const height = Dimensions.get("window").height;
return (
<View>
<Header
backgroundColor={darkBlue}
leftComponent={{ icon: "menu", color: "#fff" }}
centerComponent={<HeaderTextComponent />}
rightComponent={{ icon: "home", color: "#fff" }}
/>
</View>
);
}
}
export default Home;
JSONP 仅适用于浏览器,不适用于移动设备。不要尝试使用 fetch-jsonP 或任何 JSONP 库,因为它们依赖于 document.createElement('script') 来获得跨域支持。在手机上,跨域毫无意义。
正如我在 petfinder.com 上看到的那样,仅当您提供回调时才使用 JSONP。如果您不这样做,我希望得到正常的 JSON 回复。
我正在尝试将此 API https://www.petfinder.com/developers/api-docs 与 React Native 结合使用。我遇到的问题是 returns JSONP 而不是 JSON 所以使用 fetch 在 JSON 错误中给了我一个意外的标记。我试过使用像 fetch-jsonP 这样的库,但是它在 React Native 中不起作用,因为没有文档(与 jquery 相同),关于如何使用 React Native 获取 jsonP 数据有什么想法吗?
App.js
class Home extends Component {
componentDidMount() {
fetch(
`http://api.petfinder.com/pet.find?format=json&key=${API_KEY}&animal=dog&location=84070&callback=callback`
)
.then(res => res.json())
.then(responseText => console.log(responseText))
.catch(err => console.log(err));
}
render() {
const width = Dimensions.get("window").width;
const height = Dimensions.get("window").height;
return (
<View>
<Header
backgroundColor={darkBlue}
leftComponent={{ icon: "menu", color: "#fff" }}
centerComponent={<HeaderTextComponent />}
rightComponent={{ icon: "home", color: "#fff" }}
/>
</View>
);
}
}
export default Home;
JSONP 仅适用于浏览器,不适用于移动设备。不要尝试使用 fetch-jsonP 或任何 JSONP 库,因为它们依赖于 document.createElement('script') 来获得跨域支持。在手机上,跨域毫无意义。
正如我在 petfinder.com 上看到的那样,仅当您提供回调时才使用 JSONP。如果您不这样做,我希望得到正常的 JSON 回复。