マリンアクアリウムのためのサンプをセットアップする方法
クロスドメインPHP|ウェブサービスAPI|1.023world
クロスドメインPHP
ウェブサービスAPI を利用したウェブアプリケーションを開発する上で、 例えば Ajax(JavaScript)を使用してレスポンスXMLを取得しようとする場合、 同じドメイン内から自サイト内のファイルを取得する分には問題ありませんが、 別サーバーにあるファイルを取得しようとする場合は、 クロスドメインの問題によりアクセスできないようになっています。
○ Ajax(ドメインA) ───→ ウェブアプリケーションAPI (ドメインA)
× Ajax(ドメインA) ───→ ウェブアプリケーションAPI (ドメインB)
この場合、クロスドメイン問題を回避して、レスポンスXMLの取得とAjaxへのデータ受け渡しをアシストしてくれるような別の仕組み(CGI やPHP等)が必要になってきます。
どの沼クーラー動作しますか?○ Ajax(ドメインA) ───[CGI/PHP]──→ ウェブアプリケーションAPI (ドメインB)
そのための簡単なPHPをご紹介します。
以下のソースをコピーして、「load.php」と言うファイル名で保存してください。(ファイル名は自由です)
たったこれだけでOKです。
CGI だともう少し長いソースになったり、実行にはパーミッションの設定が必要になりますが、 PHPならサーバーへ放り込むだけで済むので、とても管理が楽になります。(もちろんPHP対応のサーバーが必要)
あとは、AjaxからウェブサービスAPI へリクエストする際に、このPHPを介すだけで取得が可能になります。
(load.php は Ajax を実行する側のサーバーに設置してください)
× Ajax ──[取得不可]─→ http://API のURL/propolene作業を行います
○ Ajax ──[取得成功]─→ load.php?url='GET',url,true); xml.onreadystatechange = function(){ if(xml.readyState == 4){ clearInterval(timer); alert(xml.responseText); // ここへレスポンス取得後の処理を記述 } }; xml.send(null); } function objXML(){ try{ return new XMLHttpRequest(); }catch(e){ try{ return new ActiveXObject('Msxml2.XMLHTTP'); }catch(e){ try{ return new ActiveXObject('Microsoft.XMLHTTP'); }catch(e){ return null; } } } } function timeout(){ clearInterval(timer); xml.abort(); alert('ERROR : Timeout.'); }-
getXML('http://api.anomura.1023world.net/');
* 5秒後にタイムアウト (エラー)-
getXML('load.php?url=');
レスポンス取得後の XML のパーサー部分のスクリプトの記述は割愛します。自由に行ってください。
ちなみに「クロスドメインPHPを使ったAjaxサンプル」と書いておきながら、ここではクロスドメインによる実験結果を見せるために、 敢えてスクリプト自体にはload.php
を介す処理を含めていません(引数自体に含めて関数へ渡してます)。 なので、実際にこのサンプルソースを流用する際には、スクリプト内にPHPパスも含めてしまうと良いでしょう。
また、当サイトのウェブアプリケーションサンプル JavaScript も、参考になれば幸いです。
api-anomura.js / 超ヤドカリ図鑑 Ajax
api-shop.js / ショップ新着案内 Ajax
0 コメント:
コメントを投稿