Angular2的http POST主体发送为null

时间:2017-04-13 15:05:28

标签: angular

对于POST请求,我的服务器需要以下内容:

{
  "contextId": 0,
  "role": "Test",
  "eng_reason": "string",
  "aspiration": "string",
  "perception": "string",
  "hobbies": [
    {
      "hobbyId": 0,
      "name": "string",
      "selected": true,
      "contextId": 0
    }
  ],
  "interests": [
    {
      "interestId": 0,
      "name": "string",
      "selected": true,
      "contextId": 0
    }
  ],
  "skills": [
    {
      "skillId": 0,
      "name": "string",
      "selected": true,
      "contextId": 0
    }
  ],
  "connections": [

  ]
}

我的服务有以下功能:

  createContext(context: ContextlModel): Observable<ContextlModel[]>{

    let body=JSON.stringify(context)
    console.log(body)

    let headers = new Headers({ 'Access-Control-Allow-Origin': '*' });
    let options = new RequestOptions({ headers: headers });

    return this.http.post(this.base_url + 'Context', {body} , options)
    .map(this.extractData)
    .catch(this.handleError);
  }

console.log(body)打印:

{"contextId":0,"role":"Manager","eng_reason":"Manager","aspiration":"Test","perception":"Test","hobbies":[{"hobbyId":0,"name":"Sport","selected":true,"contextId":0},{"hobbyId":0,"name":"Reading","selected":false,"contextId":0},{"hobbyId":0,"name":"Music","selected":false,"contextId":0},{"hobbyId":0,"name":"Travelling","selected":false,"contextId":0},{"hobbyId":0,"name":"Movies","selected":false,"contextId":0},{"hobbyId":0,"name":"Cooking","selected":false,"contextId":0}],"interests":[{"interestId":0,"name":"Robotics","selected":false,"contextId":0},{"interestId":0,"name":"Designs","selected":false,"contextId":0},{"interestId":0,"name":"Web development","selected":false,"contextId":0},{"interestId":0,"name":"Mobile development","selected":false,"contextId":0},{"interestId":0,"name":"Agile","selected":false,"contextId":0},{"interestId":0,"name":"DevOps","selected":false,"contextId":0}],"skills":[{"skillId":0,"name":"Leadership","selected":false,"contextId":0},{"skillId":0,"name":"Adaptability","selected":false,"contextId":0},{"skillId":0,"name":"Communication","selected":false,"contextId":0},{"skillId":0,"name":"Time management","selected":false,"contextId":0},{"skillId":0,"name":"Critical thinking","selected":false,"contextId":0},{"skillId":0,"name":"Negotiating & persuading","selected":false,"contextId":0}],"connections":[]}

然而,我得到的回应如下:

[
  {
    "contextId": 11,
    "role": null,
    "eng_reason": null,
    "aspiration": null,
    "perception": null,
    "hobbies": [],
    "interests": [],
    "skills": [],
    "connections": []
  }
]

一切基本上都是空的。为什么会这样?为什么即使在JSON.stringify()之后它也没有正确设置我的身体?

更新

  private extractData(res: Response) {
    let body = res.json();
    return body || { };
  }

如果我复制这个console.log(正文)并通过我的Swagger API发布它,它就会成功,这意味着我的Angular POST请求中存在一些问题。

1 个答案:

答案 0 :(得分:1)

你让它变得比它需要的更复杂。 Angular会在发送之前将您的对象转换为JSON。您只需要提供要发送的对象:

  createContext(context: ContextlModel): Observable<ContextlModel[]>{
    let headers = new Headers({ 'Access-Control-Allow-Origin': '*' });
    let options = new RequestOptions({ headers: headers });

    return this.http.post(this.base_url + 'Context', context, options)
    .map(this.extractData)
    .catch(this.handleError);
  }

PS - 我经常发现从浏览器的角度使用Chrome的开发工具网络选项卡来确定POST的确切内容很有用。它可以帮助我调试这样的问题。