Javascript 基本多文件上载在移动设备上不起作用

我创建了一个非常基本的多文件上传表单（）示例，它在桌面上工作得非常完美，但在移动设备上却不行，至少在我正在测试的那些设备上是如此

在手机上（小米Mi4[Android版本：6.1]-谷歌Chrome/Mozilla Firefox）：当我点击Choose files时，我看到这个屏幕：

如果我选择GooglePhotos并选择多个文件，则只有第一个文件会插入表单中。 如果我选择Gallery（native）应用程序并选择多个文件，我会在表单上获得正确的编号，但当我单击upload时，会出现“Aw Snap”屏幕：

知道为什么会这样吗

除了谷歌照片和本机应用程序，我还尝试了5个不同的应用程序，最后一个，实际有效

请告诉我这不是一个应用程序的事情。。。有没有办法正确获取文件

所附代码：

<form method="post" enctype="multipart/form-data">
        <input type="file" name="my_file[]" multiple>
        <input type="submit" value="Upload">
    </form>
    <?php
        if (isset($_FILES['my_file'])) {
            $myFile = $_FILES['my_file'];
            $fileCount = count($myFile["name"]);

            for ($i = 0; $i < $fileCount; $i++) {
                ?>
                    <p>File #<?= $i+1 ?>:</p>
                    <p>
                        Name: <?= $myFile["name"][$i] ?><br>
                        Temporary file: <?= $myFile["tmp_name"][$i] ?><br>
                        Type: <?= $myFile["type"][$i] ?><br>
                        Size: <?= $myFile["size"][$i] ?><br>
                        Error: <?= $myFile["error"][$i] ?><br>
                    </p>
                <?php
            }
        }
    ?>

文件#：


名称：

临时文件：

类型：

大小：

错误：

如果您希望测试：

---

谢谢

试试看，这可能会对你有所帮助，这只是用js上传文件的前端部分

window.onload=function（）{
if（window.File&&window.FileList&&window.FileReader）{
var filesInput=document.getElementById（“uploadImage”）；
FileInput.addEventListener（“更改”，函数（事件）{
var files=event.target.files；
var输出=document.getElementById（“结果”）；
对于（var i=0；i

---

我不确定移动浏览器是否支持多个

属性我读了一些文章，它不支持或不是标准，如果你想发布多个图像；您可以在下面看到完整的代码

第一步

您应该在浏览器上使用作为本地加载

使用FileReader加载多个文件

document.getElementById("filesToUpload").onchange = function () {
    var fileIndex = 0;
    for ( var x= 0; x < input.files.length; x++) {
        //add to list
        var li = document.createElement('li');
        //Filename listing
        li.setAttribute('id','li_'+x);
        li.innerHTML = 'File ' + (x + 1) + ':  ' + input.files[x].name;
        list.append(li);
        //FileReader create and set onload event
        var reader = new FileReader();
        reader.onload = function (data) {
            data.target.result;
        }
        //Read file
        reader.readAsDataURL(input.files[x]);
    }
}

第三步

然后，您可以将整个数据发送到php文件，并将内容保存为图像

for($i = 0; $i<count($_POST["fileName"]);$i++){
    echo $_POST["fileName"][$i]."<br>";
    //decode base64 content and put file
    file_put_contents($_POST["fileName"][$i], base64_decode($_POST["file64"][$i]));
}

$i=0；$i的


工作截图
结果表明，浏览器内存不足，可能有多种情况会导致此问题，1.您尝试上载的文件太大，2.您是否使用javascript api操作文件？@Touqeersafi嘿，1.每个文件大约80KB，我每次尝试2-3个。2.在我制作的应用程序中，我使用DropzoneJS，因为我不知道是什么错，所以我创建了这个最简单的示例来消除外部类问题或JS问题，这是纯PHP/HTML，这个错误仍然在发生……我希望可能有一个JS解决方案可以弥补这个错误……类似于日期选择器的JS类，可以增加原始版本的功能
input[type=“date”]
android和Google Chrome的版本是什么？你是否检查了其他移动浏览器或本机浏览器？你选择了什么文件？（什么格式？尝试使用两个png/jpeg/txt/mp3/二进制文件）。作为Chrome版本中的声音错误（不正确检索并处理“Intent.ACTION\u SEND\u MULTIPLE”）.I read.下一版本Android it fixed！@odedta我同意：Android bug或只是一个报道不充分的限制。过去似乎多次上传文件一直是一个问题。关于它的价值，请特别关注“caniuse”链接。如果您还没有，请尝试卸载与问题相关的所有应用程序，重新启动设备，然后重新安装应用程序，以防出现异常状态并需要重新初始化。完全相同的错误，只是现在显示出来需要2-3秒。我将您的解决方案放在这里：-我仍然收到相同的错误，尽管有改进t、 现在，我可以选择3个文件，浏览器可以识别出3个文件，这些文件在大多数插件中从未出现过。Hi@odedta我认为您的服务器上有问题，因为它应该是这样的
https://jsfiddle.net/87c1put3/
你也可以看到我上传的文件。@odedta我已经在手机上添加了通过jsfi测试的屏幕截图dle样本和文件上传到你的服务器。-我猜有些设备支持，有些不支持。你使用哪个应用程序上传文件？你的图像大小是多少？如果它不大，则意味着它取决于设备，另外我的设备是note 5，chrome，我已经测试了另一个设备，它是LG G3和chrome，但绘制图片花费了大量时间下载并完成上传
for($i = 0; $i<count($_POST["fileName"]);$i++){
    echo $_POST["fileName"][$i]."<br>";
    //decode base64 content and put file
    file_put_contents($_POST["fileName"][$i], base64_decode($_POST["file64"][$i]));
}

<input name="filesToUpload[]" id="filesToUpload" type="file" multiple />
<form method="post" action="multipleFileUpload.php" enctype="multipart/form-data" id="formMultipleFileUpload">
<ul id="fileList">

</ul>
<input type="submit" value="Upload" id="btnUpload">
</form>
<script type="text/javascript">
var input = document.getElementById('filesToUpload');
var list = document.getElementById('fileList');
document.getElementById("filesToUpload").onchange = function () {
    var fileIndex = 0;
    for ( var x= 0; x < input.files.length; x++) {
        //add to list
        var li = document.createElement('li');
        li.setAttribute('id','li_'+x);
        li.innerHTML = 'File ' + (x + 1) + ':  ' + input.files[x].name;
        list.append(li);
        var reader = new FileReader();
        reader.onload = function (data) {
            var li = document.getElementById('li_'+fileIndex);
            var previewImg = document.createElement('img');
            previewImg.setAttribute('width','50');
            previewImg.setAttribute('height','50');
            li.append(previewImg);
            previewImg.src = data.target.result;
            var b64 = data.target.result.split(',')[1];
            var b64Input = document.createElement('textarea');
            b64Input.setAttribute('name','file64[]');
            b64Input.value = b64;
            li.append(b64Input);
            var fileName = document.createElement('input');
            fileName.setAttribute('name','fileName[]');
            fileName.value = input.files[fileIndex].name;
            li.append(fileName);
            fileIndex++;
        }
        reader.readAsDataURL(input.files[x]);
    }
}

<?php
for($i = 0; $i<count($_POST["fileName"]);$i++){
    echo $_POST["fileName"][$i]."<br>";
    file_put_contents($_POST["fileName"][$i], base64_decode($_POST["file64"][$i]));
}
?>