相关疑难解决方法(0)

我已阅读这个和这个问题,这似乎表明,文件的MIME类型可以使用在客户端的JavaScript进行检查.现在,我知道真正的验证仍然必须在服务器端完成.我想执行客户端检查以避免不必要的服务器资源浪费.

为了测试是否可以在客户端完成,我将JPEG测试文件的扩展名更改为.png并选择要上载的文件.在发送文件之前,我使用javascript控制台查询文件对象:

document.getElementsByTagName('input')[0].files[0];

这是我在Chrome 28.0上获得的:

File {webkitRelativePath:"",lastModifiedDate:Tue Oct 16 2012 10:00:00 GMT + 0000(UTC),name:"test.png",输入:"image/png",大小:500055 ......}

它显示的类型image/png似乎表明检查是基于文件扩展名而不是MIME类型完成的.我尝试了Firefox 22.0,它给了我相同的结果.但是根据W3C规范,应该实现MIME Sniffing.

我是否可以说目前无法使用javascript检查MIME类型？或者我错过了什么？

这是我的代码：

// process-image.js (web-worker)
self.addEventListener('message', ev => {
    const {id,file} = ev.data;

    const reader = new FileReader();
    reader.onload = ev => {
        const imageFile = new Image(); // <-- error is here
        imageFile.src = ev.target.result;

        imageFile.onload = () => {
            const fit = makeFit(imageFile);

            self.postMessage({
                id,
                file: {
                    src: ev.target.result,
                    width: fit.width,
                    height: fit.height,
                }
            })
        }
    };

    reader.readAsDataURL(file);
});

这在主 UI 线程中运行良好，但显然我无法访问Image网络工作者的内部。具体错误是：

Uncaught ReferenceError: Image is not defined at FileReader.reader.onload (process-image.js:12)

有没有另一种方法来获取图像的宽度和高度？

我想支持尽可能多的文件类型，但如果有某种库可以做到这一点并且可以在网络工作者中运行，那么现在只有 JPG 就足够了。

这是 UI …