JavaScriptのPUTリクエストパラメータ

WBOY
リリース: 2023-05-22 13:12:08
オリジナル
2200 人が閲覧しました

フロントエンド テクノロジの継続的な開発により、JavaScript は Web 開発に不可欠な部分になりました。一部のシナリオでは、PUT リクエストを使用してサーバー上のデータを更新する必要があります。この記事では、JavaScript で PUT リクエストを使用してパラメータを送信する方法を説明します。

PUT リクエストは、サーバー リソースの更新リクエストです。 POST リクエストと比較して、PUT リクエストは完全な URL を指定せずに、指定されたリソースを置換または更新できます。 PUT リクエストの構文規則は次のとおりです。

PUT /resource HTTP/1.1
Host: localhost
Content-Type: application/json
Content-Length: <length>

{
    "name": "put request",
    "description": "update server data"
}
ログイン後にコピー

このうち、Content-TypeContent-Length は、要求されるデータ形式とデータを指定するために使用されます。長さ。 JavaScript では、XMLHttpRequest オブジェクトを使用して PUT リクエストを行うことができます。以下は、XMLHttpRequest オブジェクトを使用して PUT リクエストを送信するサンプル コードです。

const xhr = new XMLHttpRequest();
xhr.open("PUT", "/resource");
xhr.setRequestHeader("Content-Type", "application/json");

const data = {
    "name": "put request",
    "description": "update server data"
};

xhr.send(JSON.stringify(data));
ログイン後にコピー

ここで、xhr は XMLHttpRequest オブジェクトであり、open メソッドは、要求された URL と要求メソッドを構成します。 setRequestHeader メソッドは、要求されたデータ形式を指定するための Content-Type 要求ヘッダーを設定するために使用されます。 send メソッドは、リクエストを送信し、リクエスト パラメータを JSON 文字列に変換するために使用されます。

XMLHttpRequest オブジェクトを使用して PUT リクエストを送信するだけでなく、fetch API も使用できます。 ES6 では、最新のブラウザはすでにフェッチ API をネイティブにサポートしています。以下は、フェッチ API を使用して PUT リクエストを送信するサンプル コードです。

const options = {
    method: "PUT",
    headers: {
        "Content-Type": "application/json"
    },
    body: JSON.stringify({
        "name": "put request",
        "description": "update server data"
    })
};

fetch("/resource", options)
    .then(response => console.log(response))
    .catch(error => console.log(error));
ログイン後にコピー

ここの options パラメーターは、リクエスト メソッド、リクエスト ヘッダー、およびリクエスト パラメーターを構成するために使用されます。 fetch メソッドは、リクエストを送信し、Promise オブジェクトを返すために使用されます。 .then メソッドと .catch メソッドを使用して、リクエストの応答とエラーを処理できます。

要約すると、JavaScript で PUT リクエストを送信するのは非常に簡単です。 XMLHttpRequest オブジェクトまたはフェッチ API を使用して、リクエスト パラメーターを JSON 文字列に変換し、リクエスト ヘッダーを構成するだけです。

以上がJavaScriptのPUTリクエストパラメータの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!