JavaScript が HTTP リクエストを送信する方法

Javascript は、Web ページで使用できる、広く使用されているスクリプト言語です。多くの機能をサポートしていますが、最も一般的な機能はおそらく HTTP 経由でリクエストを送信し、データを受信して​​ Web ページに表示することです。この記事では、JavaScript が HTTP リクエストを送信する方法について説明します。

HTTP は、Web アプリケーション間でデータを交換するために使用されるクライアント/サーバー プロトコルです。たとえば、Web ブラウザに URL を入力すると、ブラウザは Web サーバーに HTTP リクエストを送信して、ページの HTML コンテンツを取得します。

JavaScript は XMLHttpRequest オブジェクトを使用して HTTP リクエストを送信できます。 XMLHttpRequest オブジェクトを使用すると、ページを更新せずに JavaScript コードを通じてサーバーとデータを交換できます。 XMLHttpRequest オブジェクトを通じて HTTP リクエストを送信するための基本的な手順は次のとおりです:

1. XMLHttpRequest オブジェクトの作成

HTTP リクエストを送信するには、まず XMLHttpRequest オブジェクトを作成する必要があります。次のコードを使用して XMLHttpRequest オブジェクトを作成できます:

var xhr = new XMLHttpRequest();

2. HTTP リクエストを開く

XMLHttpRequest オブジェクトの open() メソッドは、HTTP リクエスト パラメータを初期化するために使用されます。 open() メソッドは、HTTP リクエストのメソッド、リクエストの URL、リクエストを非同期で実行するかどうかを示すブール値の 3 つのパラメータを受け入れます。これらのパラメータの値は、「GET」、「http://example.com/api」、および「true」です。

たとえば、次のコードは GET メソッドを使用して http://example.com/api をリクエストします:

xhr.open('GET', 'http://example.com/api', true);

3. HTTP リクエストを送信します

send() XMLHttpRequest オブジェクトのメソッドは、HTTP リクエストの送信に使用します。リクエストのデータがない場合は、空白のままにすることができます。データを送信する必要がある場合は、send() メソッドのパラメータとして使用してください。

たとえば、次のコードは HTTP リクエストを送信します:

xhr.send();

4. サーバー応答の処理

サーバーが XMLHttpRequest リクエストに応答すると、イベント ハンドラーが呼び出されます。 。 XMLHttpRequest オブジェクトにイベント ハンドラーを登録して、サーバーの応答を処理できます。次のコードは、イベント ハンドラーを登録する方法を示しています。

xhr.onreadystatechange = function() {
  if (xhr.readyState === 4) {
    alert(xhr.responseText);
  }
};

このイベント ハンドラーでは、XMLHttpRequest オブジェクトの readState プロパティをチェックして、サーバーが要求に応答したかどうかを判断します。 ReadyState の値が 4 の場合、サーバーがリクエストに応答したことを意味します。

HTTP リクエストを作成した後、XMLHttpRequest オブジェクトの statusCode プロパティと responseText プロパティをチェックして、サーバーから受信した HTTP レスポンスを取得できます。 statusCode 属性には応答のステータス コード (成功の場合は 200 など) が含まれ、responseText 属性には応答の本文コンテンツが含まれます。

この記事では、JavaScript が XMLHttpRequest オブジェクトを使用して HTTP リクエストを送信する方法を紹介しました。 Web アプリケーションを開発している場合は、HTTP リクエストの送信方法を知っておくと役立ちます。

以上がJavaScript が HTTP リクエストを送信する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。