javascript - 尝试从 localhost 访问 api 时如何解决“Access-Control-Allow-Origin”错误
问题描述
看过很多关于这个错误的话题,但是我对js和apis很陌生,所以我不太了解,所以我为noob状态道歉。
我正在尝试从 Sportradar 访问 api。我正在一个从 create-react-app 创建并使用 axios 的简单反应项目上对其进行测试。当我控制台记录数据时,我收到以下错误:https ://dzwonsemrish7.cloudfront.net/items/372w3g2b3F141t2P0K1G/Image%202018-09-04%20at%2011.33.38%20AM.png
我想我无法从本地主机访问它?这是我的请求功能:
getPlayerInfo() {
const apiKey = "my-api-key";
const playerID = "41c44740-d0f6-44ab-8347-3b5d515e5ecf";
const url = `http://api.sportradar.us/nfl/official/trial/v5/en/players/${playerID}/profile.json?api_key=${apiKey}`;
axios.get(url).then(response => console.log(response));
}
解决方案
如果后端支持 CORS,您可能需要在请求中添加此标头:
headers: {"Access-Control-Allow-Origin": "*"}
您的代码将是这样的:
getPlayerInfo() {
const apiKey = "my-api-key";
const playerID = "41c44740-d0f6-44ab-8347-3b5d515e5ecf";
const url = `http://api.sportradar.us/nfl/official/trial/v5/en/players/${playerID}/profile.json?api_key=${apiKey}`;
const config = {
headers: {'Access-Control-Allow-Origin': '*'}
};
axios.get(url,config).then(response => console.log(response));
}
希望这可以帮助 !
推荐阅读
- azure-devops - DevOps 发布错误:不允许 EPERM 操作
- python - 遍历 Pandas 数据框中的列表并总结其他列
- c++ - 计算器程序无法编译
- android - mergeDebugResources 错误 - 如何解决?
- c++ - 在 Travis-CI 上使用 Conan 和 Python3
- hadoop-yarn - Yarn local-dirs - 每个节点设置
- mule - 使用 dataweave 2.0 将 xml 转换为 csv
- python - 将一个数字分成 3 个部分
- python - 如何在 python 中使用 Spinnaker 从点灰色相机获取彩色图像?
- puppet - 将日志文件从代理复制到主木偶