Axios Usunąć żądanie z treścią i nagłówkami?

Używam Axios podczas programowania w ReactJS i udaję, że wysyłam żądanie DELETE do mojego serwera.

Aby to zrobić, potrzebuję nagłówków:

headers: {
  'Authorization': ...
}

a ciało składa się z

var payload = {
    "username": ..
}

Szukałem w Internecie i stwierdziłem tylko, że metoda DELETE wymaga „param” i nie przyjmuje żadnych „danych”.

Próbowałem to wysłać tak:

axios.delete(URL, payload, header);

lub nawet

axios.delete(URL, {params: payload}, header);

Ale wydaje się, że nic nie działa ...

Czy ktoś może mi powiedzieć, czy jest możliwe (przypuszczam, że jest) wysłanie żądania DELETE z nagłówkami i treścią i jak to zrobić?

Z góry dziękuję!

Więc po wielu próbach okazało się, że działa.

Proszę postępować zgodnie z kolejnością kolejności , jest bardzo ważne, bo inaczej nie zadziała

axios.delete(URL, {
  headers: {
    Authorization: authorizationToken
  },
  data: {
    source: source
  }
});

axiox.deleteobsługuje treść żądania. Akceptuje dwa parametry: url i opcjonalną konfigurację. Możesz użyć, config.dataaby ustawić treść żądania i nagłówki w następujący sposób:

axios.delete(url, { data: { foo: "bar" }, headers: { "Authorization": "***" } });

Zobacz tutaj - https://github.com/axios/axios/issues/897

Oto krótkie podsumowanie formatów wymaganych do wysyłania różnych czasowników http z axios:

• GET: Dwie drogi

  • Pierwsza metoda

    axios.get('/user?ID=12345')
      .then(function (response) {
        // Do something
      })
    

  • Druga metoda

    axios.get('/user', {
        params: {
          ID: 12345
        }
      })
      .then(function (response) {
        // Do something
      })
    

  Dwa powyższe są równoważne. Obserwuj paramssłowo kluczowe w drugiej metodzie.

• POST i PATCH

  axios.post('any-url', payload).then(
    // payload is the body of the request
    // Do something
  )
  
  axios.patch('any-url', payload).then(
    // payload is the body of the request
    // Do something
  )
  

• DELETE

  axios.delete('url', { data: payload }).then(
    // Observe the data keyword this time. Very important
    // payload is the request body
    // Do something
  )
  

Kluczowe wnioski

• getżądania opcjonalnie wymagają paramsklucza do prawidłowego ustawienia parametrów zapytania
• deleteżądania z treścią muszą być ustawione pod datakluczem

axios. Usuwanie znaczy przeszły URL i opcjonalnej konfiguracji .

axios.delete (url [, config])

Pola dostępne w konfiguracji mogą zawierać nagłówki .

To sprawia, że ​​wywołanie API można zapisać jako:

const headers = {
  'Authorization': 'Bearer paperboy'
}
const data = {
  foo: 'bar'
}

axios.delete('https://foo.svc/resource', {headers, data})

Miałem ten sam problem, który rozwiązałem w ten sposób:

axios.delete(url, {data:{username:"user", password:"pass"}, headers:{Authorization: "token"}})

Właściwie axios.deleteobsługuje treść żądania.
Akceptuje dwa parametry: a URLi opcjonalny config. To jest...

axios.delete(url: string, config?: AxiosRequestConfig | undefined)

Aby ustawić treść odpowiedzi dla żądania usunięcia, możesz wykonać następujące czynności:

let config = { 
    headers: {
        Authorization: authToken
    },
    data: { //! Take note of the `data` keyword. This is the request body.
        key: value,
        ... //! more `key: value` pairs as desired.
    } 
}

axios.delete(url, config)

Mam nadzieję, że to komuś pomoże!

Aby usunąć, musisz wykonać następujące czynności

axios.delete("/<your endpoint>", { data:<"payload object">})

U mnie to zadziałało.

Aby wysłać HTTP DELETE z kilkoma nagłówkami przez axios, zrobiłem to:

  const deleteUrl = "http//foo.bar.baz";
  const httpReqHeaders = {
    'Authorization': token,
    'Content-Type': 'application/json'
  };
  // check the structure here: https://github.com/axios/axios#request-config
  const axiosConfigObject = {headers: httpReqHeaders}; 

  axios.delete(deleteUrl, axiosConfigObject);

axiosSkładni dla różnych czasowników HTTP (GET, POST, PUT, DELETE) jest trudne, ponieważ czasami 2nd parametr ma być ciało HTTP, niektóre inne czasy (kiedy to może nie być potrzebne) po prostu przekazać nagłówki w 2-gim parametrze .

Załóżmy jednak, że musisz wysłać żądanie HTTP POST bez treści HTTP, a następnie musisz przekazać undefinedjako drugi parametr.

Należy pamiętać, że zgodnie z definicją obiektu konfiguracyjnego ( https://github.com/axios/axios#request-config ) nadal można przekazać treść HTTP w wywołaniu HTTP przez datapole podczas wywołania axios.delete, jednak dla HTTP DELETE czasownik zostanie zignorowany.

To zamieszanie między drugim parametrem będącym czasami treścią HTTP, a innym razem całym configobiektem axioswynika z tego, jak zostały zaimplementowane reguły HTTP. Czasami treść HTTP nie jest potrzebna, aby wywołanie HTTP zostało uznane za prawidłowe.

Napotkałem ten sam problem ... rozwiązałem go, tworząc niestandardową instancję axios. i używając go do wysłania uwierzytelnionego żądania usunięcia.

const token = localStorage.getItem('token');
const request = axios.create({
        headers: {
            Authorization: token
        }
    });

await request.delete('<your route>, { data: { <your data> }});

znalazłem sposób, który działa:

axios
      .delete(URL, {
        params: { id: 'IDDataBase'},
        headers: {
          token: 'TOKEN',
        },
      }) 
      .then(function (response) {
        
      })
      .catch(function (error) {
        console.log(error);
      });

Mam nadzieję, że to zadziała również dla Ciebie.

Wypróbowałem wszystkie powyższe, które nie zadziałały. Skończyło się na tym, że po prostu poszedłem z PUT (inspiracja znaleziona tutaj ) i właśnie zmieniłem logikę po stronie serwera, aby wykonać usunięcie tego wywołania adresu URL. (nadpisanie funkcji frameworka django rest).

na przykład

.put(`http://127.0.0.1:8006/api/updatetoken/20`, bayst)
      .then((response) => response.data)
      .catch((error) => { throw error.response.data; });