2009年07月03日


prototype.js の Ajax.Request を使い、FORM を使わずにデータをPOSTする

MSXML2.XMLHTTPでファイルをPOSTする と同系列で、IE で実行する場合、結局prototype.js内では
MSXML2.XMLHTTPを使っています。VBScriptで通常のアプリケーションとして実行する
場合と違って、同一ドメイン内でのみ実行可能です。
<?
header( "Content-Type: text/html; Charset=shift_jis" );
header( "pragma: no-cache" );
header( "Expires: Wed, 31 May 2000 14:59:58 GMT" );
header( "Cache-control: no-cache" );

foreach( $_GET as $Key => $Value ) {
	$_POST[$Key] = $_GET[$Key];
}
foreach( $_POST as $Key => $Value ) {
	$_POST[$Key] = str_replace("\\\\", "\\", $Value );
	$_POST[$Key] = str_replace("\\'", "'", $_POST[$Key] );
	$_POST[$Key] = str_replace("\\\"", "\"", $_POST[$Key] );
}

if ( $_SERVER['REQUEST_METHOD'] == 'POST' ) {

	// ファイルへ入力されたデータを書き込み
	file_put_contents( "text.dat", $_POST['text'] );
	print "データはUTF-8で受信しています";
	exit();

}

?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />

<script
	src="http://www.google.com/jsapi"
	type="text/javascript"
	charset="utf-8"
></script>
<script type="text/javascript">

// Google で HOSTINGされているライブラリを使う
google.load("prototype", "1.6");

// *********************************************************
// HTTP 通信
// *********************************************************
function postText(text) {

	// ■ サーバー側コードは 自分自身
	// ■ GET
	// ■ 同期処理
	// ■ target=filename
	// オブジェクト作成 = イベント作成です
	new Ajax.Request("<?= $_SERVER['PHP_SELF'] ?>",
	{
		method: "post",
		asynchronous: false,
		parameters: { "text" : text },

		onSuccess: function(request) {
			// 成功した事が保証される
		},
		onComplete: function(request) {
			$("text").value = request.responseText;
		},
		onFailure: function(request) {
			alert('読み込みに失敗しました   ');
		}
	}
	);
}

</script>

</head>
<body>

<input type=button value="初期画面" onClick='location.href="<?= $_SERVER['PHP_SELF'] ?>"'>
&nbsp;
<input type=button value="HTTP通信" onClick='postText($("text").value);'>
<br>
<textarea id=text name=text cols=80 rows=15></textarea>


</body>
</html>

■ 関連する記事
prototype.js の Ajax.Request の encoding パラメータ


posted by at 2009-07-03 15:31 | クライアント/サーバー | このブログの読者になる | 更新情報をチェックする