zoukankan      html  css  js  c++  java
  • 前端获取图片存储大小的方法

    1利用input元素获取

    如果是input元素

    <input type="file" id='myinput'>

    var file=document.getElementById('myinput');

    var fileData = file.files[0];

    var size = fileData.size;   //注意,这里读到的是字节数

    2如果不是input元素,是一般的IMG元素

     先把图片转换成canvas,然后再转为base64码,通过获取base64.length来获取图片的大概尺寸。通过canvas转换后图片一般会变小一些,但是这个不能精准地获取图片大小,不推荐使用。

    function compressImg(image, quality) {

          var width = image.width;

          var height = image.height;

          var canvas = document.createElement("canvas");

          var ctx = canvas.getContext('2d');

          canvas.width = width;

          canvas.height = height;

          ctx.drawImage(image, 0, 0, canvas.width, canvas.height);

            var base64 = canvas.toDataURL('image/jpeg', quality);

          return base64;

    }

    3 还有一种是通过后台传过来接口里面的图片信息获得

    把图片传到服务器之后,从图片的文件流中读取去信息。然后返回给前端。

  • 相关阅读:
    第五次站立会议
    第四次站立会议
    第三次晚间站立总结会议
    易校小程序典型用户需求分析
    第三次站立会议
    第二次晚间站立总结会议
    第二次站立会议
    第一次晚间站立总结会议
    MyBatis注解
    延迟加载与缓存
  • 原文地址:https://www.cnblogs.com/ranyonsue/p/10791955.html
Copyright © 2011-2022 走看看