2011年02月03日


クロスドメインで、showModalDialog を使用する

toolbox.winofsql.jp にある、modalDialog.htm を showModalDialog で呼び出して
データ交換を行います。IFRAME として、modalDialogServer.htm を組み込む必要が
あります。データは、toolbox.winofsql.jp 用の localStorage を使用して保存され
ますが、一時的な中間データとして扱います。
Opera は showModalDialog を使用できないので、同等の処理を行うにはそれ相当の工夫と努力が必要になります。


modalDialogServer.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta content="text/html; charset=euc-jp" http-equiv="Content-Type">
<title>モーダルダイアログサーバー</title>
<style type=text/css>
* {
	font-size: 12px;
}

textarea {
	width:700px;
	height:400px;
}
</style>
<script type=text/javascript>

var text;

if ( window.attachEvent ) {
	window.attachEvent('onmessage',function(e) {
		text = e.data;
		// 先頭コマンド 'A' で、ローカル保存
		if ( text.substr(0,1) == 'A' ) {
			if ( text.substr(1) == '' ) {
				localStorage['serverText'] = new String("");
			}
			else {
				localStorage['serverText'] = text.substr(1);
			}
		}
		// 先頭コマンド 'B' で、ローカル保存されていたデータを親ウインドウに POST
		if ( text.substr(0,1) == 'B' ) {
			parent.postMessage(localStorage['serverText'], "*");
		}
	});
}
else {
	window.addEventListener('message',function(e) {
		text = e.data;
		// 先頭コマンド 'A' で、ローカル保存
		if ( text.substr(0,1) == 'A' ) {
			if ( text.substr(1) == '' ) {
				localStorage['serverText'] = new String("");
			}
			else {
				localStorage['serverText'] = text.substr(1);
			}
		}
		// 先頭コマンド 'B' で、ローカル保存されていたデータを親ウインドウに POST
		if ( text.substr(0,1) == 'B' ) {
			parent.postMessage(localStorage['serverText'], "*");
		}
	}, false);
}

</script>
</head>
<body>
</body>
</html>


ダイアログと呼び出し側のコード

関連する記事

showModalDialog の使い方と使う場所


【クロスドメインの最新記事】
posted by at 2011-02-03 14:16 | クロスドメイン | このブログの読者になる | 更新情報をチェックする