由于 CORS 错误,POST 请求在 React axios 中被阻止[重复]

2024-05-15

我正在尝试向包含多部分数据的 API 发送 POST 请求。

我在 postman 中测试了 API,一切正常。但是当我在react中调用API时,它给了我CORS错误。

我交叉检查了 URL、标头和数据,对我来说一切似乎都正常。我浏览了有关同一主题的多个堆栈溢出问题,发现我需要将allow-cross-origin 与标头一起传递。我在标题中添加了该内容,但无法解决我的问题。

我在控制台中得到的错误是:

No 'Access-Control-Allow-Origin' header is present on the requested resource

API调用代码

import axios from 'axios';

const header = {
    "userid":localStorage.getItem("userid"),
    "token":localStorage.getItem("token"),
    "Content-Type": "multipart/form-data",
    "Access-Control-Allow-Origin": "*"
  }

const URL="https://api.hello.com/dashboard/venue_updated";

export function updateVenue(data,name,venue_type,email, phone_no,callback, errorcallback){
    console.log(header);
    axios.post(URL,data,{
        params:{
            name,
            venue_type,
            email,
             phone_no,
        },
        headers:header
    })
    .then(res => {
      if(callback != null){
         callback(res);
      }
    })
    .catch(err => {
      if(errorcallback != null){
         errorcallback(err);
      }
    })
}

我曾经将其导入到我的组件中并在表单提交方法上调用它。


你必须像这样添加你的后端。 (本例为nodejs)

app.use(cors(), function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "http://localhost:3000"); // update to match the domain you will make the request from
  res.header(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  next();
});

用于启用所有 CORS 请求

app.use(cors());
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

由于 CORS 错误,POST 请求在 React axios 中被阻止[重复] 的相关文章

随机推荐

  • Blazor 多个 _Host.cshtml

    我希望有two Host cshtml 我的想法是 我有一个登录页面 其所需的 css 和 js 非常不同 并且主 仪表板页面也具有不同的所需 css 和 js 我不想在单个 Host 中加载所有这些 css 和 js cshtml 一个用
  • useEffect 中的 setTimeout 函数输出缓存的状态值

    这很简单 我正在使用 Redux 来管理我的状态 我有一个setTimeout函数在一个useEffect功能 The setTimeout超时值为50000ms 我想要 SetTimeout 处理程序做什么 After 50000ms t
  • 关于JSON和序列化的问题

    我的视图模型有一个强类型视图 其中包含一个对象 Person 和一个技能列表 人是很直率的 我像这样使用 Html Helpers Html TextBoxFor m gt m Person FirstName 我提交表格并得到我想要的 问
  • 自定义Visual Studio的项目上下文菜单

    我正在使用带有一些加载项和扩展的 Visual Studio 2010 现在的问题是 解决方案资源管理器中项目项的上下文菜单变得如此之大 以至于我总是必须向下滚动才能找到我最常使用的 属性 和 在 Windows 资源管理器中打开 这变得非
  • 如何在 python 中将最佳概率分布模型拟合到我的数据?

    我有大约 20 000 行这样的数据 Id value 1 30 2 3 3 22 n 27 我对我的数据进行了统计 平均值33 85 中位数30 99 最小值2 8 最大值206 95 置信区间0 21 所以大多数值在33左右 并且有一些
  • 分而治之策略来确定列表中是否有超过 1/3 的相同元素

    我正在使用分治算法来确定列表中是否有超过 1 3 的元素相同 例如 1 2 3 4 不 所有元素都是唯一的 1 1 2 4 5 是的 其中 2 个是相同的 没有排序 是否有分而治之的策略 我陷入了如何划分的困境 def is valid i
  • 使用 php ping 网站

    我想创建一个 php 脚本 它将 ping 一个域并列出响应时间以及请求的总大小 这将用于监控网站网络 我尝试过curl 这是我到目前为止的代码 function curlTest2 url clearstatcache return if
  • 找不到将 SAML 应用发布到 G Suite 的位置

    我们已经在 G Suite Marketplace 上发布了一个应用程序 但我们现在希望发布一个应用程序 以便公众在转到 G Suite gt 应用程序 gt SAML 应用程序时可以使用该应用程序 然后将其列出 具体来说 我们希望将我们的
  • 在 OSX 和 GNU 中使用“find”删除带有数字的文件名

    我正在尝试搜索一个文件并删除名称中包含数字的类似文件 我的文件 txt from myfile 00 04 version txt myfile 00 txt find E iregex myfile 0 9 1 txt 删除 myfile
  • java.lang.ClassNotFoundException:由 AdMob / Google Play 服务引起的 android.os.AsyncTask?

    自 2014 年 11 月 21 日以来 我收到了数百份崩溃报告 堆栈如下 崩溃仅发生在 API 级别 10 设备上 该应用支持 9 在崩溃开始之前的几周内 该应用程序的同一版本一直运行良好 这让我认为这个问题是由最近推送到 Android
  • Azure 和直播

    我正在尝试使用 Azure 制作实时视频流 但我真的不知道应该先尝试什么 首先 有一个网站 上面有最新版本的 Flowplayer 现在我需要知道如何将网络摄像头的视频流传输到 Azure 我需要什么样的软件 我正在尝试使用 Express
  • 没有关于 bool 到浮点类型的隐式转换的警告?

    看起来这个片段在 clang 中编译时没有警告 即使使用 Weverything 也是如此 double x if fabs x gt 1 0 我错过了什么吗 或者编译器和 C 标准是否认为强制转换bool to double有道理吗 这是
  • 工厂模式和策略模式

    我需要创建一个类来负责结果集处理 但可能会发生应该使用不同的算法来处理该结果集的情况 我知道以下选项 1 使用策略模式 伪代码如下 interface Strategy processResultSet ResultSet rs class
  • 无需 Spring MVC 的定制 Spring Security

    我正在使用我自己的 MVC 实现 我不确定 Spring Security 是否不是专门为 Spring MVC 实现设计的 还可以用吗 我不清楚我应该使用 Spring Security 的哪些部分以及不需要哪些部分 我想我不需要 URL
  • C# 无法访问已释放的对象

    我正在制作一个服务器 客户端应用程序 我将服务器套接字设置为侦听 并设置 BeginAccept 方法 当我关闭服务器套接字 Socket Close 以关闭服务器时 BeginAccept 方法的异步回调方法抛出异常 我检查了异常 发现异
  • 通过反射使用私有字段对引用结构进行单元测试

    我实现了一对 ref 结构 并想为它们编写一些单元测试 当然 所有领域都是私有的 假设 API 不应该揭示类的内部工作原理 那么在某些操作之后 如何测试字段是否具有正确的值 我想避免仅仅为了适应测试而修改引用结构本身 我的第一个选择是反射
  • 具有动态变量数的公式

    假设有一些 data framefoo data frame想要找到目标列的回归Y由其他一些专栏 为此目的 通常使用一些公式和模型 例如 linear model lt lm Y FACTOR NAME 1 FACTOR NAME 2 fo
  • 为什么要加密 ASP.NET 中的查询字符串?

    我正在开发一个用 C ASP NET 编写的 Web 应用程序 该应用程序的原始设计者选择使用加密的查询字符串和Viewstate控制应用程序的 安全 和 状态 在此之前 我来自 GET POST 世界 我没有很好的基础来理解为什么人们会经
  • Flutter Websockets MacOS:相同的代码可以在调试模式下工作,但不能在发布模式下工作:“(操作系统错误:提供了节点名或服务名..)”

    Summary 我有一个在 Flutter 中使用 WebSockets 的程序 该程序在debug模式 但运行相同exact代码在release模式会导致错误 Context Flutter 文档告诉我们如何使用 WebSocket ht
  • 由于 CORS 错误,POST 请求在 React axios 中被阻止[重复]

    这个问题在这里已经有答案了 我正在尝试向包含多部分数据的 API 发送 POST 请求 我在 postman 中测试了 API 一切正常 但是当我在react中调用API时 它给了我CORS错误 我交叉检查了 URL 标头和数据 对我来说一