外部 CGI から結果を取ってきて、JavaScript の中でその結果をほげほげしたい。
とりあえず、「JavaScriptで外部サイトのファイルを取得するためのTips」というサイトを参考にして、CGI で吐出される結果を JavaScript 内に取り込んでくるところまでテストしてみた。
実際に JavaScript で外部のサーバを参照（CGI や PHP の結果を取得）しようとすると、自ドメインのサーバ以外は「クロスドメイン制約」というセキュリティ上の制限が発生する。要は、www.exsample.co.jp サーバで実行される JavaScript から www.exsample.com の CGI は参照できないってことね。
これはサブドメインでも制限を受けるので、www.exsample.co.jp から www2.exsample.co.jp を参照する場合もアウト。
で、JSONP とか使って自力でこの制限を回避するスクリプトを書くことは出来るが、けっこう複雑なものになるので、jquery.xdomainajax.js を使うのが便利とのこと。
#!/usr/bin/perl
@t = localtime();
$t[5] += 1900;
$t[4] += 1;
print "Content-type: text/plain; charset=UTF-8\n\n";
print "$t[5]/$t[4]/$t[3] $t[2]:$t[1]:$t[0] Now!";
# END
という CGI を、下記のように JavaScript から呼び、結果をアラート窓で表示するだけの処理をしてみた。
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>外部CGI呼び出し</title>
<meta name="description" content="テストです">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type=text/javascript src=https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js></script>
<script type=text/javascript src=https://github.com/jamespadolsey/jQuery-Plugins/raw/master/cross-domain-ajax/jquery.xdomainajax.js></script>
<script type=text/javascript>
uri = 'http://test.exsample.jp/cgi-bin/test.cgi';
$.get(uri, function(data) {
alert(data);
});
</script>
</head>
<body>
<p>Dummy</p>
</body>
</html>
結果はバッチリじゃん。
最初に実行した時は、ブラウザ下部に「安全な接続を確立しています」と出てけっこう結果が返ってくるまで待たされた。
二回目以降の実行ではサッと結果返ってくるようになったけどな。これは留意しておいたほうがいいかも。
コメントする