翻訳：Use a Web Proxy for Cross-Domain XMLHttpRequest Calls

このエントリーは下記の翻訳です。ただ読むのもつまらないし、自分の血となり肉となるよう翻訳に挑戦。

JavaScript: Use a Web Proxy for Cross-Domain XMLHttpRequest Calls

JavaScript: クロス・ドメインXMLHTTPRequest呼び出しの為のウエブ・プロキシの利用
XMLHttpRequestオブジェクト（XHR）は、ＡＪＡＸを利用したウエブアプリケーションの根幹となるオブジェクトです。しかし、ブラウザーによる、ドメインをまたがってのネットワーク・アクセス制限の為、クライアント・ウエブ・アプリケーションの開発は複雑です。このハウツーでは、単純なケースを用い問題点を説明し、一つの解決策（あなたのウエブ・サーバーから他のウエブ・サービスにリクエストを中継するウエブ・プロキシ）を提供します。

• なぜプロキシが必要なのか？
• Yahoo!ウエブサービス用のＰＨＰプロキシ
• 他の解決策
• その他の情報

なぜプロキシが必要なのか？
全ての最新のウエブ・ブラウザーは、ネットワーク接続にセキュリティーの為の制限を加えている。その中にＸＭＬＨｔｔｐＲｅｑｕｅｓｔも含まれる。この制限はスクリプトやアプリケーションが、元のウエブ・サーバー以外のサーバーに接続する事を禁止している。あなたのウエブ・アプリケーションとアプリケーションが利用するＸＭＬデータが同じサーバーから来る場合は、この制限に含まれない。

しかしながら、あなたのウエブ・アプリケーションと、アプリケーションが利用するデータが違うサーバー（例えばYahoo!　Web Services）から提供される場合は、ブラウザーは他のサーバーに接続する事を制限する。

この問題には、いくつかの解決策がある。もっとも一般的な解決策は、ウエブ・サーバーにプロキシを設定する方法である。XMLHttpRequestを使用し、直接ウエブ・サービスを呼び出す代わりに、プロキシに対して呼び出します。プロキシは呼び出しを実際のウエブサービスに中継し、そしてウエブ・サービスからの返答を、クライアントに中継します。ブラウザは、あなたのウエブ・サーバーに対して接続しているので、データはあなたのサーバーから返されます。

セキュリティー上の理由から、利用が制限されたウエブ・サーバーにプロキシをインストールする事は良いアイデアである。どのウエブサイトにも接続する開かれたプロキシは悪用にも開かれている。プロキシへの接続をあなたのアプリケーションのみに制限するのは難しいけれども、あなたはプロキシからの接続を指定したサーバー以外への接続を制限できる。接続するＵＲＬをプロキシ内にハード・コードしたり、オプションを制限することにより、あなた以外のアプリケーションにとって、利用価値を少なくする事が出来る。

Yahoo!ウエブサービス用のＰＨＰプロキシ
Yahoo! Developer NetworkJavaScript Developer Centerにて、Yahoo! Search APIのためのＰＨＰで書かれた単純なウエブ・プロキシを提供しています。あなたのウエブ・サーバーに、このプロキシをインストールすることが出来ます。

プロキシはグローバル・変数の中にＨＯＳＴＮＡＭＥという名前でYahoo!ウエブ・サービスのＵＲＬを組み込んでいる。あなたは、この変数をあなたが利用するウエブ・サービスに変更する必要があります。これはYahoo!ウエブ・サーチ・サービスに使われているドメインです。他のドメインにはYahoo!ローカル (http://local.yahooapis.com) や Yahoo! トラベル (http://api.travel.yahoo.com)があります.

define ('HOSTNAME', 'http://search.yahooapis.com/');

このＰＨＰプロキシをあなたのクライアントアプリケーションから利用するためには、ＪａｖａＳｃｒｉｐｔのコード内にあるウエブ・サービス・リクエスト用のＵＲＬに、ドメイン名以外のYahoo!ウエブ・サービスリクエストへのパスが含まれている必要があります。ドメイン名はプロキシにより付加されます。下記のコードは、JavaScript Developer Centerの、more complete XMLHttpRequest code sampleから引っ張って来ました。

// The web services request minus the domain name
var path = 'VideoSearchService/V1/videoSearch?appid=YahooDemo&query=madonna&results=2';

// The full path to the PHP proxy
var url = 'http://localhost/php_proxy_simple.php?yws_path=' + encodeURIComponent(path);
... // core xmlhttp code
xmlhttp.open('GET', url, true);

このサンプルではＨＴＴＰ・ＧＥＴを使用しているが、サンプルのＰＨＰプロキシはＰＯＳＴもサポートしている。

あなたは、このプロキシを編集して、クライアントへの返答を、より扱いやすい形に変更できる。

他の解決策
プロキシの他にも、クロス・ドメイン・ブラウザ制限を回避するためのいくつかの方法がある。

• アパッチのmod_rewrite、又はmod_proxyを利用し、あなたのサーバーから他のサーバーへリクエストを転送することが出来る。あなたのクライアント・コードからはあたかもウエブ・サーバー上にサービスがあるかのようにリクエストを送る。そしてアパッチがあなたのために他のサーバーへリクエストを転送してくれる。
• JSONと、dynamic<script>タグをXMLとXMLHttpRequestの代わりに使用する。<script>タグの中で直接ウエブ・サービスを呼んでいるが、セキュリティーの問題を回避できる。もしあなたが使用するウエブ・サービスがＪＳＯＮをアウトプット・フォーマットとする事が出来れば、ウエブ・サービスからのレスポンスをJavaScriptオブジェクトとしてeval出来る。このサンプルはJSON Documentationにある。
• デジタルとしてあなたのスクリプトをサインする。Firfoxはあなたのスクリプトにデジタル・サインを当てる事ができ、そしてそれらのスクリプトはブラウザーにより信頼される。この方法で、ＦｉｒｅｆｏｘはXMLHttpRequestをたのドメインに対し使用できる。しかしまだ他のブラウザーはこの昨日をサポートしていない。

その他の情報
JavaScript、XMLHttpRequest, Yahoo! Web Service APIs、その他のJavaScript開発に関する情報は、Yahoo! Developer Network JavaScript Developer Centerを参照して下さい。