Question

我正在研究如何使用HttpClient的get方法，但看不到如何在get请求中传递数据。我只看到如何获取网址。我的意思是我想做这样的事情：

curl -X GET \
  http://127.0.0.1:5000/get_nodes \
  -H 'Content-Type: application/json' \
  -H 'Postman-Token: 604243c2-f9da-4f71-b356-a8e31608b45d' \
  -H 'cache-control: no-cache' \
  -d '{
    "username" : "jack_list",
    "node_name" : "nodeToFind"
}'

我想将json传递给我的请求，如上所示，带有curl -d标志。我在网上看到的所有示例都只是这样做：

this.http.get("url_of_api")，但是如果我需要将json传递到请求中怎么办？

Answer 1

HttpClient设置：

开始在Angular中使用HttpClient之前。您需要将HttpClientModule导入到AppModule中。

import {NgModule} from '@angular/core';
import {AppComponent} from './app.component';
import {HttpClientModule} from "@angular/common/http";
import {BrowserModule} from "@angular/platform-browser";

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
  ],
  bootstrap: [AppComponent],
})
export class AppModule {
}

您想在任何HttpClient使用的地方都将其注入constructor

constructor(private http: HttpClient) {}

获取：

对于get方法，可以看起来像这样。在此示例中，请求URL看起来像这样http://127.0.0.1:5000/get_nodes?username="jack_list"&nodename="nodeToFind"

const data = {
"username" : "jack_list",
"node_name" : "nodeToFind"
};
const httpOptions = {
  params: data,
  headers: new HttpHeaders({
    'Content-Type':  'application/json',
    'Postman-Token': '604243c2-f9da-4f71-b356-a8e31608b45d',
    'Cache-control': 'no-cache'
  });
this.http.get('http://127.0.0.1:5000/get_nodes', httpOptions);

帖子：

对于发布，方法将非常相似，您只需要在其中添加数据

const data = {
"username" : "jack_list",
"node_name" : "nodeToFind"
};
const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json',
    'Postman-Token': '604243c2-f9da-4f71-b356-a8e31608b45d',
    'Cache-control': 'no-cache'
  });
this.http.post('http://127.0.0.1:5000/get_nodes', data, httpOptions);

Answer 2

GET请求通常不包含请求正文。您必须将它们编码为URL。

例如：

请求“数据”的JSON表示形式：

{
    "baz": "qux",
    "wotsit": [
       1,2,'three',
    ]
}

等效的GET请求：

GET /foo/bar?baz=qux&wotsit[]=1&wotsit[]=2&wotsit[]=three

我有implemented a helper function in my answer here会将您的复杂对象编码为一系列GET参数。

角度http获取数据

2 个答案: