Ajax での GET と POST の使用方法の詳細な説明

今回は、Ajax での GET と POST の使用について詳しく説明します。Ajax で GET と POST を使用する際の 注意事項 について、実際のケースを見てみましょう。

前回のエッセイでは、さまざまなブラウザと互換性のある XHR オブジェクトを作成する方法をノスタルジックな態度でまとめました:

XHR オブジェクトを確立した後、クライアントが行う必要があるのは、何らかの方法でデータをサーバーに渡すことだけです。ここで、Ajax テクノロジーの概要の第 2 四半期では、データを送信する 2 つの方法に焦点を当てます。

これを行う前に、HTTP 送信プロトコルを理解する必要があります。

HTTP は、クライアントとサーバー間の要求/応答プロトコルとして機能します。

例: クライアント (ブラウザ) が HTTP リクエストをサーバーに送信し、サーバーがクライアントに応答を返します。応答には、リクエストに関するステータス情報と、リクエストされた可能性のあるコンテンツが含まれます。 HTTP プロトコルに基づいてデータを送信する場合は、クライアントとサーバー間でリクエストとレスポンスを行うときに、2 つの HTTP

リクエスト メソッド

: GET と POST を使用する必要があります。最も一般的に使用される 2 つのメソッドは、GET と POST です。

GET - 指定されたリソースからデータをリクエストします。

POST - 指定されたリソースに処理対象のデータを送信します

• これは、W3C での GRT と POST の使用シナリオの説明です。文字通りに理解すると、GET はサーバーからデータを取得するために使用されます。 POST は、送信されたパスとデータの URL からこれを確認できます:
  2. img スクリプトの src 属性 (この属性は制限されません) 「同一生成元ポリシー」と「クロスドメイン」に使用できます。近い将来、クロスドメインに関する記事をまとめたいと思います。まずここで穴を掘ってください)

• ここで、それらについて話しましょう。フォーム送信の違い

1. Ajax フォーム送信では、get は open() 関数を使用してデータを送信します。ここで、データは URL キーと値の形式で URL の後ろに結合されます:

xhr.open('get','xxx.php?name=tom & age=18');
xhr.send(null);

ブラウザの URL は次のとおりです:

get は URL を送信します

ここで確認できます: GET はパラメーター データです。キューは、送信されたフォームの action 属性が指す URL に追加されます値はフォームの各フィールドに対応しており、URL で確認できます。 ID の URL の長さは制限されています。URL が長すぎる場合、長すぎる文字は自動的にインターセプトされます。これにより問題が発生しやすくなります。渡されたパラメータが多すぎて URL が長すぎる場合、URL は長すぎる文字を自動的にインターセプトし、最終的には渡されたパラメータを取得できなくなります。これにより、GET によって送信されるデータ サイズは通常 2KB を超えないよう制限されます

さらに、URL のスクリーンショットからわかるように、GET メソッドを通じてデータを送信する場合、ユーザー名とパスワードが表示されます。 URLで。次の場合:

- ログイン ページがブラウザによってキャッシュされる可能性がある場合 - 他のユーザーが顧客のマシンにアクセスできる場合。 その後、他の人がブラウザの履歴から顧客のアカウント番号とパスワードを読み取ることができます。したがって、場合によっては、GET メソッドは重大なセキュリティ問題を引き起こす可能性があります。

GET メソッドに利点がないわけではありません。速度テストでは、GET の送信速度は POST メソッドの数十倍です。

2. Ajax フォーム送信では、POST は open() 関数で URL を指定するだけで済み、send() 関数はデータを送信します。

//获取form数据
var formDom = document.querySelector('form');
var formData = new FormData(formDom);
//发送数据
xhr.open('post',formDom.action);
xhr.send(formData);

POST は、HTTPPOST メカニズムを通じて、フォーム内の各フィールドとそのコンテンツは HTML に配置されます。 HEADER は、action 属性が指す URL アドレスにまとめて送信されます。ユーザーはこのプロセスを見ることができません。より高いセキュリティ

POST は大量のデータを送信し、通常はデフォルトでは制限がありません。このデモでは FormData オブジェクトを使用して、画像、リッチ テキスト、その他のファイルを渡すことができますが、これは get では実行できません。

要約すると、Get はサーバーへのデータのリクエストであり、Post はサーバーへのデータの送信リクエストです。FORM (フォーム) では、メソッドはデフォルトで「GET」になっており、

本質的には GET と POST だけです。送信メカニズムが異なるということは、一方が取得され、一方が送信されるということではありません。

つまり、これら 2 つのフォーム送信方法の間に利点や欠点はなく、適応シナリオが異なるだけであり、日常業務のニーズに応じて把握する必要があります。

後で、ブラウザとサーバー間の対話でパスを記述するいくつかの異なる方法をまとめます。

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

ajax が json 文字列と json 配列にどのように応答するか

Ajax を使用した同期と非同期実装の違いは何ですか

以上がAjax での GET と POST の使用方法の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。