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

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

  • 相关阅读:
    第 9 章 类
    导入模块
    第 8 章 函数
    第七章 用户输入和while语句
    第六章 字典
    测试经理/组长职责
    测试的发展之路
    【转】测试流程
    一个网页通用的测试用例(借鉴他人的保存,加注释)
    QTP自动化测试框架简述
  • 原文地址:https://www.cnblogs.com/ranyonsue/p/10791955.html
Copyright © 2011-2022 走看看