Тело Http.Удалить запрос в Angular2

Я пытаюсь поговорить с несколько спокойным API из углового интерфейса 2.

чтобы удалить какой-то элемент из коллекции, мне нужно отправить некоторые другие данные в дополнение к уникальному идентификатору removée(который может быть добавлен к url), а именно токен аутентификации, некоторую информацию о коллекции и некоторые вспомогательные данные.

самый простой способ, который я нашел, - это поместить маркер аутентификации в заголовки запросов и другие данные в тело.

однако Http-модуль Angular 2 не совсем одобряет запрос на удаление с телом и пытается сделать этот запрос

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

дает эту ошибку

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

теперь, я делаю что-то неправильно синтаксически? Я уверен, что тело удаления поддерживается для RFC

есть ли лучшие способы отправить эти данные?

или я должен просто сбросить его в заголовки и назвать его днем?

любое понимание этой головоломки быть оцененным

27
angular http-delete rest

8 ответов

определение в http.js из @angular / http:

Удалить (url, параметры)

запрос не принимает тело, поэтому кажется, что ваш единственный вариант - это ваши данные в URI.

Я нашел другую тему со ссылками, чтобы соответствовать RFC, среди прочего: как передать данные в запросе ajax DELETE, кроме заголовков

2

http.delete (url, options)принимает тело. Вам просто нужно поместить его в объект options.

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

интерфейс опорных параметров: https://angular.io/api/http/RequestOptions

65

вы на самом деле способны обмануть Angular2 HTTP во время отправки body С DELETE С помощью request метод. Вот как:

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

Примечание, вам нужно будет установить метод запроса в RequestOptionsArgs и не в http.request'альтернативный первый параметр s Request. Это по какой-то причине дает тот же результат, что и использование http.delete

надеюсь, это поможет и что я не опоздаю. Я думаю, что угловатые ребята ошибаются здесь, чтобы не позволить телу быть переданным с удалением, даже хотя это обескураживает.

15

Ниже приведен соответствующий пример кода для Angular 4/5 с новым 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);
  }
5

в Angular 5 мне пришлось использовать метод запроса вместо delete для отправки тела. Документация для метода delete не включает тело, но она включена в метод запроса.

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

остальное не предотвращает включение тела с запросом на удаление, но лучше использовать строку запроса, поскольку она наиболее стандартизирована (если вам не нужны данные для шифрования)

Я получил его для работы с angular 2, выполнив следующие действия:

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(...)
1

Ниже приведен соответствующий пример кода для угловых проектов 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;
  });

обратите внимание, что body проходит через RequestOptions

0

Ниже приведен пример для 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<any>(AppSettings.API_ENDPOINT + '/api/Account/DeleteAccount', httpOptions);
        }
0