2
votes

angulaire http obtenir des données

Je cherche comment utiliser la méthode get de HttpClient et je ne vois pas comment je peux transmettre des données dans ma requête get. Je ne vois que comment obtenir une URL. Ce que je veux dire par là, c'est que je voudrais faire quelque chose comme ceci:

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"
}'

Je voudrais passer en json , comme indiqué ci-dessus avec le curl -d drapeau, à ma demande. Tous les exemples que je vois en ligne font simplement ceci:

this.http.get ("url_of_api") , mais que faire si je dois passer json dans ma requête?


3 commentaires

La requête GET n'a normalement pas de corps. Si vous devez envoyer des données avec un GET, utilisez des paramètres de requête. S'il doit être dans le corps, vous voulez probablement un POST ou un PUT.


D'ACCORD. Merci. par curiosité, pourquoi cette façon non standard d'utiliser GET? À partir de ce que je reçois, je devrais passer le paramètre en utilisant l'URL de ma demande GET? Quel avantage cela nous donne-t-il sur le passage en utilisant le paramètre de la manière que j'essaie de faire?


L'avantage est qu'il respecte le protocole HTTP: les requêtes GET ne sont pas censées avoir de corps. Consultez stackoverflow.com/questions/978061/http-get- with-request-bod‌ y pour une réponse plus détaillée. L'avantage est donc le même que, disons, de ne pas conduire une voiture de 8 mètres de large: les routes ne sont pas conçues pour de telles voitures, et vous êtes censé respecter les règles.


3 Réponses :


-1
votes

Les requêtes GET ne contiennent généralement pas de corps de requête. Vous devez les encoder dans l'URL.

Par exemple:

Représentation JSON de la requête "data":

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

Requête GET équivalente:

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

J'ai implémenté une fonction d'aide dans ma réponse ici qui va encoder votre objet complexe dans une série de paramètres GET.


1 commentaires

Si la commande curl que l'OP montre fonctionne, le serveur peut s'attendre aux données json dans le corps de la requête, même si elles ne sont pas standard.



-1
votes

Le HttpClient.get () de haut niveau n'offre pas de paramètre de corps de requête car un GET avec un corps n'est pas standard, vous devriez pouvoir utiliser HttpClient.request () . Notez que vous devrez peut-être également envelopper des données dans JSON.stringify () qui n'ont pas été testées.

const data = {
  "username": "jack_list",
  "node_name": "nodeToFind"
};
const headers = new HttpHeaders();
headers.set('Content-Type', 'application/json ');
headers.set('Postman-Token', '604243c2-f9da-4f71-b356-a8e31608b45d');
headers.set('cache-control', 'no-cache');
const req = new HttpRequest('GET', 'http://127.0.0.1:5000/get_nodes', data, { headers });
this.http.request(req).subscribe(res => {
  // do with res
});

mise à jour:

Il semble que le navigateur ne vous laisse pas faire cela.
Demande GET asynchrone avec le corps du navigateur https://developer.mozilla.org/en-US/ docs / Web / HTTP / Methods / GET

Ma réponse mise à jour est que ceci est impossible.


0 commentaires

2
votes

Configuration de HttpClient:

Avant de commencer à travailler avec HttpClient dans Angular. Vous devez importer HttpClientModule dans votre AppModule.

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);

Partout où vous souhaitez utiliser HttpClient code> vous devez l'injecter dans constructor

constructeur (privé http: HttpClient) {}

GET :

Pour get, la méthode peut ressembler à ceci. Dans cet exemple, l'URL de la requête ressemblera à ceci 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);


4 commentaires

this.http.get ('http://127.0.0.1:5000/get_nodes', data, httpOptions); génère l'erreur "Attendu 1-2 arguments, mais obtenu 3."


Je suis désolé qu'il y ait une erreur. J'ai mis à jour la réponse.


mais maintenant c'est un POST, OP demande GET ce que je ne pense pas possible.


Je l'ai mis à jour à nouveau et ajouté l'envoi de données avec QueryParams, c'est le seul moyen si je vais bien. Les deux exemples devraient maintenant faire de même.