库中的图像不显示，而相机中的图像显示

Image from library does not show - image from camera does

本文关键字：显示 图像 相机      更新时间：2023-09-26

使用互联网上流行的代码：

代码

<input type="file" id="files" name="files[]" multiple="multiple" />
<output id="list"></output>
<script>
    function handleFileSelect(evt) {
        var files = evt.target.files; // FileList object
        // Loop through the FileList and render image files as thumbnails.
        for (var i = 0, f; f = files[i]; i++) {
            // Only process image files.
            if (!f.type.match('image.*')) {
                continue;
            }
            var reader = new window.FileReader();
            // Closure to capture the file information.
            reader.onload = (function (theFile) {
                return function (e) {
                    // Render thumbnail.
                    var span = document.createElement('span');
                    span.innerHTML = ['<img class="thumb" src="', e.target.result,
                                        '" title="', escape(theFile.name), '"/>'].join('');
                    document.getElementById('list').insertBefore(span, null);
                };
            })(f);
            // Read in the image file as a data URL.
            reader.readAsDataURL(f);
        }
    }
    document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>

在我的安卓平板电脑上，图像只在用相机拍照时显示，而不是从文件系统中选择图像。

在我的笔记本电脑上（我只能从文件系统中选择文件）显示了图像。

这里有什么安全问题吗？

使用警报来检查脚本在android设备上运行的距离，我可以看到脚本运行良好，没有任何错误。

Android设备正在运行Android版本4.2.1

请尝试这个代码，我已经跟踪了这个问题。

    <!DOCTYPE html>
    <html>
        <head>
        </head>
        <body>
            <input type="file" id="files" name="files[]" multiple="multiple" />
            <output id="list">
            </output>
        </body>
        <script>
            function handleFileSelect(evt) {
                var files = evt.target.files; // FileList object
                // Loop through the FileList and render image files as thumbnails.
                for (var i = 0, f; f = files[i]; i++) {
                    console.log("for call");
                    var reader = new window.FileReader();
                    // Closure to capture the file information.
                    reader.onload = (function(theFile) {
                        return function(e) {
                            // Render thumbnail.
                            var span = document.createElement('span');
                            console.log(e.target.result);
                            var spl = e.target.result.split(",");
                            console.log("data:image/png;base64," + spl[1]);
                            var el = "data:image/png;base64," + spl[1];
                            span.innerHTML = ['<img class="thumb" src="', el, '" title="', escape(theFile.name), '"/>'].join('');
                            document.getElementById('list').insertBefore(span, null);
                        };
                    })(f);
                    // Read in the image file as a data URL.
                    reader.readAsDataURL(f);
                }
            }
            document.getElementById('files').addEventListener('change', handleFileSelect, false);
        </script>
    </html>
相关文章：