小编Sas*_*dau的帖子

当 FileReader api 从 input 元素读取文件时，它可以工作，但我的 android 设备也允许发送文件，并且它似乎无论如何都发送 heic 文件，这会导致控制台中没有任何错误的空图像。直接从相机获取图像时，方向也是错误的。我刚刚找到了要实现的重型库，我正在寻找更智能的解决方案。

JavaScript

function previewFile( e ) {
    var preview = document.getElementById('usersProfilePicture');
    var file    = e.files[0];
    var reader  = new FileReader();

    reader.onloadend = function () {
        preview.src = reader.result;
    }
    if (file) {
        reader.readAsDataURL(file);
    } else {
        preview.src = "";
    }
}

HTML5

<form>
    <label>
        <input id="uploadProfilePicture" name=file type=file accept="image/jpg, image/jpeg, image/png, image/gif, image/bmp">
    </label>
</form>

根本没有错误消息。无论我设置什么接受属性，桌面和 Android 上的 Firefox、Chrome 都允许 .heic 文件。

最坏的解决方案：拒绝接受 .heic 文件 最佳解决方案：让 fileReader 使用 .heic 文件。中间解决方案：检测heic并将其转换为jpeg，客户端。