PHPでファイルをアップロードするためにこれまでに見つけたすべての例には、次のものがあります。
- ファイルの選択
- 送信ボタンを押してアップロードします(投稿を使用)。
ユーザーが「アップロード」ボタンをクリックする必要がないように、ファイルを選択した直後に単純に送信する方法はありますか? 私はこれが可能であることを知っています。Dropbox の Web サイト、または Google Drive を見てください。ただし、彼らが PHP を使用しているかどうかはわかりません。
PHPでファイルをアップロードするためにこれまでに見つけたすべての例には、次のものがあります。
ユーザーが「アップロード」ボタンをクリックする必要がないように、ファイルを選択した直後に単純に送信する方法はありますか? 私はこれが可能であることを知っています。Dropbox の Web サイト、または Google Drive を見てください。ただし、彼らが PHP を使用しているかどうかはわかりません。
あなたには2つの方法があります:
<form id="frm" action="upload_file.php" method="post" enctype="multipart/form-data"> <label for="file">Filename:</label> <input type="file" name="file" id="file" /><br/> </form> <script type="text/javascript"> <!-- $(document).ready(function(){ $('#file').change(function(){ $('#frm').submit(); }); }) --> </script>
お役に立てば幸いです...
セキュリティ上の理由から、HTML ファイルのアップロード ボタンはスクリプト化できません。
必要なのは、HTML5http ://www.w3.org/TR/FileAPI/の一部であるFileAPIです。これには、AJAXリクエストなどを介してデータをアップロードする機能が含まれています。
残念ながら、ブラウザのサポートはまだ不十分であるため、ChromeやFirefoxでDropboxのようなドラッグアンドドロップUIを実装できる場合があります。IEのフォールバックが必要になります。
以下のコードは、ブラウザーの非互換性に関係なく、問題を解決します。私はこれを非常に頻繁に使用します。
function startUpload() {
var file_button = document.createElement('input');
file_button.type = "file";
file_button.id = "file_button1";
file_button.style.display = "none";
file_button.style.position = "absolute";
file_button.onchange = function() {
var form_data = new FormData();
var file = jQuery(this).get(0).files[0];
form_data.append('file', file);
form_data.append('type', type);
form_data.append('name', 'fileToUpload');
setTimeout(function() {
jQuery.ajax({
url: "/uploadfile.php",
type: "POST",
cache: false,
contentType: false,
processData: false,
data: form_data,
xhr: function() {
var myXhr = jQuery.ajaxSettings.xhr();
if (myXhr.upload) {
myXhr.upload.addEventListener('progress', custom_progress, false);
}
return myXhr;
},
success: function(response) {
console.log(response);
}
});
}, 1000);
};
jQuery(document.body).append(file_button);
file_button.click();
jQuery("#file_button1").remove();
}
function custom_progress(e) {
if (e.lengthComputable) {
var x = (e.loaded / e.total) * 100;
jQuery("#progress").html(x + "%");
}
}
サーバー側のコードは次のようになります
<?php
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;
$imageFileType = pathinfo($target_file, PATHINFO_EXTENSION);
// Check if image file is a actual image or fake image
$check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
if ($check !== false) {
echo "File is an image - " . $check["mime"] . ".";
$uploadOk = 1;
} else {
echo "File is not an image.";
$uploadOk = 0;
}