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 还有一种是通过后台传过来接口里面的图片信息获得

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

  • 相关阅读:
    程序员修炼之道阅读笔记02
    第十五周课堂练习-查找最长单词链
    文件读写总结
    第十五周
    暑假总结1
    软件工程课程总结
    第十六周总结
    用户场景分析
    学期课后个人总结
    第十五周总结
  • 原文地址:https://www.cnblogs.com/ranyonsue/p/10791955.html
Copyright © 2011-2022 走看看