如何不完全加载图片拿到图片的原始宽高

Question

目前有两种思路：

1. 借鉴exif.js的做法，以二进制的形式请求图片数据，然后从二进制里面读取图片的宽高信息。javascript能否只请求图片的部分数据（含有宽高的数据），而不用把整个图片的二进制都请求下来？
2. 牛人写的n年前的老代码。大概思路是请求这张图，起一个定时器不停问浏览器拿到原始宽高了没有，拿到数据时这张图不一定被浏览器完全加载。

第二种方式虽能实现效果，但是感觉思路上不如第一种，有没有大牛实践过第一种的。

Answer 1

思路不错，但想通过ajax请求部分数据似乎没法实现。我尝试了一些方法，浏览器会认为“Accept-Encoding”这个头数据是安全相关的，不允许ajax进行设置，而是自动加上诸如gzip之类的内容，而如果其含有gzip，且服务器支持gzip，很显然，数据就不可能直接进行部分下载了，nginx服务器会把要下载的东西整个打包发过来。至少ningx是这样的。大多数服务器不可能不开gzip压缩，所以，想仅仅从前端解决这个事情干扰太多，不太现实。
研究过程代码，仅供参考，不过觉得没有太大意义。

var url='./imgs/pic.png',type='GET';
$.ajax({
         //type: 'GET',
         headers: {
            // 'Access-Token':$.cookie('access_token'),
            'Accept-Ranges' : ' bytes',
            "Accept-Encoding":""
            // 'Range': ' bytes = 0-40' 
         },
         url: url,
         //data: data,
         beforeSend: function (XMLHttpRequest) {
            // XMLHttpRequest.headers
            console.log(XMLHttpRequest);
               // XMLHttpRequest.setRequestHeader("Accept-Encoding", "");
                XMLHttpRequest.setRequestHeader("Range", "bytes=30-40");
         },
         success: function(data) {
           console.log(data);
         },
         error: function(err) {
         },
         complete: function(XMLHttpRequest, status) { //请求完成后最终执行参数　
            console.log(XMLHttpRequest, status);
         }
});

Answer 2

在服务端处理

Answer 3

然而，你说的这两种方法，都已经加载了图片了。