印刷時に空の $_FILES グローバル配列を取得し続ける理由がわかりません。私はそれを見てきましたが、どこが間違っているのかわかりません。そのため、すべてのコードを示しました。ボタンを使用すると、サーバーに問題なく到達し、すべてがうまくいきます。しかし、ドラッグアンドドロップを使用すると、サーバーにファイルがありませんか? 理由はありますか?配列を印刷すると、配列(0)になります。
while ループに問題が 1 つ見つかりましたが、これはまだファイルが修正されていません。投稿アクションが正しいかどうか疑問に思っている人がいる場合に備えて。URL は mod_rewrite を使用して書き換えられます。正しいphpページが表示されるので、ページに到達したと想定しています。mod_rewrite はファイルのアップロードに影響します。私はそうは思わない...?
<!DOCTYPE html>
<html>
<head>
<title>Music Upload</title>
<style>
#zone
{
height:300px;
width:500px;
border:1px solid black;
}
</style>
</head>
<body>
<div id="zone">
<legend>Drop a file here…</legend>
<p>Or click button to <em>Browse</em>…</p>
</div>
<form action="../receive/" method="POST" enctype="multipart/form-data">
<input type="file" name="file[]" multiple />
<input type="submit" value="submit" />
</form>
<script>
function dragover(event)
{
event.preventDefault();
console.log("drag event");
return false;
};
function dragend(event)
{
event.preventDefault();
console.log("drag end event");
return false;
};
function drop(event)
{
console.log("Files droped");
event.preventDefault();
var files=event.dataTransfer.files;
fileupload(files);
};
function isMp3(file)
{
console.log("Check if mp3 file");
mimeTypes=['audio/mpeg','audio/mp3','audio/x-mpeg-3'];
for(var i=0;i<mimeTypes.length;i++)
{
if(file.type==mimeTypes[i])
{
return true;
};
};
return false;
};
function fileupload(files)
{
if(files.length>0)
{
var formData= new FormData();
var i=0;
while(i<files.length)
{
var file= files.item(i);
if(isMp3(file)){
formData.append('file[]',files[i++]);
console.log('valid mp3');
}
}
var xhr = new XMLHttpRequest();
xhr.open('POST','/mymusic/receive',true);
xhr.onload=function()
{
if(this.status==200)
{
console.log('data sent');
console.log(this.responseText);
}else
{
console.log('data failed');
}
};
xhr.upload.onprogress=function(event)
{
if(event.lengthComputable)
{
var complete=Math.round(event.loaded*100/event.total);
console.log(complete+"%");
}
};
xhr.send(formData);
}
};
var dropArea=document.getElementById("zone");
dropArea.addEventListener("dragover",dragover,false);
dropArea.addEventListener("dragend",dragend,false);
dropArea.addEventListener("drop",drop,false);
console.log('script loaded');
</script>
</body>
</html>
<?php exit();?>
ここにサーバーファイルがあります。それは本当に重要ではありませんが、念のため
<?php
echo "server reached\n";
var_dump($_POST);
var_dump($_FILES);
exit();
?>