在 Nativescript 应用程序中的服务器上发送 http.patch 请求答案

【问题标题】：Send http.patch request on server in Nativescript application在 Nativescript 应用程序中的服务器上发送 http.patch 请求
【发布时间】：2016-11-01 11:33:12
【问题描述】：

我正在尝试在 Nativescrpt(Typescript + Angular2) 应用程序中的服务器上发送 http.patch 请求。后端是用 Python(Django) 编写的

这是我的要求

  updateOrder(id, message) {
  let headers = new Headers();
  headers.append("Authorization", "Token " + Config.token);
  headers.append("Content-Type", "application/json");
  return this.http.patch(
      Config.apiUrl + "orders/" + id + "/",
      message,
      {headers: headers}
  )
  .map(response => response.json())
  .catch((res: Response) => this.handleErrors(res));

我在这里发送它。

changeStatus(status){
    var message = JSON.stringify({status: status});
    this.orderService.updateOrder(this.order.id, message).subscribe(
        data => console.log(data),
        err => alert(JSON.stringify(err))
    );
}

但是服务器返回这样的数据：

{"_body":{},"status":200,"ok":true,"statusText":"","headers":{},"type":3,"url":null}

我想要更改的属性“状态”保持不变。

我做错了什么？

【问题讨论】：

“我想要更改的属性“状态”保持不变。” - 这不是您应该在服务器端执行的操作吗？如果这不是您的问题，您能否澄清一下问题所在。目前还不是很清楚
服务器端有一个方法应该处理这个查询，但我的问题是查询似乎没有发送，因为我的数据没有变化。
你在服务器端做过调试吗？
我提出了调试点，但我的查询忽略了这一点。据我了解，查询没有到达服务器。我不明白为什么。

标签： http angular typescript patch nativescript

【解决方案1】：

您可以使用 NativeScript 中的 http 模块。

发送 PATCH 应该类似于以下示例：

page.ts（TypeScript 示例）

  import * as http from"http";
  http.request({
      url: "https://httpbin.org/patch",
      method: "PATCH",
      headers: { "Content-Type": "application/json" },
      content: JSON.stringify({ MyVariableOne: "ValueOne", MyVariableTwo: "ValueTwo" })
  }).then(response => {
      var result = response.content.toJSON();
      console.log(result);
  });
}

HTTP 模块的 API 参考：https://docs.nativescript.org/api-reference/modules/http.html

此处的文档文章：https://docs.nativescript.org/cookbook/http#post-json

【讨论】：

我试过了，但在这种情况下，我遇到了下一个错误：错误 TS2345: Argument of type '{ url: string;方法：字符串；标头：标头；内容：任意； }' 不可分配给类型为 'string | 的参数要求'。对象字面量只能指定已知属性，而 'content' 不存在于类型 'string |请求”。

【解决方案2】：

当我需要发出 http 请求时，我会这样做：

1.- 在 Root App NgModule 中导入 NativeScript http 模块：

import { NativeScriptHttpModule } from "nativescript-angular/http";
...
@NgModule({
  imports: [
      ...
      NativeScriptHttpModule,
      ...
  ],
  declarations: [AppComponent],
  bootstrap: [AppComponent]
})

2.- 将 Angular http（和头文件，如果需要）导入组件：

import { Http, Headers } from '@angular/http';

3.- 在构造函数中注入：

constructor(private http: Http, ...) { ... }

4.- 使用 http 方法（即此处的 POST，但适用于任何方法）：

var url = "http://www.api-url.com/example.php";
var body = {foo: "foo", bar:"bar"};
let headers = new Headers();
headers.append("Authorization", token); //You can append any header you need
headers.append("Content-Type", "application/json");
this.http.post(url, body, { headers: headers })
    .map(res => res.json())
    .subscribe(
        data => this.connectionEstablished(data),
        err => this.handleErrors(err)
    );

如果您在使用方法 map() 时遇到任何错误，则需要添加以下行：

import "rxjs/add/operator/map";

希望对你有帮助！

【讨论】：