TypeError：无法在 Reactjs 中获取答案

【问题标题】：TypeError: Failed to fetch in ReactjsTypeError：无法在 Reactjs 中获取
【发布时间】：2020-12-12 02:09:07
【问题描述】：

我正在使用 fetch 在后端发布数据。每次都是成功，但有时会出错数据已发布，但仍然显示错误。

我正在通过代码获取：- 撰写.js

fetch(`${props.url}/addBalance`, {
                method: 'POST',
                headers: {
                    'Access-Control-Allow-Origin': '*',
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify(obj)
            })
            .then(resp => resp.json())
            .then(res =>{
                if(res) alert('Added Successfully');
                else alert('Failed,Try Again');
            }).catch(err=> {console.log(err);alert(err)});
        }

CORS 在后端启用并正常工作（由 POSTMAN 检查）。

成功：- Success 捕获错误：- without ACAO with ACAO

我在控制台中运行了 fetch 命令，它运行良好，但在我的 React js 应用程序中却没有

Catch 正在记录错误，但仍在发布数据

错误：- TypeError：获取失败

【问题讨论】：

stackoverflow.com/questions/49343024/…
我试过但失败了。我在 fetch 中添加了 ACAO 并再次尝试但未解决。我附上了带有和不带 ACAO 的响应标头的错误图片
您的后端是否显示任何错误？
否，数据已成功发布到数据库中。从后端我发送响应，如果成功则返回 true，如果错误则返回 false

标签： reactjs fetch

【解决方案1】：

如果它在服务器上工作正常，那么问题可能出在响应标头上。检查响应标头中的 Access-Control-Allow-Origin (ACAO)。通常react的fetch API在response header的ACAO和request的来源不匹配时，即使收到response也会抛出fail to fetch。

【讨论】：

我都试过了，有 ACAO 和没有 ACAO。我附上了显示响应标题的错误图片。

【解决方案2】：

将 Allow CORS: Access-Control-Allow-Origin 扩展添加到您的 chrome 或浏览器，然后启用它并检查之后的响应

【讨论】：

我启用并测试了。它通过了，但问题仍然存在

【解决方案3】：

我正在使用表单从用户那里获取输入，因此在获取之前，页面被重新加载并且它显示“获取失败”并且在 Chrome 开发者工具中状态显示为“已取消”。为了解决这个问题，我使用了 Div 标签。

【讨论】：