クロスドメインXMLHttpRequestを実現するnode.js/expressプロキシ
node.jsのexpress用のプロキシmiddlewareです。以下のコードをJavaScriptをホストするサーバーで走らせるだけでJSONPが対応していないサーバーに対してもクロスドメインのXHRを可能にします。(localhostは最終的なドメイン名に書き換えてください)
>npm install xhr2proxy
var xhr2proxy = require('xhr2proxy');
var app=require('express').createServer();
app.use(xhr2proxy(prefix:'myprefix',referer:/^http:\/\/localhost/}));
app.listen(8000);
以下の様にJavaScriptからアクセスします。refererオプションの正規表現にマッチしたreferer以外は受け付けません。オプションがない場合はすべてのアクセスを受け入れます。自由に使えるプロキシとなってしまうので注意してください。またrefererの偽装には対応できません。
var xhr=new XMLHttpRequest();
xhr.open('get','http://localhost:8000/myprefix/http://myremote.server',false);
xhr.send();
また、JavaScriptをホストするサーバーとnode.jsを実行するサーバーが異なる場合は以下のコードでXHR Level2用のヘッダをすべてのレスポンスに付加します。
var xhr2proxy = require('xhr2proxy');
var app=require('express').createServer();
app.use(xhr2proxy(prefix:'myprefix',acao:'*')); ////Append [Access-Control-Allow-Origin: *]
app.listen(8000);
クロスドメインのXMLHttpRequestの方法とXHR Level2について
XMLHttpRequestはクライアントブラウザからJavaScriptでHTTP通信(ajax)をする為のAPIです。しかしながらXHR Level1ではドメインが異なるサーバーとは通信できないという制限がありました。例えば/tech/のHTMLから起動したJavaScriptからはhttp://www.yahoo.comのデータはとりにいけないということです。
これはとても不便で例えば天気情報を天気予報サイトから取得して表示といったアプリケーションを作るにはクライアントサイドだけでは対応できずサーバーのCGIを使ったり、情報提供サイトにJSONP対応してもらうしかありませんでした。
そこで策定されたのがXHR Level2です。W3C勧告によるとクライアント側の呼び出しはそのままでデータ提供側のHTTPレスポンスヘッダに以下の行を追加すればよいという仕様です。
Access-Control-Allow-Origin: *
しかしながらこれは実は何も解決していません。なぜならデータ提供側（上の例で言うと天気予報サイト側）の対応が必要という意味ではJSONPとなんら変わりが無いからです。
結局はコントロール不能なデータ提供元に対しては本モジュールのようなJavascriptをホストしているドメインにプロキシを置くかすべてのプロキシリクエストのレスポンスにAccess-Control-Allow-Originをつけて返すプロキシが必要なのが現状です。
npmとgithub
参考リンク
- XMLHttpRequest Level2を使って別ドメインと通信する | Azrael
- XMLHttpRequestはスクリプト配布元としか通信できない、というと間違い | やむにやまれず
- JavaScript : クロスドメインなXHR : typeOf 'aki_mana'
- ネコとウサギとオブジェクト - XMLHttpRequest Level2でクロスドメイン通信を行う(GET)
- 続 クロスドメインで使う XMLHttpRequest と CORS の話 | 日頃の行い
- XMLHttpRequest のクロスドメインの制約についてまとめたφ（．．）メモメモ - 猫(=・ω・=)顔 1.0β
