JQueryのpostメソッドでファイルをアップロードする方法を教えてください

解決済

質問者：diz108
質問日時：2010/01/12 15:18
回答数：2件

以下の技術を使ってwebシステムを開発しています。
jquery 1.3.2
php 5.2.6
Apatch 2.2.10

システムにファイルをアップロードしたいのですが出来ません。
JQueryの$.post()メソッドを使ってアクションを呼び出しているのですが
phpの$_FILESが取得できません。
方法をご教授ください。

JQuery、phpともに初心者です。
不足している情報があれば教えてください。

ソースや設定は以下です。
//// upload.html /////////////////////////////////
<html>
<head>
<title>upload</title>
<script type="text/javascript" src="./jquery-1.3.2.min.js" ></script>
<script type="text/javascript">
function execPost()
{
var params = $('#testform').serialize();
$.post(
'http://localhost:8080/upload",
params,
function(data) {
// post後処理
});
}
</script>
</head>
</body>
<form name="testform" id="testform" enctype="multipart/form-data" method="post" >
<input type="hidden" name="MAX_FILE_SIZE" value="10000" />
<input type="file" name="file" />
<input type="button" name="post" onclick="execPost()" />
</form>
</body>
</html>

//// upload.php //////////////////////////////////
<?php
$filename = $_FILES['file']['name']
?>

//// php.ini /////////////////////////////////////
;;;;;;;;;;;;;;;;
; File Uploads ;
;;;;;;;;;;;;;;;;

; Whether to allow HTTP file uploads.
file_uploads = On

; Temporary directory for HTTP uploaded files (will use system default if not
; specified).
;upload_tmp_dir =
upload_tmp_dir = "/tmp"

; Maximum allowed size for uploaded files.
upload_max_filesize = 2M

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： mtaka2
回答日時：2010/01/12 17:59

セキュリティ上の問題から、input type="file" で指定したファイルの中身をJavaScript からは読みとることができません。

そのため、jQuery などのAJAXライブラリを通して、ファイルをアップロードするのは不可能です。

「ページ遷移しないアップロード」を実現した場合は、
ブラウザの機能としてのフォーム投稿を使って、
iframeを使ったAJAX的通信手段を通すことで、元のページは遷移させないようにするのが一般的です。

iframe を使ったファイル送信の原理については、PHPではありませんが、
http://rubyist.g.hatena.ne.jp/yamaz/20060908
このページなんかが参考になるかと思います。

PHPで、iframe を使ったファイルアップロードについては
http://www.phppro.jp/news/249
なんかにサンプルがあります。