未处理的拒绝(TypeError)：尝试从rest api获取数据以进行反应时，无法获取错误
未处理的拒绝(TypeError)：尝试从rest api获取数据以进行反应时，无法获取错误
提问于 2021-11-11 13:31:52
我正在构建一个应用程序，其中flask rest API接受两个字符串，并给出一个浮点值作为预测。现在，我正在尝试连接react应用程序，以便在网页上显示预测结果。
下面是用于在react应用中获取rest API预测的代码。
function App() {
useEffect(() => {
fetch(
"https://flask-api-test1.herokuapp.com/predict?solute=CC(C)(C)Br&solvent=CC(C)(C)O"
)
.then((resp) => {
if (resp.status == 200) {
return resp.json();
}
})
.then((data) => {
console.log(data);
});
}, []);在fetch /predict?solute=CC(C)(C)Br&solvent=CC(C)(C)O中，solute=CC(C)(C)Br和solvent=CC(C)(C)O是flask rest API的输入，用于提供预测。
当我尝试使用上面的代码在控制台中输出结果时，我收到以下错误
回答 1
Stack Overflow用户
发布于 2021-11-11 14:16:47
您面临的问题是CORS (跨域资源共享)问题。当您有单独的后端( Flask API)和前端( React SPA)时，对后端的请求来自与API不同的来源。可以想象，允许来自任何来源的请求到您的API可能会产生一些漏洞，因此默认行为是不允许跨域请求。你可以阅读更多关于它的here。
通过使用Flask扩展，例如Flask-CORS，您将能够为您的*定义一个CORS策略，该策略将允许所有源(使用通配符- API )，或者您可以指定允许哪些源，以及在某些情况下，哪些端点具有哪些CORS策略。实际的实现将根据您的框架和您使用的包/扩展而有所不同，但大多数包/扩展都可以轻松地将CORS策略简单地应用于您的API。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69929157
复制相关文章
相似问题
腾讯云开发者
