Question

我正在使用PetFinder的API（https://www.petfinder.com/developers/api-docs）拍摄一些狗的照片。他们的API非常简单。我的问题是CORS。我有一个Chrome扩展程序，该程序告诉Chrome不要打扰，因此我可以在本地查看我的工作，但是如果我可以将其扔到GitHub页面或与其他人共享，然后他们可以克隆并运行它，我会希望它。

我使用create-react-app构建了该应用。基本上，这是一个获取请求。我可以使用简单的JSON进行操作，也可以添加&callback=?来获取其JSONP。我已经做了一些挖掘工作，希望在信息中加入第二个参数来绕开CORS，但我无法坚持下去。如果服务器端的HEADERS不正确，我是否只是停留在潜在的不透明响应上？有没有更好的方法可以用JSONP做到这一点？有人可以告诉我我的选择吗？

componentDidMount() {
  fetch('http://api.petfinder.com/pet.find?key=superSecretKeyForMeToKnow&animal=dog&location=94103&output=full&format=json')
  .then(response => response.json())
  .then(petFinderJson => this.setState({ dogs: petFinderJson.petfinder.pets.pet }));
}

Answer 1

巴鲁克是对的。我需要一个代理。

我只需要向"proxy": "http://api.petfinder.com"添加package.json，然后修改获取请求以排除该行。因此www.google.com/search在获取请求中将变成/search！

成功了！哇！

PetFinder API CORS问题

1 个答案: