HTMLをロード(表示)した際に
Webサーバに設置しているテキストファイルを
非同期に読み込んで表示する
分かり易いサンプルを。
■前提
以下に記載する３つのファイルのWebサーバ上の設置場所は
同一ディレクトリとします。
① サーバにmsg1.txtという名前でファイルを設置。
中身は適当に「test1です」とでもしておきます。
② 前回作成したjslb_ajax.jsを設置。
③ 以下の内容でsample.htmlという名前で設置
※HTMLタグの記述は省略してます。
<!-- ここから -->
<script Language = "JavaScript" src="./jslb_ajax.js" charset="utf-8"></script>
<script>
// HTTPリクエスト送信 ・・・ ①
sendRequest(onloaded,'','GET','./msg1.txt')
// レスポンス受信 ・・・ ②
function onloaded(oj){
alert(oj.responseText)
}
</script>
<!-- ここまで -->
① sendRequest
HTTPリクエスト送信。
起動トリガはHTMLがサーバから出力された時。
onClickやonChange等でも引っ掛けられます。
・アーギュメント解説
第1引数(onloaded)：レスポンス受信時のコールバック関数を指定。
第2引数(GET)：HTTPリクエストアクション
第3引数(./msg1.txt)：読込むファイルを指定。
② onloaded
HTTPレスポンス受信
sendRequestの第1引数で指定している
onloaded関数が呼出されます。
onloadedの引数にmsg1.txtの内容が
オブジェクトとして返却されるので
その内容をポップアップで表示。
とまあ基本は、こんな感じです。
次回はもう少し突っ込んだサンプルと
何でも出来てしまうアーキテクチャなので
無限が思う設計思想について書きたいと思います。
※実業務で実装していないので何ともですが、
何でも出来てしまう反面、
サーバ側に負荷が掛かる仕様なので。