0

我正在使用 Angular Http 在 Angular 项目中发出 http 发布请求，并且出现以下错误。

预检响应中的 Access-Control-Allow-Headers 不允许请求标头字段 Content-Type。

但是如果我使用 jquery 发出该发布请求，我不会收到任何错误，它会按照需要的方式执行。

这是我正在使用的 jquery 代码，它可以正常工作。

$(function () {
  $.post(
    "http://www.anything.com/pdfGenerator/",
    {
      orientation: "portrait",
      paperSize  : "letter",
      return_url : "true",
      htmlContent: `<h1>Hello</h1>`
    }
  ).done(function (data) {
    alert("Data Loaded: " + data);
  });
});

这是 Angular 代码，它不起作用，我收到上述错误。

this.url = "http://www.anything.com/pdfGenerator/";

let body:any = {
  orientation: "portrait",
  paperSize  : "letter",
  htmlContent: `<h1>Hello</h1>`,
  return_url : "true",
};

this.http.post(this.url, body).
     subscribe(res => console.log(res));

我听说有人说Response-Header在服务器端添加 Content-Type。我的意思是，如果使用 jquery 可以正常工作，我为什么要在服务器上的响应标头中添加它。如果它通过 jquery 工作而没有做任何额外的事情，那么 angular 也应该运行它而不显示错误。

我做错了什么？我应该怎么做才能使它在角度运行而不修改服务器，因为 jquery 已经在这样做了？

4

1 回答 1

0

可能发生的一件事是 jQuery 发送的Content-Type不是 Angular 的 $http。这可能是默认值，因此您可以尝试更新它以匹配 jQuery（您可以检查网络请求以比较正在发送的标头并找到差异）。在这种情况下，可能是 jQuery 默认为Content-Type您的服务器所期望的，而 angular 默认为其他值。要在 Angular 上设置内容类型，您可以使用以下语法：[1]

this.http.post(this.url, body, { headers: {'Content-Type': 'application/json'} })

我看到将主体字符串化可以解决此类问题的情况，由于我无法访问您的环境，因此无法判断这是否是您的具体情况，但您可以试一试：

this.http.post(this.url, JSON.stringify(body))

[1] https://docs.angularjs.org/api/ng/service/ $http#post

于 2017-10-08T01:42:51.850 回答