.htaccess “；Access Control Allow Origin标头包含多个值”；错误

我在尝试使用axios在reactjs应用程序中执行

ajax

调用时遇到了很多错误。我有一个

api

，它位于子域中，并从主域进行调用

.htaccess：

Header add Access-Control-Allow-Origin: "*"
Header add Access-Control-Allow-Credentials: "true"
Header add Access-Control-Allow-Methods: "GET,HEAD,OPTIONS,POST,PUT"
Header add Access-Control-Allow-Headers: "Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers"

reactjs中的ajax头（使用axios）：

我试着对每一个都做了更改，但得到了不同的错误。如果我有

标题add Access Control Allow Origin:“*”

它会抱怨双原点。如果我删除它，我会得到一个错误，关于飞行前响应中的访问控制允许标头不允许访问控制允许原点其他更改已响应为飞行前响应中的访问控制允许标头不允许访问控制允许标头

我使用wordpress作为无头CMS，并利用restful api获取我需要的数据。我注意到，如果我删除了所有这些，我可以

获得

我的数据，但是如果不解决跨域问题，我就不能

发布

如果我删除它，我会得到一个错误，关于飞行前响应中的访问控制允许标头不允许访问控制允许原点其他更改已响应为飞行前响应中的访问控制允许标头不允许访问控制允许标头

这两条错误消息都会发生，因为在前端JavaScript代码中有以下内容：

headers: {
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'GET,HEAD,OPTIONS,POST,PUT',
    'Access-Control-Allow-Headers': 'Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers'
}

您需要从请求代码中删除整个

标题

选项

原因是，所有的

访问控制允许-*

头都是服务器必须返回的响应头。将它们作为请求头发送所产生的唯一影响就是导致问题中引用的错误类型

如果添加它们的原因是服务器端发送请求的API端点的

.htaccess

设置没有使服务器发送正确的响应头，那么您需要找出原因并在服务器端修复。从客户端发送额外的请求头并不能解决这个问题

建议您尝试使用

.htaccess

：使用

标题集，而不是
标题添加
：

Header set Access-Control-Allow-Origin: "*"
Header set Access-Control-Allow-Credentials: "true"
Header set Access-Control-Allow-Methods: "GET,HEAD,OPTIONS,POST,PUT"
Header set Access-Control-Allow-Headers: "Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers"

Header set
告诉Apache覆盖/删除可能已经是特定头集的任何现有值，而
Header add
告诉Apache只添加具有给定名称和值的头，而不覆盖可能已经使用该名称设置的任何头

因此，
Header add
会导致在响应中发送具有相同名称的多个头，在这种情况下，浏览器将其视为具有多个值的单个头。您不希望这样。
尝试将标题
'Access-Control-Allow-Origin'：'*'，
修改为
'Access-Control-Allow-Origin'：'http://admin.mysite.com“，
当我这样做时，我会得到错误，
对飞行前请求的响应未通过访问控制检查：'access control Allow Origin'标头包含多个值'http://example.com，*'，但只允许一个。起源'http://example.com因此，不允许访问。
是的，因此在服务器代码/配置的其他地方，已经有人为访问控制允许源设置了一个值。如果它没有设置您想要的值，并且您不能用“Header set”覆盖它，那么您需要准确地找到设置它的内容/位置，并将代码更改为设置您想要的实际值
Header set Access-Control-Allow-Origin: "*"
Header set Access-Control-Allow-Credentials: "true"
Header set Access-Control-Allow-Methods: "GET,HEAD,OPTIONS,POST,PUT"
Header set Access-Control-Allow-Headers: "Access-Control-Allow-Headers, Origin,Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers"