XMLHttpRequest (XHR) オブジェクトを使用すると、サーバーと対話することができます。ページ全体を更新する必要なしに、データを受け取ることができます。これでユーザーの作業を中断させることなく、ウェブページの一部を更新することができます。 XMLHttpRequest は AJAX プログラミングで頻繁に使用されます。
<div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.076923076923077%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 650 150" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/ja/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/ja/docs/Web/API/XMLHttpRequestEventTarget" target="_top"><rect x="151" y="1" width="250" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="276" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">XMLHttpRequestEventTarget</text></a><polyline points="401,25 411,20 411,30 401,25" stroke="#D4DDE4" fill="none"/><line x1="411" y1="25" x2="441" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/ja/docs/Web/API/XMLHttpRequest" target="_top"><rect x="441" y="1" width="140" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text x="511" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">XMLHttpRequest</text></a></svg></div>
a:hover text { fill: #0095DD; pointer-events: all;}
XMLHttpRequest という名前ではあるものの、 XML だけでなくあらゆる種類のデータを受け取るために使用することができます。
通信においてサーバーからのイベントデータやメッセージデータの受信を含む必要があるのであれば、 Server-sent event の EventSource インターフェイスを使用することも検討してください。全二重の通信では、 WebSocket の方が良いかもしれません。
コンストラクター
XMLHttpRequest()- XMLHttpRequest を初期化するコンストラクターです。これは、他のメソッドを呼び出す前に呼び出さなければなりません。
プロパティ
このインターフェイスは、 XMLHttpRequestEventTarget および EventTarget のプロパティを継承します。
XMLHttpRequest.onreadystatechangeEventHandlerで、これはreadyState属性が変化する度に呼び出されます。XMLHttpRequest.readyState読取専用- リクエストの状態を
unsigned shortで返します。 XMLHttpRequest.response読取専用- リクエストのエンティティ本文を含む
ArrayBuffer,Blob,Document, JavaScript オブジェクト,DOMStringの何れかを、XMLHttpRequest.responseTypeの値に応じて返します。 XMLHttpRequest.responseText読取専用- リクエストに対するレスポンスがテキスト形式で入った
DOMStringを返すか、リクエストが失敗した場合や、まだ送信されていない場合はnullを返します。 XMLHttpRequest.responseType- レスポンス型を定義する、列挙型の値です。
XMLHttpRequest.responseURL読取専用- レスポンスのシリアライズされた URL、または URL が null であれば空文字列を返します。
XMLHttpRequest.responseXML読取専用- リクエストに対するレスポンスが入った
Documentを返すか、またはリクエストが成功しなかった場合、まだ送信されていない場合、 XML または HTML として解釈できなかった場合はnullを返します。 XMLHttpRequest.status読取専用- リクエストに対するレスポンスのステータスを
unsigned shortで返します。 XMLHttpRequest.statusText読取専用- HTTP サーバーから返ってきたレスポンス文字列が入った
DOMStringを返します。XMLHTTPRequest.statusとは異なり、("200 OK" のように) レスポンスメッセージの完全な文が含まれています。
メモ: HTTP/2 仕様書 (8.1.2.4 レスポンス擬似ヘッダーフィールド) によれば、 HTTP/2 では、 HTTP/1.1 のステータス行に含まれていたバージョンや原因の文を伝える方法が定義されていません。
XMLHttpRequest.timeout- リクエストを自動的に終了できるようになるまでの時間をミリ秒単位で表す、
unsigned long型の値です。 XMLHttpRequestEventTarget.ontimeout- リクエストがタイムアウトする都度呼び出される
EventHandler。 XMLHttpRequest.upload読取専用- アップロードプロセスを表す
XMLHttpRequestUploadです。 XMLHttpRequest.withCredentialsBooleanで、サイト間のAccess-Controlリクエストでクッキーや認証ヘッダーなどの認証情報を使用するかどうかを示します。
標準外のプロパティ
XMLHttpRequest.channel読取専用nsIChannelです。リクエストの実行の際にオブジェクトによって使われるチャンネルです。XMLHttpRequest.mozAnon読取専用- boolean です。 true の場合、リクエストは cookie や認証ヘッダを伴わずに送信します。
XMLHttpRequest.mozSystem読取専用- boolean です。 true の場合、リクエストで同一オリジンポリシーは適用されません。
XMLHttpRequest.mozBackgroundRequest- boolean です。オブジェクトがバックグラウンドサービスのリクエストであるかどうかを示します。
XMLHttpRequest.mozResponseArrayBufferGecko 6 で廃止 読取専用ArrayBufferです。リクエストに対する、JavaScript typed array 形式でのレスポンスです。XMLHttpRequest.multipartGecko 22 で廃止- これは Gecko 独自の機能であり、 Firefox/Gecko 22 で削除されました。代わりに Server-Sent Event、Web Socket、または progress イベントの
responseTextを使用してください。
イベントハンドラー
onreadystatechange は XMLHttpRequest のインスタンスのプロパティとしてすべてのブラウザーが対応しています。
それ以来、数多くの追加のイベントハンドラーが様々なブラウザーに実装されてきています (onload, onerror, onprogress, など)。 XMLHttpRequest の使用を参照してください。
Firefox を含め、より新しいブラウザーでは、 XMLHttpRequest のイベントを on* プロパティをハンドラー関数に設定する方法に加えて、標準の addEventListener() API で待ち受けすることにも対応しています。
メソッド
XMLHttpRequest.abort()- リクエストがすでに送信されている場合、リクエストを中止します。
XMLHttpRequest.getAllResponseHeaders()- CRLF で区切られた文字列として、すべてのレスポンスヘッダを返します。レスポンスを何も受け取らなかった場合は
nullを返します。 XMLHttpRequest.getResponseHeader()- 指定したヘッダ文を含む文字列を返します。レスポンスを受信していない、またはレスポンス中に指定したヘッダが存在しない場合は
nullを返します。 XMLHttpRequest.open()- リクエストを初期化します。このメソッドは JavaScript から使用するようにしてください。ネイティブコードからの初期化には、代わりに
openRequest()を使用するようにしてください。 XMLHttpRequest.overrideMimeType()- サーバーから返ってくる MIME タイプを上書きします。
XMLHttpRequest.send()- リクエストを送信します。非同期リクエスト (既定) の場合、メソッドはリクエストを送信してすぐに返ります。
XMLHttpRequest.setRequestHeader()- HTTP リクエストヘッダーの値を設定します。
setRequestHeader()はopen()の後、およびsend()の前に呼び出さなくてはいけません。
標準外のメソッド
XMLHttpRequest.init()- C++ コードから使用するために、オブジェクトを初期化します。
警告: JavaScript からこのメソッドを呼び出してはいけません。
XMLHttpRequest.openRequest()- リクエストを初期化します。このメソッドはネイティブコードから使用するためのものです。 JavaScript コードからの初期化には、代わりに
open()を使用してください。open()の項目を参照してください。 XMLHttpRequest.sendAsBinary()- バイナリデータを送る、
send()メソッドの亜種です。
イベント
abort- 例えばプログラムが
XMLHttpRequest.abort()を呼び出した時など、リクエストが中断されたときに発生します。
onabortプロパティを通して利用することもできます。 error- リクエストでエラーが発生したときに発生します。
onerrorプロパティを通して利用することもできます。 loadXMLHttpRequestのトランザクションが成功裏に完了したときに発生します。
onloadプロパティを通して利用することもできます。loadend- リクエストが完了したときに、成功した場合 (
loadの後)、成功しなかった場合 (abortまたはerrorの後) のどちらでも発生します。
onloadendプロパティを通して利用することもできます。 loadstart- リクエストがデータを読み込み始めたときに発生します。
onloadstartプロパティを通して利用することもできます。 progress- リクエストがもっとデータを受信した際に定期的に発生します。
onprogressプロパティを通して利用することもできます。 timeout- プリセット時間が過ぎたために進行が終了したときに発生します。
ontimeoutプロパティを通して利用することもできます。
仕様書
| 仕様書 | 状態 | 備考 |
|---|---|---|
| XMLHttpRequest | 現行の標準 | Live standard 最新版 |
ブラウザーの互換性
このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
Update compatibility data on GitHub
| デスクトップ | モバイル | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
XMLHttpRequest | Chrome 完全対応 1 | Edge
完全対応
12
| Firefox 完全対応 1 | IE
完全対応
7
| Opera 完全対応 8 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
abort | Chrome 完全対応 18 | Edge 完全対応 12 | Firefox 完全対応 あり | IE 完全対応 5 | Opera 完全対応 あり | Safari 完全対応 1.2 | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS 完全対応 あり | Samsung Internet Android 完全対応 あり |
abort event | Chrome 完全対応 あり | Edge 完全対応 ≤79 | Firefox 完全対応 あり | IE 完全対応 10 | Opera 完全対応 あり | Safari 完全対応 あり | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS ? | Samsung Internet Android 完全対応 あり |
error event | Chrome 完全対応 あり | Edge 完全対応 ≤79 | Firefox 完全対応 あり | IE 完全対応 10 | Opera 完全対応 あり | Safari 完全対応 あり | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS ? | Samsung Internet Android 完全対応 あり |
getAllResponseHeaders | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox
完全対応
4
| IE 完全対応 5 | Opera 完全対応 あり | Safari 完全対応 1.2 | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android
完全対応
4
| Opera Android 完全対応 あり | Safari iOS 完全対応 あり | Samsung Internet Android 完全対応 あり |
getResponseHeader | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox
完全対応
1
| IE 完全対応 5 | Opera 完全対応 8 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android
完全対応
4
| Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
load event | Chrome 完全対応 あり | Edge 完全対応 ≤79 | Firefox 完全対応 あり | IE 完全対応 9 | Opera 完全対応 あり | Safari 完全対応 あり | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS ? | Samsung Internet Android 完全対応 あり |
loadend event | Chrome 完全対応 あり | Edge 完全対応 ≤79 | Firefox 完全対応 あり | IE 完全対応 10 | Opera 完全対応 あり | Safari 完全対応 あり | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS ? | Samsung Internet Android 完全対応 あり |
loadstart event | Chrome 完全対応 あり | Edge 完全対応 ≤79 | Firefox 完全対応 あり | IE 完全対応 10 | Opera 完全対応 あり | Safari 完全対応 あり | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS ? | Samsung Internet Android 完全対応 あり |
onreadystatechange | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 1 | IE 完全対応 5 | Opera 完全対応 9 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
open | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox
完全対応
1
| IE 完全対応 5 | Opera 完全対応 8 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android
完全対応
4
| Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
overrideMimeType | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 あり | IE
完全対応
11
| Opera 完全対応 あり | Safari 完全対応 1.2 | WebView Android 完全対応 あり | Chrome Android 完全対応 18 | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS 完全対応 あり | Samsung Internet Android 完全対応 1.0 |
progress event | Chrome 完全対応 あり | Edge 完全対応 ≤79 | Firefox 完全対応 あり | IE 完全対応 10 | Opera 完全対応 あり | Safari 完全対応 あり | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS ? | Samsung Internet Android 完全対応 あり |
readyState | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 1 | IE 完全対応 7 | Opera 完全対応 8 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
response | Chrome 完全対応 9 | Edge 完全対応 12 | Firefox 完全対応 6 | IE 完全対応 10 | Opera 完全対応 11.6 | Safari 完全対応 5.1 | WebView Android 完全対応 ≤37 | Chrome Android 完全対応 18 | Firefox Android 完全対応 6 | Opera Android 完全対応 12 | Safari iOS 完全対応 6 | Samsung Internet Android 完全対応 1.0 |
responseText | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 1 | IE
完全対応
5
| Opera 完全対応 8 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
responseType | Chrome 完全対応 31 | Edge 完全対応 12 | Firefox 完全対応 6 | IE 完全対応 10 | Opera 完全対応 18 | Safari 完全対応 7 | WebView Android 完全対応 55 | Chrome Android 完全対応 55 | Firefox Android 完全対応 50 | Opera Android 完全対応 42 | Safari iOS 完全対応 7 | Samsung Internet Android 完全対応 6.0 |
responseURL | Chrome 完全対応 37 | Edge 完全対応 14 | Firefox 完全対応 32 | IE 未対応 なし | Opera 完全対応 24 | Safari 完全対応 8 | WebView Android 完全対応 37 | Chrome Android 完全対応 37 | Firefox Android 完全対応 32 | Opera Android 完全対応 24 | Safari iOS 完全対応 あり | Samsung Internet Android 完全対応 3.0 |
responseXML | Chrome 完全対応 あり | Edge 完全対応 12 | Firefox
完全対応
あり
| IE 完全対応 あり | Opera 完全対応 あり | Safari 完全対応 あり | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android
完全対応
あり
| Opera Android 完全対応 あり | Safari iOS 完全対応 あり | Samsung Internet Android 完全対応 あり |
send | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 1 | IE 完全対応 5 | Opera 完全対応 8 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
sendAsBinary | Chrome
未対応
なし
| Edge
未対応
なし
| Firefox 未対応 2 — 31 | IE 未対応 なし | Opera 未対応 なし | Safari 未対応 なし | WebView Android
未対応
なし
| Chrome Android
未対応
なし
| Firefox Android 未対応 4 — 31 | Opera Android 未対応 なし | Safari iOS 未対応 なし | Samsung Internet Android
未対応
なし
|
setRequestHeader | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 1 | IE 完全対応 5 | Opera 完全対応 8 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
status | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 1 | IE
完全対応
7
| Opera 完全対応 8 | Safari 完全対応 1.2 | WebView Android 完全対応 1 | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 10.1 | Safari iOS 完全対応 1 | Samsung Internet Android 完全対応 1.0 |
statusText | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 1 | IE
完全対応
7
| Opera 完全対応 あり | Safari 完全対応 1.2 | WebView Android 完全対応 あり | Chrome Android 完全対応 18 | Firefox Android 完全対応 4 | Opera Android 完全対応 あり | Safari iOS 完全対応 あり | Samsung Internet Android 完全対応 1.0 |
timeout | Chrome 完全対応 29 | Edge 完全対応 12 | Firefox 完全対応 12 | IE 完全対応 8 | Opera
完全対応
17
| Safari 完全対応 6.1 | WebView Android 完全対応 ≤37 | Chrome Android 完全対応 29 | Firefox Android 完全対応 14 | Opera Android
完全対応
18
| Safari iOS 完全対応 7 | Samsung Internet Android 完全対応 2.0 |
timeout event | Chrome 完全対応 あり | Edge 完全対応 ≤18 | Firefox 完全対応 あり | IE 完全対応 10 | Opera 完全対応 あり | Safari 完全対応 あり | WebView Android 完全対応 あり | Chrome Android 完全対応 あり | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS 完全対応 あり | Samsung Internet Android 完全対応 あり |
upload | Chrome 完全対応 1 | Edge 完全対応 12 | Firefox 完全対応 あり | IE 完全対応 10 | Opera 完全対応 あり | Safari 完全対応 10 | WebView Android 完全対応 あり | Chrome Android 完全対応 18 | Firefox Android 完全対応 あり | Opera Android 完全対応 あり | Safari iOS 完全対応 あり | Samsung Internet Android 完全対応 1.0 |
withCredentials | Chrome 完全対応 3 | Edge 完全対応 12 | Firefox
完全対応
3.5
| IE
完全対応
10
| Opera 完全対応 12 | Safari 完全対応 4 | WebView Android 完全対応 ≤37 | Chrome Android 完全対応 18 | Firefox Android
完全対応
4
| Opera Android 完全対応 12 | Safari iOS 完全対応 3.2 | Samsung Internet Android 完全対応 1.0 |
凡例
- 完全対応
- 完全対応
- 未対応
- 未対応
- 実装状況不明
- 実装状況不明
- 非標準。ブラウザー間の互換性が低い可能性があります。
- 非標準。ブラウザー間の互換性が低い可能性があります。
- 非推奨。新しいウェブサイトでは使用しないでください。
- 非推奨。新しいウェブサイトでは使用しないでください。
- 実装ノートを参照してください。
- 実装ノートを参照してください。
関連情報
XMLSerializer: DOM ツリーの XML へのシリアライズXMLHttpRequestに関連する MDN の記事- HTML5 Rocks — New Tricks in XMLHttpRequest2