Corpo della richiesta Http.DELETE in Angular2

Sto provando a parlare con API un po ‘RESTful da un frontend Angular 2.

Per rimuovere alcuni elementi da una raccolta, devo inviare altri dati oltre all’ID univoco della rimozione (che può essere aggiunto all’URL), vale a dire un token di autenticazione, alcune informazioni sulla raccolta e alcuni dati ausiliari.

Il modo più semplice che ho trovato di fare è mettere il token di autenticazione nella richiesta Intestazioni e altri dati nel corpo.

Tuttavia, il modulo Http di Angular 2 non approva affatto una richiesta DELETE con un corpo e tenta di fare questa richiesta

let headers= new Headers(); headers.append('access-token', token); let body= JSON.stringify({ target: targetId, subset: "fruits", reason: "rotten" }); let options= new RequestOptions({headers:headers}); this.http.delete('http://testAPI:3000/stuff', body,options).subscribe((ok)=>{console.log(ok)}); <------line 67 

dà questo errore

 app/services/test.service.ts(67,4): error TS2346: Supplied parameters do not match any signature of call target. 

Ora, sto facendo qualcosa di sbagliato in syntax? Sono abbastanza sicuro che un corpo DELETE sia supportato per RFC

Ci sono modi migliori per inviare quei dati?

O dovrei semplicemente scaricarlo nelle intestazioni e chiamarlo un giorno?

Qualche idea su questo enigma sarebbe apprezzata

Definizione in http.js da @ angular / http :

elimina (url, opzioni)

La richiesta non accetta un corpo quindi sembra che la tua unica opzione sia quella di inserire i tuoi dati nell’URI.

Ho trovato un altro argomento con i riferimenti per corrispondere RFC, tra le altre cose: Come passare i dati nella richiesta DELETE ajax diverse dalle intestazioni

Http.delete (url, options) accetta un corpo. Hai solo bisogno di metterlo all’interno dell’object opzioni.

 http.delete('/api/something', new RequestOptions({ headers: headers, body: anyObject })) 

Interfaccia delle opzioni di riferimento: https://angular.io/api/http/RequestOptions

In realtà sei in grado di ingannare il Angular2 HTTP per inviare un body con DELETE utilizzando il metodo di request . Questo è come:

 let body = { target: targetId, subset: "fruits", reason: "rotten" }; let options = new RequestOptionsArgs({ body: body, method: RequestMethod.Delete }); this.http.request('http://testAPI:3000/stuff', options) .subscribe((ok)=>{console.log(ok)}); 

Nota, dovrai impostare il metodo di richiesta in RequestOptionsArgs e non nella http.request del primo parametro alternativo di http.request . Che per qualche ragione produce lo stesso risultato dell’uso di http.delete

Spero che questo aiuti e che non sia in ritardo. Penso che i ragazzi angolari abbiano torto qui a non permettere che un corpo venga passato con l’eliminazione, anche se è scoraggiato.

Di seguito è riportato un esempio di codice rilevante per Angular 4/5 con il nuovo HttpClient.

 import { HttpClient } from '@angular/common/http'; import { HttpHeaders } from '@angular/common/http'; public removeItem(item) { let options = { headers: new HttpHeaders({ 'Content-Type': 'application/json', }), body: item, }; return this._http .delete('/api/menu-items', options) .map((response: Response) => response) .toPromise() .catch(this.handleError); } 

In Angular 5, ho dovuto usare il metodo di richiesta invece di eliminare per inviare un corpo. La documentazione per il metodo delete non include body, ma è inclusa nel metodo di richiesta.

 import { HttpClient } from '@angular/common/http'; import { HttpHeaders } from '@angular/common/http'; this.http.request('DELETE', url, { headers: new HttpHeaders({ 'Content-Type': 'application/json', }), body: { foo: bar } }); 

Il REST non impedisce l’inclusione del corpo con la richiesta DELETE ma è preferibile utilizzare la stringa di query in quanto è più standardizzata (a meno che non sia necessario crittografare i dati)

Ho avuto modo di lavorare con angular 2 facendo quanto segue:

 let options:any = {} option.header = new Headers({ 'header_name':'value' }); options.search = new URLSearchParams(); options.search.set("query_string_key", "query_string_value"); this.http.delete("/your/url", options).subscribe(...) 

Di seguito è riportato l’esempio di codice rilevante per i progetti Angular 2/4/5:

 let headers = new Headers({ 'Content-Type': 'application/json' }); let options = new RequestOptions({ headers: headers, body: { id: 123 } }); return this.http.delete("http//delete.example.com/delete", options) .map((response: Response) => { return response.json() }) .catch(err => { return err; }); 

Si noti che il body è passato attraverso RequestOptions

Di seguito è riportato un esempio per Angular 6

 deleteAccount(email) { const header: HttpHeaders = new HttpHeaders() .append('Content-Type', 'application/json; charset=UTF-8') .append('Authorization', 'Bearer ' + sessionStorage.getItem('accessToken')); const httpOptions = { headers: header, body: { Email: email } }; return this.http.delete(AppSettings.API_ENDPOINT + '/api/Account/DeleteAccount', httpOptions); }