http://ws.bzen.net/pgtop/pref.xml
XMLを開いたらアドレスに注目してください。
このXMLのデータを使いたいのですが、このままではプログラムがある localhost から見ると外部のドメインとなるため、データを取得することができません。
そこで localhost 内に『中継プログラム(スクリプト)』を置くことにします。Ajax のプログラムからは、同一ドメイン内の中継プログラムにはアクセスすることができます。
そして中継プログラムには制限が無いので、外部のドメインにあるファイルにアクセスできます。つまり間接的に外部のドメインにあるデータを取得するのです。
○ pref.js → 同一ドメイン内
× pref.js → 外部ドメイン
○ pref.js → pref.php → 外部ドメイン
中継プログラムにはPHPやJavaなどのサーバーサイドで動くプログラミング言語が使われます。今回はレンタルサーバーでもよく利用されているPHP言語を使うことにします。
【1】sample004 フォルダに、「pref.php」を作成します。pref.php は必ず SHIFT-JIS 形式で保存してください。
＊「\」はWindowsでは円記号のことです。
保存先 C:\phpdev\www\ajax\sample004
ファイル名 pref.php
<?php
header("Content-type: application/xml");
$url = "http://ws.bzen.net/pgtop/pref.xml";
readfile($url);
?>
【2】次は pref.js の一部を変更します。
var url = "pref.php";
これで準備ができました。動作を確認してみましょう。
【3】C:\phpdev にある「2K-NT-XP-phpdev_start.bat」をダブルクリックして、phpdev を起動します。
まず中継プログラムが正常に動くか確認してみましょう。
【4】Firefox を起動して、アドレスに以下のように入力し実行します。
http://localhost/ajax/sample004/pref.php
XMLが表示されたらOKです。とても大事なポイントですが、アドレスに注目してください。
このXMLは外部ドメインのデータですが、中継プログラムの働きでアドレスが localhost 内になりました。これでデータを取得できるようになります。
【5】Firefox のアドレスに以下のように入力し実行します。
http://localhost/ajax/sample004/pref.html
【6】「データ取得」ボタンをクリックします。
【7】データが表示されました。
・Firefox で表示した場合
【8】Internet Explorer でも確認してください。
・Internet Explorer で表示した場合
見た目はこれまでのプログラムと変わりませんが、外部のドメインにあるデータを利用できるようになったのは大きな変化です。これで各WebサービスやRSSなどで提供されている膨大なデータを利用することができます。
【解説】
中継プログラムは難しくありません。たった3行で最低限必要な動きはできます。
(1)ヘッダを設定している部分です。
header("Content-type: application/xml");
header() 関数は HTTP ヘッダを送信するために使用されます。XMLで出力するようにしています。
header() を使わなかった場合はXMLとして表示されません。
(2)UTF-8 形式で保存すると header() の部分がうまく動きませんでした。
これは「ヘッダー情報は既に送信済みなので変更できない」という警告です。header() の前に空白や空行があったり、出力が行われてしまうとこのような警告がでるようです。
UTF-8 で保存すると何故そうなるのか原因はわからないのですが、とりあえず SHIFT-JIS で保存すると問題なく動きます。
(3)取得するファイルのURLを変数に代入している部分です。
$url = "http://ws.bzen.net/pgtop/pref.xml";
他のファイルを取得する時は、この部分を変えるだけです。WebサービスによってはURLにパラメータを含める場合があります。パラメータでURLが長くなることもあるので、変数に代入しておいたほうが便利です。
(4)ファイルを読み込んで出力している部分です。
readfile($url);
実際に外部のドメインにあるファイルを開いているのは、readfile()関数を使っているこの1行です。
(5)同一ドメイン内について
非同期通信に関しては、サブドメインは別ドメインとして扱われるので注意が必要です。
例えば pgtop.net にプログラムがある場合、下層のディレクトリにはアクセスできますが、サブドメインにはアクセスできません。
○ pgtop.net/ajax/
× ajax.pgtop.net/
PHP言語は奥が深いですが、中継プログラムとして使う分には、最低限の使い方さえわかれば大丈夫です。
PHPについてもっと詳しく知りたい場合は、 PHP初心者入門講座 を参考にしてください。
