JS 获取链接(link)图片的大小or体积

本文介绍了一个JavaScript函数,用于通过HTTP头部信息获取远程图片文件的大小,并给出了一段示例代码和实际应用效果。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

最近PD小姐姐又有了新的需求,是获取图片的大小,不能超过1M

可是我查遍了全网的都是讲获取宽高的,宽高我知道,直接onload就可以获取了,那么体积怎么获取呐?

后来,搜到一个英文问题,解决了体积的问题,但是感觉不是特别准确~记录下


获取体积或者叫大小:
  

  function getImageSizeInBytes(imgURL) {
    var request = new XMLHttpRequest();
    request.open("HEAD", imgURL, false);
    request.send(null);
    var headerText = request.getAllResponseHeaders();
    var re = /Content\-Length\s*:\s*(\d+)/i;
    re.exec(headerText);
    return parseInt(RegExp.$1);
  }
    
  var picLink = "https://img.alicdn.com/tfs/TB1ZUuMgb9YBuNjy0FgXXcxcXXa-298-170.png";
  var size = this.getImageSizeInBytes(picLink);
  var size_image = size / 1000;
  console.log("size_image", size_image);


使用效果:

可以获取体积大小,但是感觉并不准确~忧伤



 Demo

点击进入codepen

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值