Access-Control-Allow-Headers不允许请求标头字段Access-Control-Allow-Headers

Question

我正在尝试使用发布请求将文件发送到我的服务器,但是当它发送它时会导致错误:

$http.post($rootScope.URL, {params: arguments}, {headers: {
    "Access-Control-Allow-Origin" : "*",
    "Access-Control-Allow-Methods" : "GET,POST,PUT,DELETE,OPTIONS",
    "Access-Control-Allow-Headers": "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"
}

所以我用Google搜索了错误并添加了标题:

$http.post($rootScope.URL, {params: arguments}, {headers: {
    "Access-Control-Allow-Origin" : "*",
    "Access-Control-Allow-Methods" : "GET,POST,PUT,DELETE,OPTIONS",
    "Access-Control-Allow-Headers": "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"
}

然后我得到错误:

$http.post($rootScope.URL, {params: arguments}, {headers: {
    "Access-Control-Allow-Origin" : "*",
    "Access-Control-Allow-Methods" : "GET,POST,PUT,DELETE,OPTIONS",
    "Access-Control-Allow-Headers": "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"
}

所以我用谷歌搜索了那个,我能找到的唯一类似的问题提供了一个半答案然后关闭作为主题.我应该添加/删除哪些标题？

Answer 1

我有同样的问题.在jQuery文档中我发现:

对于跨域请求,内容类型设置为比其他任何东西application/x-www-form-urlencoded,multipart/form-data或text/plain将触发浏览器发送预检OPTIONS请求到服务器.

因此,虽然服务器允许跨源请求但不允许Access-Control-Allow-Headers,但它会抛出错误.默认情况下,角度内容类型是application/json尝试发送OPTION请求.尝试覆盖角度默认标头或允许Access-Control-Allow-Headers在服务器端.这是一个有角度的样本:

$http.post(url, data, {
    headers : {
        'Content-Type' : 'application/x-www-form-urlencoded; charset=UTF-8'
    }
});

Answer 2

的服务器(即POST请求被发送到)需要包括Access-Control-Allow-Headers报头(等)在它的响应.将它们放入客户的请求中无效.

这是因为由服务器指定它接受跨源请求(并且它允许Content-Type请求头等等) - 客户端无法自行决定给定服务器应该允许CORS.

Answer 3

如果这对任何人都有帮助,即使是这种穷人,因为我们必须只允许这个用于开发目的,这是一个Java解决方案,因为我遇到了同样的问题.[编辑]不要使用外卡*,因为它是一个糟糕的解决方案,如果你真的需要一些在本地工作的东西,请使用localhost.

public class SimpleCORSFilter implements Filter {

public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
    HttpServletResponse response = (HttpServletResponse) res;
    response.setHeader("Access-Control-Allow-Origin", "my-authorized-proxy-or-domain");
    response.setHeader("Access-Control-Allow-Methods", "POST, GET");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers", "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");
    chain.doFilter(req, res);
}

public void init(FilterConfig filterConfig) {}

public void destroy() {}

}

Answer 4

服务器(发送POST请求)需要在其响应中包含Content-Type标头.

以下是要包含的典型标头列表,包括一个自定义"X_ACCESS_TOKEN"标头:

"X-ACCESS_TOKEN", "Access-Control-Allow-Origin", "Authorization", "Origin", "x-requested-with", "Content-Type", "Content-Range", "Content-Disposition", "Content-Description"

这就是您的http服务器人员需要为您发送请求的Web服务器配置的内容.

您可能还想让服务器人员公开"Content-Length"标题.

他将此视为跨源资源共享(CORS)请求,并应了解进行这些服务器配置的含义.

详情见:

• http://www.w3.org/TR/cors/
• http://enable-cors.org/

Answer 5

您可以使用以下方法在PHP中激活适当的标头：

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");
header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, X-Requested-With");

Answer 6

以下适用于nodejs:

xServer.use(function(req, res, next) {
  res.setHeader("Access-Control-Allow-Origin", 'http://localhost:8080');
  res.setHeader('Access-Control-Allow-Methods', 'POST,GET,OPTIONS,PUT,DELETE');
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type,Accept');

  next();
});

Answer 7

如果您正在使用localhostPHP，并将其设置为解决该问题：

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Headers: Content-Type'); 

从您的前端使用来看：

{headers: {"Content-Type": "application/json"}}

繁荣不再有问题localhost！

Answer 8

在Asp Net Core中，快速使其能够用于开发；中Startup.cs，Configure method添加

app.UseCors(options => options.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader());