angular 2 http post 不工作

Question

这是我的代码：

const dummydata = {
  param1: 72766,
  param2: 'ELS'
}

var foo = JSON.stringify(dummydata)

let headers = new Headers();
headers.append('content-type', 'application/json');

this.http.post(url, foo, { headers: headers }).map(res => res.json()).subscribe(
  () => { alert('Success'); }
);

由于某种原因，没有数据作为 form-data 在 Request Payload 中发送到服务器，并且类型正在转换为 OPTIONS 而不是 POST 另一方面，如果我删除 headers，那么 form-data 会继续但会发生另一个错误：

415 Unsupported Media Type

更新：JQuery Ajax 正在工作

更新 2：已经尝试过：

let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });

Answer 1

Angular 执行 post 请求的方式。

const dummydata= {param1:72766,
        param2:'ELS'}

    var foo=    JSON.stringify(dummydata);

    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({ headers: headers });


 this.http.post(url, foo,{headers: headers} ).map(res=>res.json()).subscribe(
            () => { alert('Success'); }
        );

有关更多信息，请查看此 link https://angular.io/docs/ts/latest/guide/server-communication.html

Answer 2

You can try this:

const dummydata = {
 param1: 72766,
 param2: 'ELS'
}

import {Headers, RequestOptions} from 'angular2/http';


let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });

 this.http.post(url, dummydata, options).map(res=>res.json()).subscribe(
        () => { alert('Success'); }
    );

Answer 3

你必须检查你的服务器是否支持 OPTIONS 请求，如果不支持你需要在你的 htaccess 文件中添加这些行

Header 添加 Access-Control-Allow-Headers "origin, x-requested-with, content-type" Header 添加 Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

Answer 4

应该是CORS的问题。
当您从浏览器发出 CORS 请求时（调用不同的 URL 然后是 javascript 文件的主机）它会在任何其他请求之前自动发出 OPTIONS 请求制成。如果响应合适，它将发出 GET、POST、DELETE、PUT 请求，如代码中所写。
示例：

您想向 myserver.com/add-book/

POST

浏览器将向 myserver.com/add-book/

OPTIONS

如果对 OPTIONS 的响应包含请求的 header 等（例如 Allowed-Methods header）POST 请求将被执行

因此您需要在您的服务器和 REST API 上启用 OPTIONS 请求。如果您使用 JWT 身份验证，您需要将 OPTIONS 请求标记为安全 - JWT 不需要在您请求的 header 中。
More 关于 OPTIONS 请求

Answer 5

我找到了一种更好的方法来解决这个 CORS 问题，方法是使用 Angular CLI 为 API 调用配置代理：

我创建了一个 proxy.conf.json:

{
  "/API": {
    "target": "http://myserver.com",
    "secure": false
  },
  "/API2":{
    "target": "http://myserver.com",
    "secure": false
  }
}

然后在package.json下scripts：

"start": "ng serve --proxy-config proxy.conf.json",

现在调用 API 只需提供像“/API/getData”这样的 URL，CLI 将自动重定向到 http://myserver.com/API/getData

angular 2 http post 不工作

angular 2 http post not working

http

rxjs5

angular