end0tknr's kipple - web写経開発

太宰府天満宮の狛犬って、妙にカワイイ

CrossXhrによるクロスドメイン通信

javascript

CrossXhrによるクロスドメイン通信

flashのクロスドメイン通信をjavascriptから利用できるCrossXhrというライブラリを見かけました。

http://code.google.com/p/crossxhr/wiki/CrossXhr

CrossXhrのドキュメントに記載されている通りですが、以下ではCrossXhrの利用方法を記載しています。

crossxhr.js, crossxhr.swf の配備

次のurlから、crossxhr-0.1.0.zip を入手し、中に含まれるcrossxhr.js, crossxhr.swf を同じ場所に配備します。

http://code.google.com/p/crossxhr/downloads/list

呼び出し元htmlの作成

呼び出し元のhtmlでは、crossxhr.jsをインクルードし、XMLHttpRequestの代わりにCrossXHRを使用します。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="crossxhr.js"></script>
</head>
<body>

<script>
var request;
function callback() {
   if (request.readyState == 4) {
     try {
       if (request.status != 200) {
           alert('error');
       } else {
         alert("got data: "+request.responseText);
       }
     } catch(e) {
         alert('error');
     }
   }
}

function get_crossdomain() {
  request = new CrossXHR();
  request.onreadystatechange = callback;
  request.open('GET', 'http://localhost/test_local.txt');
  request.send();
}

get_crossdomain();
</script>
</body>
</html>
crossdomain.xmlを配備して完成

呼び出される側には、例えば、次のようなcrossdomain.xml を配備すれば、クロスドメイン環境の完成です。

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy
          SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
  <allow-access-from domain="*" />
</cross-domain-policy>

http://search.yahooapis.com/crossdomain.xml があるということは
crossdomain.xml って一般的なのかな?

iframeでもクロスドメイン通信できるらしい

flashで簡単にクロスドメイン通信を実現できることを今回、初めて知りましたが、どうやらiframeでもクロスドメイン通信できるみたいです。
iframeによるクロスドメイン通信は、また、別の機会に。