[TIPS]JavaScriptから他ドメインのファイルにアクセスする方法
長いタイトルになってしまいましたが・・・。
内容も長い・・・。
JavaScriptを使うと、
自ドメインのファイルにはアクセスできますが、
他ドメインのファイルにはアクセスできない。
という仕様があります。（最近知ったけど）
それで今回は、
phpを呼び出して、
その中でファイル取得して、
JavaScriptで処理する。
という方法をやってみました。
参考にしたURLはこちら。(大変助かりました、ありがとうございます)
「必ず得するかもしれない一言」さんの「javascriptからphp呼び出し」という記事。
http://blogs.yahoo.co.jp/koga2020/49620713.html
用意するのは、HTMLとPHPファイル。
今回は起動(body onload)時に処理を行うようにしています。
※ボタン用意してクリックしたらという動作も可能
1.【html】<body onload>でgetData()呼び出し
2.【html】getData()内で値を設定し、実行
→php実行
3.【php】callback名、引数名を取り出し
4.【php】他ドメインのtxtを取得
5.【php】改行コードを変換
(変換しないとエラーになります)
6.JavaScriptを実行する処理を設定($htmlに値をセット)
ココが肝心なところ
parent.’.$callback.'(“‘.$data.'”);
parentは現在のフレームから他フレームを参照します。
現在のフレームは、【html】“getdata_Frame”のこと
他フレームは、【html】“form1”のこと
つまり、“form1”の“callback”を呼び出しますよの記述
7.【php】echoで$htmlを出力(実行)
8.【php】終了
9.【html】“form1”の“callback”に設定されたgetdata_callback()を呼び出し
10.【html】getdata_callback()で引数(newdata)にtxtの取得結果が設定されている
以下は参考ソースです。(動作確認してないので、動かなかったらごめんなさい)
index.html
<html>
<head>
<script type=”text/javascript”>
<!–
// php実行後に呼び出される関数を作成
function getdata_callback( newdata ){
//php実行後の処理を記述
}
function getData(){
// php実行後に呼び出される関数を設定
document.getElementById(“form1”).callback.value = “getdata_callback“;
document.getElementById(“form1”).arg1.value = “値は任意”;
document.getElementById(“form1”).submit();
}
// phpを呼び出す関数をコール
getData();
}
–>
</script>
</head>
<!– php呼び出しのイベント。body onloadでなくても良い –>
<body onload=”initialize()”>
<form id=“form1” action=”getdata.php” target=“getdata_Frame” method=”post”>
</form>
<iframe id=“getdata_Frame” name=“getdata_Frame” style=”width:0;height:0;visibility:hidden” tabindex=”-1″></iframe>
</body>
</html>
getdata.php
<?php
//JavaScriptから受け取った値の取り出し
$callback = $_POST[“callback”];
$arg1 = $_POST[‘arg1’];
$path = “http://www.xxxx.co.jp/zzzz.txt”;
$temp = file_get_contents($path);
//これで値を受け渡せる
parent.’.$callback.'(“‘.$data.'”);
</script>
‘;
echo $html;
exit;
?>
Comments are currently closed.