web-dev-qa-db-fra.com

Angular 2 - Demande Get Http - Passer l'objet json

Comment puis-je faire une requête http get et passer un objet json

C'est mon objet json

{{firstname:"Peter", lastname:"Test"}

et cet objet que je veux transmettre à la demande http pour obtenir une liste des personnes correspondantes.

comment est-ce possible? Cet exemple montre simplement une simple requête get avec un résultat json. Comment dois-je le modifier?

//Component:

person:Person;
persons:Person [];
....
//Whre can I pass the person, here in the service??
getMatchedPersons(){
  this.httpService.getMatchedPersons().subscribe(
     data =>  this.persons = data,
    error => aller(error)
    );
 ); 
  

  //SERVICE
  //pass parameters?? how to send the person object here?
  getMatchedPersons(){
    return this.http.get('url').map(res => res.json());
  }

9
hamras

Pour le javascript pur:

Vous devez sérialiser votre json à une liste de paramètres:

?firstname=peter&lastname=test

et l'ajouter à l'URL car les demandes GET n'ont pas de corps.

Il existe plusieurs façons de convertir JSON en paramètres de requête . Ils sont traités dans cette question: Existe-t-il une fonction native permettant de convertir JSON en paramètres d’URL?

Là vous pouvez choisir le poison de votre goût, le mien était:

function obj_to_query(obj) {
    var parts = [];
    for (var key in obj) {
        if (obj.hasOwnProperty(key)) {
            parts.Push(encodeURIComponent(key) + '=' + encodeURIComponent(obj[key]));
        }
    }
    return "?" + parts.join('&');
}

Mais rappelez-vous que les requêtes GET doivent respecter la limite d'URL basée sur cette réponse il est recommandé de rester sous 2000 caractères pour être sûr:

RFC dit 8000
IE8 et IE9 vont jusqu'en 2083
Les moteurs de recherche ne lisent que jusqu'en 2048

Utiliser Angular2 URLSearchParams

Avec la même méthode de conversion d'un JSON simple en arguments, vous pouvez utiliser URLSearchParams comme suggéré par Рома Скидан:

 let params: URLSearchParams = objToSearchParams(obj);

 return this.http.get('url', {
   search: params
 }).subscribe(
   (response) => //some manipulation with response 
 );

 function objToSearchParams(obj): URLSearchParams{
    let params: URLSearchParams = new URLSearchParams();
    for (var key in obj) {
        if (obj.hasOwnProperty(key))
            params.set(key, obj[key]);
    }
    return params;
 }
5
SparK

La méthode Http.get prend un objet qui implémente RequestOptionsArgs en tant que second paramètre.

Le champ de recherche de cet objet peut être utilisé pour définir une chaîne ou un objet URLSearchParams .

Un exemple:

 // Parameters obj-
 let params: URLSearchParams = new URLSearchParams();
 params.set('firstname', yourFirstNameData);
 params.set('lastname', yourLastNameData);

 //Http request-
 return this.http.get('url', {
   search: params
 }).subscribe(
   (response) => //some manipulation with response 
 );
3
Roman Skydan

Peut-être que vous voulez stringifier l'objet json

var json = JSON.stringify(myObj);

this.http.get('url'+'?myobj='+encodeURIComponent(json))
1
AngJobs on Github

Utilisez une requête POST pour transmettre des objets au serveur:

//SERVICE
getMatchedPersons(searchObj: any){
    return this.http.post('url', JSON.stringify(searchObj))
                    .map(res => res.json());
}

Vous pouvez ensuite transmettre l'objet JS de votre choix et l'envoyer au serveur dans votre requête http.

getMatchedPersons(searchObj: any){
    this.httpService.getMatchedPersons(searchObj: any).subscribe(
        data =>  this.persons = data,
        error => alert(error);
    );
); 
0
rinukkusu