XMLHttpRequestオブジェクトのプロパティ
XMLHttpRequestオブジェクトの重要なプロパティについてです。
サーバにデータを送るためにはXMLHttpRequestオブジェクトのプロパティについて知ることが基本です。
onreadystatechangeプロパティ
サーバにリクエストを送信した後にサーバがデータを受け取り、それを返すファンクションが必要です。
onreadystatechangeプロパティの中にサーバからのレスポンスを扱うコードを記入します。
それによりファンクションの中に組み込まれたコードが自動的に呼び出されるようになります。
xmlhttp.onreadystatechange=function(){
// ここにコードを書きます。
}
readyStateプロパティ
readyStateプロパティはサーバの状態を保持します。
この
readyStateプロパティが変わる度にonreadystatechangeファンクションが実行されます。
readyStateプロパティの状態の一覧は下記の通りです。
- 0 リクエストは初期化されていません
- 1 リクエストがセットアップされました
- 2 リクエストが送られました
- 3 リクエストをプロセス中です
- 4 リクエストを完了しました
リクエストが完了したかどうか確かめるためにonreadyStatePropertyにif文を書き足します。
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState == 4){
// ここにコードを書きます。
}
}
responseTextプロパティ
responseTextプロパティを用いてサーバから送られたデータを読み取ります。
onreadystatechangeの無名関数内にresponseTextプロパティの結果を代入する形になります。
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState == 4){
document.myForm.time.value = xmlhttp.responseText;
}
}
statusプロパティ
statusプロパティを用いてサーバから送られてきたデータが正常か判断します。statusプロパティの一覧は以下のとおりです。
200であれば正常ですが、それ以外はエラーです。
値 | 状態 |
200 | OK |
401 | Unauthorized |
403 | Forbidden |
404 | Not Found |
500 | Internal Server Error |
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.myForm.time.value = xmlhttp.responseText;
}
}
チュートリアル4はXMLHttpRequestを用いたサーバとのコミュニケーションの方法についてです。