Angular 2 http post params and body

Question

我正试图通过我的角度应用程序进行api调用.我想要做的是使用命令参数向api发送一个post请求.我已经做了很多服务器端测试以及完成传出请求,$_POST而且body数据永远不存在.因此,我很确定这个问题存在于这段代码中.

public post(cmd: string, data: object): Observable<any> {

    const params = new URLSearchParams();
    params.set('cmd', cmd);

    const options = new RequestOptions({
      headers: this.getAuthorizedHeaders(),
      responseType: ResponseContentType.Json,
      params: params,
      body: data,
      withCredentials: false
    });

    console.log('Options: ' + JSON.stringify(options));

    return this.http.post('http://t2w.dev/index.php', data, options)
      .map(this.handleData)
      .catch(this.handleError);
  }

我尝试了许多不同的JSON结构,data但这是我尝试发送的核心:

{
  "Username": "No thanks",
  "Password": "Donno"
}

this.handleData并且this.handleError是一种将数据和错误作为参数的方法,并返回我想要的内容.

api设置为记录任何通过$_POST哪些工作正常运行请求从任何地方,但我的角度应用程序.到目前为止我做了什么:

1. 传递原始查询而不是URLSearchParams.
2. 没有身体传递请求.
3. 传递RequestOptions中的所有值.
4. 将params作为字符串传递.
5. 传递身体作为params.
6. 传递身体为JSON.stringify({"用户名":"不,谢谢","密码":"唐诺"}

控制台输出 RequestOptions

选项:{"method":null,"headers":{"Content-Type":["application/json"],"Accept":["application/json"],"X-CLIENT-ID":[" 380954038 "]," X-CLIENT-SECRET ":[" 5BgqRO9BMZ4iocAXYjjnCjnO7fHGN59WP8BTRZ5f "]},"身体":"{}", "URL":NULL, "PARAMS":{ "rawParams": "", "queryEncoder": {},"paramsMap":{}},"withCredentials":false,"responseType":1} VM8529:1 XHR完成加载:POST" http://t2w.dev/index.php ".

任何人都有任何线索为什么数据永远不会被发送？

Answer 1

http.post的第二个参数是消息的主体,即有效负载而不是url搜索参数.传入data该参数.

从文档中

post(url: string, body: any, options?: RequestOptionsArgs) : Observable<Response>

public post(cmd: string, data: object): Observable<any> {

    const params = new URLSearchParams();
    params.set('cmd', cmd);

    const options = new RequestOptions({
      headers: this.getAuthorizedHeaders(),
      responseType: ResponseContentType.Json,
      params: params,
      withCredentials: false
    });

    console.log('Options: ' + JSON.stringify(options));

    return this.http.post(this.BASE_URL, data, options)
      .map(this.handleData)
      .catch(this.handleError);
  }

编辑

您还应该查看第一个参数(BASE_URL).它必须包含您要访问的完整URL(减去查询字符串).我提到由于你给它的名字,我只能猜测当前的价值(也许只是域名？).

此外,无需调用JSON.stringifyhttp主体中发送的数据/有效负载.

如果仍然无法达到终点,请查看开发控制台中浏览器的网络活动,以查看正在发送的内容.然后,您可以进一步确定是否使用正确的标题和正文调用正确的结束点.如果它看起来是正确的,那么使用POSTMAN或Fiddler或类似的东西来查看你是否可以按照这种方式命中你的端点(在Angular之外).

Answer 2

它有效,谢谢@trichetriche.这个问题在我RequestOptions,显然,你不能传递params或者body在RequestOptions使用后一段时间.删除其中一个给我一个错误,删除它们并且它的工作原理.仍然没有最终解决我的问题,但我现在有一些工作要做.最终的工作代码.

public post(cmd: string, data: string): Observable<any> {

    const options = new RequestOptions({
      headers: this.getAuthorizedHeaders(),
      responseType: ResponseContentType.Json,
      withCredentials: false
    });

    console.log('Options: ' + JSON.stringify(options));

    return this.http.post(this.BASE_URL, JSON.stringify({
      cmd: cmd,
      data: data}), options)
      .map(this.handleData)
      .catch(this.handleError);
  }