reactjs 由于CORS,第一个API请求失败,以下请求成功,前端的REACT.js和服务器端的.NETCORE

bt1cpqcv  于 2023-02-15  发布在  React
关注(0)|答案(1)|浏览(141)

我正在从React.js客户端向.NetCore API发出请求,我已经配置了CORS,但是每次新设备发出请求或如果我清除浏览器数据,第一个请求都会因以下错误而失败:“从原点”.. a "在“...”获取数据的访问权限已被CORS策略阻止:请求的资源上不存在“Access-Control- Allow-Origin”标头。如果不透明响应满足您的需要,请将请求的模式设置为“no-cors”以在禁用CORS的情况下提取资源。”
由于配置已在服务器端完成,因此以下请求如预期一样成功。

fetch(GET_PAYMENT_URL, {
            method: 'POST',
            mode:'cors',
            headers: {
            'Access-Control-Allow-Headers': 'Content-Type, Origin',
            'Content-Type': 'application/json',
            'Access-Control-Allow-Origin':ORIGIN_URL,
            },
            body: JSON.stringify(paymentUrlRequest),
        })
        .then((response) => response.json())
        .then((data) => {

        })
        .catch(errorr => {

        });

我希望第一个请求在新设备上成功,或者即使客户端清除了浏览器数据

dtcbnfnu

dtcbnfnu1#

正如@jub0bs在注解中提到的,服务器端被配置为允许列出的来源,因此响应头“Access-Control-Allow-Origin”不能是静态的或“*”表示所有来源,这就是我们使用“Vary”的原因:“Origin”,以便用户代理将获取包含Access-Control-Allow-Origin的响应,而不是使用来自之前缺少Access-Control-Allow-Origin的非CORS请求的缓存响应。
以下是CORS协议和HTTP缓存的链接

相关问题