特集
» 2006年08月10日 08時00分 UPDATE

Web2.0で変わるWebプログラミングの常識:Ajaxを理解する4つのポイント (3/6)

[大澤文孝,ITmedia]

3. URLを設定する

 次にopenメソッドを呼び出して、要求を出すサーバを設定する。

 リスト1では、次のように http://example.jp/calc.php を呼び出すように構成してあるが、これはもちろん実環境に合わせる必要がある。

req.open('POST', 'http://example.jp/calc.php', true);


 また、セキュリティ上、このHTMLが置かれているのとは異なるドメインを指定しても通信ができないことを押さえておこう。

 第1引数は、要求するメソッドだ。ここでは「POST」を指定しているので「POSTメソッドでの要求」となるが、「GET」を指定すれば「GETメソッド」で送信することもできるのだ。

 第3引数は、非同期通信するかどうかのフラグだ。trueを指定すると非同期通信になる。

 「openメソッド」という名前が付けられているが、openメソッドを呼び出した時点でサーバへの接続が行われるかどうか? はブラウザ側に依存する。ブラウザによっては、後述するsendメソッドを呼び出した時に始めて接続されるものもある。

4. ヘッダを設定する

 続いてサーバに送信するヘッダを設定しよう。ヘッダは、setRequestHeaderメソッドで設定することになる。

 POSTメソッドを使って送信する場合、必ず、下記のように、Content-Typeヘッダを設定しなければならない(GETメソッドの場合には不要である)。この設定を忘れてしまうと、サーバ側に配置されたプログラムが送信されたパラメータを取得できないことになる。

req.setRequestHeader("Content-Type",

"application/x-www-form-urlencoded;

charset=UTF-8");


 setRequestHeaderメソッドでは、任意のヘッダの追加が可能である。例えば、Cookieヘッダを付加させてCookie送信をすることもできる。この記事では詳しく説明しないが、受信したヘッダは、受信完了後にgetResponseHeaderメソッドを使って取得できることも押さえておこう。

Copyright© 2017 ITmedia, Inc. All Rights Reserved.

ピックアップコンテンツ

- PR -

注目のテーマ