web-dev-qa-db-ja.com

ボディとヘッダーを含むAxios Deleteリクエスト？

ReactJSでプログラミング中にAxiosを使用していて、サーバーにDELETEリクエストを送信するふりをしています。

そのためには、ヘッダーが必要です。

headers: {
  'Authorization': ...
}

体はで構成されています

var payload = {
    "username": ..
}

私はインターWebで検索してきましたが、DELETEメソッドは「param」を必要とし、「data」を受け入れないことだけを発見しました。

私はそれを次のように送信しようとしています：

axios.delete(URL, payload, header);

あるいは

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

しかし、何もうまくいかないようです...

誰かがヘッダーと本文の両方でDELETEリクエストを送信することが可能かどうか（私がそうであると思う）と私にそれを行う方法を教えてもらえますか？

前もって感謝します！

javascriptreactjshttpaxioshttp-delete
29
Asfourhundred

何度か試してみたところ、動作していることがわかりました。

順序を守ってくださいそれ以外の場合は動作しません

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

axiox.deleteはリクエスト本文をサポートします。 urlとオプションのconfigの2つのパラメーターを受け入れます。 config.dataを使用して、応答本文を次のように設定できます。

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

ここを参照してください- https://github.com/axios/axios/issues/897

43
tarzen chugh

以下は、さまざまなhttp動詞をaxiosで送信するために必要な形式の簡単な要約です。

  • GET：2つの方法

    • 最初の方法
    axios.get('/user?ID=12345')
  .then(function (response) {
    // Do something
  })
    • 第二の方法
    axios.get('/user', {
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    // Do something
  })

上記の2つは同等です。 2番目の方法でparamsキーワードを観察します

  • POSTおよび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
)

キーテイクアウェイ

  • getリクエストには、クエリパラメータを適切に設定するために、オプションでparamsキーが必要です
  • deleteリクエストは本文でdataキーの下に設定する必要があります
29
Van_Paitin

axios。deleteは rlおよびオプションの構成を渡す です。

axios.delete（url [、config]）

フィールド 構成で使用可能なヘッダーを含めることができます 。

これにより、API呼び出しを次のように記述できるようになります。

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

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

私はそれを解決した同じ問題を抱えていました：

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

axiosを介していくつかのヘッダーを持つHTTP DELETEを送信するには、次のようにしました。

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

さまざまなHTTP動詞（GET、POST、PUT、DELETE）のaxios構文は注意が必要です。これは、2番目のパラメーターがHTTP本文であると想定されている場合もあれば、必要でない場合は2番目としてヘッダーを渡すためですパラメータ。

ただし、HTTPボディなしでHTTP POSTリクエストを送信する必要がある場合、2番目のパラメーターとしてundefinedを渡す必要があるとします。

構成オブジェクトの定義（ https://github.com/axios/axios#request-config ）に従って、dataを介してHTTP呼び出しでHTTP本文を渡すことができることに留意してくださいaxios.deleteを呼び出すときのフィールド。ただし、HTTP DELETE動詞の場合は無視されます。

時々HTTPボディである2番目のパラメーターと、configのaxiosオブジェクト全体との間のこの混乱は、HTTPルールの実装方法が原因です。 HTTPコールを有効と見なすために、HTTPボディが不要な場合があります。

2
TPPZ

削除の場合、次のように行う必要があります

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

それは私のために働いた。

0
Hemantkumar Gaikwad

同じ問題に遭遇しました...カスタムaxiosインスタンスを作成することで解決しました。それを使用して、認証済みの削除リクエストを作成します。

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

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