Axios Verwijderingsverzoek met body en headers?

Ik gebruik Axios tijdens het programmeren in ReactJS en ik doe alsof ik een DELETE-verzoek naar mijn server stuur.

Hiervoor heb ik de headers nodig:

headers: {
  'Authorization': ...
}

en het lichaam is samengesteld uit

var payload = {
    "username": ..
}

Ik heb op internet gezocht en heb alleen ontdekt dat de DELETE-methode een “param” vereist en geen “gegevens” accepteert.

Ik heb geprobeerd het zo te verzenden:

axios.delete(URL, payload, header);

of zelfs

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

Maar niets lijkt te werken…

Kan iemand mij vertellen of het mogelijk is (ik neem aan van wel) om een DELETE-verzoek te sturen met zowel headers als body en hoe ik dat moet doen?

Bij voorbaat dank!


Antwoord 1, autoriteit 100%

Dus na een aantal pogingen vond ik het werken.

Volg de volgorde van bestellenhet is heel belangrijk anders werkt het niet

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

Antwoord 2, autoriteit 57%

axios.deleteondersteunt wel een request body. Het accepteert twee parameters: urlen optionele config. U kunt config.datagebruiken om de aanvraagtekst en headers als volgt in te stellen:

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

Zie hier – https://github.com/axios/axios/issues/897


Antwoord 3, autoriteit 48%

Hier is een korte samenvatting van de formaten die nodig zijn om verschillende http-werkwoorden met axios te verzenden:

  • get: op twee manieren

    • Eerste methode

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

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

    De twee bovenstaande zijn equivalent. Let op het trefwoord paramsin de tweede methode.

  • POSTen 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
    )
    

Belangrijkste afhaalrestaurants

  • get-verzoeken hebben optioneel een params-sleutel nodig om de queryparameters correct in te stellen
  • deleteVerzoeken met een instantie moeten worden ingesteld onder een data-toets

4, Autoriteit 8%

Axios. Delete is geslaagd URL en een optionele configuratie .

Axios.delete (URL [, config])

De velden Beschikbaar voor de configuratie kan de koppen bevatten.

Dit maakt het zo dat de API-oproep kan worden geschreven als:

const headers = {
  'Authorization': 'Bearer paperboy'
}
const data = {
  foo: 'bar'
}
axios.delete('https://foo.svc/resource', {headers, data})

5, Autoriteit 4%

Voor verwijderen moet u dit doen volgens het volgende

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

het werkte voor mij.


6, Autoriteit 3%

Ik had hetzelfde probleem dat ik zo opgelost heb:

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

7, Autoriteit 3%

Eigenlijk, axios.deleteondersteunt een aanvraaglichaam.
Het accepteert twee parameters: een URLen een optionele config. Dat is …

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

U kunt het volgende doen om de responsorgaan voor het Verwijderverzoek in te stellen:

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)

Ik hoop dat dit iemand helpt!


Antwoord 8, autoriteit 2%

Voor degenen die alles hierboven hebben geprobeerd en de payload met het verzoek nog steeds niet zien: zorg ervoor dat u het volgende heeft:

"axios": "^0.21.1" (not 0.20.0)

Dan werken de bovenstaande oplossingen

axios.delete("URL", {
      headers: {
        Authorization: `Bearer ${token}`,
      },
      data: {
        var1: "var1",
        var2: "var2"
      },
    })

Je hebt toegang tot de payload met

req.body.var1, req.body.var2

Dit is het probleem:

https://github.com/axios/axios/issues/3335


9

Ik vond een manier die werkt:

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

Ik hoop dat dit werk ook voor u.


10

Als we:

myData = { field1: val1, field2: val2 }

We kunnen de data (JSON) in een string te zetten waarna u het als een parameter, in de richting van de backend:

axios.delete("http://localhost:[YOUR PORT]/api/delete/" + JSON.stringify(myData), 
     { headers: { 'authorization': localStorage.getItem('token') } }
 )

Aan de serverzijde krijgen we ons object terug:

app.delete("/api/delete/:dataFromFrontEnd", requireAuth, (req, res) => {
    // we could get our object back:
    const myData = JSON.parse(req.params.dataFromFrontEnd)
 })

Opmerking:het antwoord van “x4wiz” op 14 februari om 15:49is nauwkeuriger voor de vraag dan het mijne! Mijn oplossing is zonder de “body”…


Antwoord 11

Ik kwam hetzelfde probleem tegen…
Ik heb het opgelost door een aangepaste axios-instantie te maken. en dat te gebruiken om een geverifieerd verwijderverzoek in te dienen..

const token = localStorage.getItem('token');
const request = axios.create({
        headers: {
            Authorization: token
        }
    });
await request.delete('<your route>, { data: { <your data> }});

Antwoord 12

Ik heb al het bovenstaande geprobeerd, maar dat werkte niet voor mij. Ik ben uiteindelijk gewoon met PUT gegaan (inspiratie gevonden hier) en gewoon veranderde mijn server-side logica om een verwijdering uit te voeren op deze url-aanroep. (django rest framework functie overschrijven).

bijv.

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

Antwoord 13

Niet gerealiseerd aan Axios, maar kan mensen helpen het probleem aan te pakken waarnaar ze op zoek zijn. PHP ontleedt geen postgegevens bij het voorvormen van een verwijderingsgesprek. Axios Delete kan het lichaamsinhoud verzenden met een verzoek.
Voorbeeld:

//post example
let url = 'http://local.test/test/test.php';
let formData = new FormData();
formData.append('asdf', 'asdf');
formData.append('test', 'test');
axios({
    url: url,
    method: 'post',
    data: formData,
}).then(function (response) {
    console.log(response);
})
result: $_POST Array
(
    [asdf] => asdf
    [test] => test
)
// delete example
axios({
    url: url,
    method: 'delete',
    data: formData,
}).then(function (response) {
    console.log(response);
})
result: $_POST Array
(        
)

om postgegevens te krijgen op het verwijderen van oproep in PHP-gebruik:

file_get_contents('php://input'); 

Other episodes