「JavaScript/XMLHttpRequest」の版間の差分

削除された内容 追加された内容
初心者向けの内容を加筆。私はこれで分かった。
→‎XMLHttpRequest: よくあるミスを追記。私はこれで2日ほど悩んだ。
11 行
== XMLHttpRequest ==
=== 前提の環境や概要 ===
まず、これらの機能は、webサーバを仲介して行う必要がある。よってコードをテストするには、まず webサーバ(ApacheやXAMPPなどを立ち上げて、そこのドキュメントルートで行う必要がある。ドキュメントルートの説明については、『[[PHP/確実に動作させるまで]]』に説明しておいたので、webサーバに詳しくなければ参照してもらいたい。(もしwebサーバの使い方が全く分からない場合、JavaScriptの学習はいったん中断して、上記リンク先の[[PHP]]の単元を先に学習したほうが良いだろう。)
 
とりあえず、サーバの設定や構成の準備がうまく行ってるかどうかを、次のコードで試してみよう。下記プログラムは、XMLHttpRequestの動作確認用のプログラムである。(本来なら動作確認のほかに、サーバとのデータ送受信などを行いたいのだが、コードが長くなるので、今回はまだ動作確認だけにしている。)
 
ただし、アクセス先のテキストファイルとして aisatu.txt を用意してもらいたい(あいさつテキストの意味)。今後の作業のため、aisatu.txt には「hello world」とでも書いておく。
 
下記コードを、test.html という名前で保存したとする。
 
そして、test.htmlをwebサーバのドキュメントルートにアップロードしておくこと。
 
;コード(htmlファイル)
93 ⟶ 97行目:
</syntaxhighlight>
 
 
 
次に、このコードに、webサーバを介してwebブラウザでアクセスすること。
 
もし、test.htmlというファイル名でローカルホストにアップロードしたなら、
[http://localhost/test.html http://localhost/test.html ]
というアドレスにブラウザでアクセスすることで、結果を見れる。
 
;表示結果
116 ⟶ 127行目:
 
また、「200」と言うのは直前のリクエストに対して「成功」という意味である。失敗なら、200以外のメッセージであり、たとえば「0」や「404」(リソースが存在しない場合)などである。
 
;よくあるミス
失敗する場合、原因は色々とありうるが、特にあるミスとして、 [http://localhost/test.html http://localhost/test.html ] のアクセスではなく、htmlファイルを直接ダブルクリックして起動してしまっていないかを注意してみよう。
 
単にドキュメントルートの中にhtmlを入れて、そのhtmlファイルをダブルクリック起動しても、失敗する。
 
必ず、ドキュメントルートにhtmlファイルを入れた上で、さらに必ず [http://localhost/test.html http://localhost/test.html ] にアクセスしているかを確認しよう。
 
 
=== コード ===