クロスドメインリクエスト

4 6月

(text by kondo)

 

クロスドメインリクエストに関してまとめます。以下は参考サイト。

Access-Control-Allow-Origin試してみた

XDomainRequest – Restrictions, Limitations and Workarounds

コンテンツを設置する(LMSがある)サーバーと,TeXソースに変換したり採点を引き受けるサーバーは,別々のものとなる場合があるので,Javascriptからのサービスの要求はクロスドメインリクエストとなります。

 

IE以外であれば、リクエストは下記のようなものとします(特に特殊なところはないと思います)。

 $.ajax({
url: target_url,  // リクエスト先のURL
type: ‘post’,
data: {‘param’: xmlText},  // 送るデータ(xmlText)のセット。 param という名称。
timeout:3000,
success: a_function, // 返事を受信したときに呼び出す関数(a_function)
error:function(XMLHttpRequest, status, ethrown){
alert(status);  // エラー処理を何かする
}
});

返信は 、php の例ですが、下記。ヘッダーが重要なようです。他はいつも通りです。

<?php
header(‘Access-Control-Allow-Origin:*’);
header(‘Access-Control-Allow-Headers:*’);
header(‘Access-Control-Allow-Methods:GET, POST, OPTIONS’);
header(‘Content-Type: text/plain’);

// 何かの処理をする

echo $a_text.”\n”; // 返事をする
?>

 

IE であれば、通信するサーバーが両方ともhttpであるか、httpsであることが必要な様です。その条件を満たした場合、下記のようなリクエストで良いようです。

xhr = new XDomainRequest();
xhr.onload = function() { a_function(xhr.responseText)};  // レスポンスを受け取って、実行する関数(a_function)の指定。
xhr.open(‘POST’, target_url);  // リクエスト先のURL
xhr.send(‘param=’+ a_text); // 送信するデータ(a_text)の設定。名称も指定(param と指定)。

 

大学のサーバーがhttpsで研究室のサーバーがhttpでしたので、上記では通信できません。そこで、通信の機能をもつ flash を用意して、IEであればこの flash を読み込むようにしました。下記にでてくる poweredbyflash というflash を先に読み込んでおきます。その上で、下記のようなリクエストをします。

var flash = (navigator.appName.indexOf (“Microsoft”) !=-1)?window[“poweredbyflash”]:document[“poweredbyflash”];
flash.sendRequest(a_text,target_url, ‘a_function’);  // 送信データ(a_text)と、送り先(target_url)を指定。返事を受け取る関数(a_function)も指定。

poweredbyflash の中では、 sendRequest という関数が用意されていて、javascriptから利用できるように下記のような宣言がなされています。

ExternalInterface.addCallback(“sendRequest”, sendRequest);

あとは、flash用のクロスドメインポリシーファイルにサーバー名を追加するだけです。crossdomain.xmlという名称のファイルをwebサーバーのドキュメントルートに用意して、下記のように記述します。kanaike.susi.oita-u.ac.jpというサーバーからのリクエストを許可する場合です。

<?xml version=”1.0″?>
<cross-domain-policy>
<allow-access-from domain=”kanaike.susi.oita-u.ac.jp” />
</cross-domain-policy>

このような準備をしておくと、flashの通信機能を経由して、クロスドメインリクエストが可能となります。