精华内容
下载资源
问答
  • 如何获取base64图片大小 通过base64编码原理我们知道,base64的图片字符流中的每8个字符就有两个是用0补充,而且字符流的末尾还可能存在‘=’号,我们可以通过这个原理计算图片的文件流大小。 getImgByteSize(data...
  • 压缩base64图片大小

    千次阅读 2019-08-23 16:52:39
    项目中上传头像base64图片太大导致上传时间过长,或者后台奔溃问题,所以前端压缩base64...w: 图片的原始图片大小 quality: 0.7 // 值越小,所绘制出的图像越模糊 示例:let base64Img = compressImgBase64 = this...

    项目中上传头像base64图片太大导致上传时间过长,或者后台奔溃问题,所以前端压缩base64大小解决这个问题
    原理使用canvas进行图片压缩
    参数说明:
    base64String:需要压缩的base64图片
    w: 图片的原始图片大小
    quality: 0.7 // 值越小,所绘制出的图像越模糊

    示例:let base64Img = this.compressImg(file.content, 100, 0.7);
    base64Img就是压缩完成后的base64图片

    
    compressImg(base64String, w, quality) {
    			var getMimeType = function(urlData) {
    				var arr = urlData.split(",");
    				var mime = arr[0].match(/:(.*?);/)[1];
    				return mime;
    			};
    			var newImage = new Image();
    			var imgWidth, imgHeight;
    
    			var promise = new Promise(resolve => (newImage.onload = resolve));
    			newImage.src = base64String;
    			return promise.then(() => {
    				imgWidth = newImage.width;
    				imgHeight = newImage.height;
    				var canvas = document.createElement("canvas");
    				var ctx = canvas.getContext("2d");
    				if (Math.max(imgWidth, imgHeight) > w) {
    					if (imgWidth > imgHeight) {
    						canvas.width = w;
    						canvas.height = (w * imgHeight) / imgWidth;
    					} else {
    						canvas.height = w;
    						canvas.width = (w * imgWidth) / imgHeight;
    					}
    				} else {
    					canvas.width = imgWidth;
    					canvas.height = imgHeight;
    				}
    				ctx.clearRect(0, 0, canvas.width, canvas.height);
    				ctx.drawImage(newImage, 0, 0, canvas.width, canvas.height);
    				var base64 = canvas.toDataURL(
    					getMimeType(base64String),
    					quality
    				);
    				console.log(base64);
    				return base64;
    			});
    		}
    
    展开全文
  • js计算base64图片大小

    千次阅读 2020-10-25 19:39:53
    function imageSize(base... const indexBase64 = base64Str.indexOf('base64,'); if (indexBase64 < 0) return -1; const str = base64Str.substr(indexBase64 + 6); return (str.length * 0.75).toFixed(2); }

    Base64简介

    base64中每6位为一个单元,对应一个打印字符。2的6次方为64,所以base64共64个打印字符,A-Z、a-z、0-9共62个字符,其余两个字符不同的系统中一般有所不同。但是,我们经常所说的Base64另外2个字符是“+/”。64个字符为“A-Za-z0-9+/”。3个字符为一组,不足3个字符的使用=号填充。

    一个字节为8位,但base64中6位组成一个字符,所以base64的大小为真实大小的4/3。

    算法实现

    1. 首先判断是否为base64字符串
    2. 去掉非base64部分
    3. 结果返回两位小数
    function imageSize(base64Str) {
      const indexBase64 = base64Str.indexOf('base64,');
      if (indexBase64 < 0) return -1;
      const str = base64Str.substr(indexBase64 + 6);
      return (str.length * 0.75).toFixed(2);
    }
    
    
    展开全文
  • //获取base64图片大小,返回kb数字 showSize(base64url) { //把头部去掉 let str = base64url.replace('data:image/png;base64,', ''); // 找到等号,把等号也去掉 let equalIndex = str.indexOf('='); if ...
    //获取base64图片大小,返回kb数字
          showSize(base64url) {
            //把头部去掉
            let str = base64url.replace('data:image/png;base64,', '');
            // 找到等号,把等号也去掉
            let equalIndex = str.indexOf('=');
            if (str.indexOf('=') > 0) {
              str = str.substring(0, equalIndex);
            }
            // 原来的字符流大小,单位为字节
            let strLength = str.length;
            // 计算后得到的文件流大小,单位为字节
            let fileLength = parseInt(strLength - (strLength / 8) * 2);
            // 由字节转换为kb
            let size = "";
            size = (fileLength / 1024).toFixed(2);
            let sizeStr = size + ""; //转成字符串
            let index = sizeStr.indexOf("."); //获取小数点处的索引
            let dou = sizeStr.substr(index + 1, 2) //获取小数点后两位的值
            if (dou == "00") { //判断后两位是否为00,如果是则删除00                
              return sizeStr.substring(0, index) + sizeStr.substr(index + 3, 2)
            }
            return size;
          },

     

    展开全文
  • base64图片编码大小与原图文件大小之间的联系

    万次阅读 多人点赞 2017-02-08 11:01:36
    base64图片编码大小与原图文件大小之间的联系 有时候我们需要把canvas画布的图画转换成图片输出页面,而用canvas生成的图片就是base64编码的,它是由数字、字母等一大串的字符组成的,但是我们需要获取它的文件流...

    base64图片编码大小与原图文件大小之间的联系



    有时候我们需要把canvas画布的图画转换成图片输出页面,而用canvas生成的图片就是base64编码的,它是由数字、字母等一大串的字符组成的,但是我们需要获取它的文件流大小该怎么办呢?


    Base64图片编码原理:

    Base64编码要求把3个8位字节(3*8=24)转化为4个6位的字节(4*6=24),之后在6位的前面补两个0,形成8位一个字节的形式。 如果剩下的字符不足3个字节,则用0填充,输出字符使用’=’,因此编码后输出的文本末尾可能会出现1或2个’=’

    详情请阅读- base64原理


    当我们知道base64编码的图片的字符大小,怎么计算图片的文件流大小呢??

    通过base64编码原理我们知道,base64的图片字符流中的每8个字符就有两个是用0补充,而且字符流的末尾还可能存在‘=’号,我们可以通过这个原理计算图片的文件流大小。


    下面举例:

    这是一张图片的base64编码:

    data:image/png;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAQAQAAAAAAAAAAAAAAAAAAAAAAAB9SR//fUkf/31JH/99SR//fUkf/31JH/99SR//fUkf/31JH/99SR//fUkf/6mHbP+LXDf/fUkf/31JH/99SR//fUkf/31JH/99SR//fUkf/31JH/99SR//i104/5lwT/+RZkP/fksh/6eFaP/8/Pv/mG9N/31JH/99SR//fUkf/31JH/99SR//fUkf/31JH/+tjHL/6uHb//7+/v////////////Xx7v/8+/r//////6N/Yv99SR//fUkf/31JH/99SR//fUkf/35LIf/PvK3///////////////////////////////////////////+vj3b/fUkf/31JH/99SR//fUkf/31JH/++pI/////////////08Oz/vqSQ/8y3p///////////////////////u6CK/31JH/99SR//fUkf/31JH/+IWDL/+vn3///////s5d//iVo1/6B7XP/6+ff/8Orl/9TDtv+5nYb/nXZX/4NRKf9+SyL/fUkf/31JH/99SR//sJF3////////////onxe/35LIv+ge1z/ils1/31JH/99SR//fUkf/6qIbf/dz8T/1MK0/31JH/99SR//fUkf/8WunP///////Pv7/39MIv99SR//fUkf/31JH/99SR//fUkf/31JH//ay7///////+ri2/99SR//fUkf/31JH//Frpv///////38+/9/TCP/fUkf/31JH/99SR//fUkf/31JH/99SR//2szA///////q4dv/fUkf/31JH/99SR//r491////////////pIBi/31JH/99SR//fUkf/31JH/99SR//hVUt//j29P//////1MK1/31JH/99SR//fUkf/4dXMP/59/b//////+7o4/+MXjn/fUkf/31JH/99SR//gE0k/9XFuP///////////6aDZ/99SR//fUkf/31JH/99SR//up+I////////////9vPw/8OrmP+si3D/uZ2G/+ri2////////////97Rx/99SiD/fUkf/31JH/99SR//fUkf/31KIP/KtqX//v7+/////////////////////////////////+Xb0/+HWDH/fUkf/31JH/99SR//fUkf/31JH/99SR//fUkf/6eFaP/l2tL//v7+////////////8evn/7yhi/+BTyb/fUkf/31JH/99SR//fUkf/31JH/99SR//fUkf/31JH/99SR//fUkf/4dXMP+Uakf/jV86/31JH/99SR//fUkf/31JH/99SR//fUkf/31JH/9/SyH/f0sh/39LIf9/SyH/f0sh/39LIf9/SyH/f0sh/39LIf9/SyH/f0sh/39LIf9/SyH/f0sh/39LIf9/SyH/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==



    为了方便,我们用str代替上面编码。

    1.需要计算文件流大小,首先把头部的data:image/png;base64,(注意有逗号)去掉。

    str=str.substring(22);
    

    2.找到等号,把等号也去掉

    var equalIndex= str.indexOf(‘=’);
    if(str.indexOf(‘=’)>0)
    {
        str=str.substring(0, equalIndex);
    
    }
    

    3.原来的字符流大小,单位为字节

    var strLength=str.length;
    

    4.计算后得到的文件流大小,单位为字节

    var fileLength=parseInt(strLength-(strLength/8)*2);
    

    5.输出文件流大小

    alert(fileLength);
    





    以上是文章的主要内容,有问题请多多交流

    推荐一个文件流图片转base64编码流图片的在线工具- base64转换

    展开全文
  • java base64图片计算图片大小

    万次阅读 2019-10-11 15:41:00
    参考: https://blog.csdn.net/qq_31971675/article/details/78937529 https://www.iteye.com/blog/ipc-1688385 demo如下: package ... import java.math.BigDecimal; public class Test { public st...
  • Base64图片编码原理,base64图片工具介绍,图片在线转换Base64 DataURI 允许在HTML文档中嵌入小文件,可以使用 img 标签或 CSS 嵌入转换后的 Base64 编码,减少 HTTP 请求,加快小图像的加载时间。 经过...
  • base64图片转化成编码后再还原,结果图片变小了,转换前后图片格式相同,并且这两张图用base64编码后得到的编码相同
  • 首先讲一下什么是Base64编码:
  • import sun.misc.BASE64Decoder; import sun.misc.BASE64Encoder; import javax.imageio.ImageIO; import java.awt.image.BufferedImage; import java.io.*; public class PicUtil { private static String ...
  • 改变base64加密图片大小

    千次阅读 2019-10-30 15:16:27
    1、添加依赖 <!-- 图片缩略图 --> <dependency> <groupId>net.coobird</groupId> <artifactId>thumbnailator</artifactId> <version>...
  • Base64介绍: Base64是网络上最常见的用于传输8Bit字节码的编码方式之一,Base64就是一种基于64个可打印字符来表示二进制数据的...至此我们可以使用Base64编码来处理背景图片的显示问题, Base64在线转换网址:http...
  • js计算base64文件流大小

    千次阅读 2019-01-31 14:03:00
    //获取base64图片大小,返回KB数字 var str = base64url.replace('data:image/jpeg;base64,', '');//这里根据自己上传图片的格式进行相应修改 var strLength = str.length; var fileLength = parseI...
  • 1.身份证照片/人脸图片base64流之间转换 2.上传图片过程中图片太大超出80K   //图片base64流之间转换  package com.zxc.testjava.ant; import java.io.FileInputStream; import java.io....
  • base64文件大小计算

    2019-09-18 15:51:58
    有时候图片被base64之后需要计算图片大小,因为被编码后全是字符,计算文件大小可以反序列化成文件之后再获取大小,但是会比较麻烦。简单介绍一种利用base64编码原理计算大小的方法。 编码原理 要求把3个8位字节(3*...
  • php判断base64字节大小

    千次阅读 2018-12-12 10:16:43
    /* 判断base64图片数据大小不超过50M */ $base64 = str_replace('data:image/jpeg;base64,', '', $data); $base64 = str_replace('=', '', $base64); $img_len = strlen($base64); $file_size = $img_len - ($img_...
  • vue-cli 图片打包成base64大小限制配置文件件 vue.config.js
  • 图片base64(注意:转换后的字符串需要加上"data:image/png;base64," 才能被识别)// 将图片文件转化为字节数组字符串,并对其进行Base64编码处理public static String GetImageStr(String imagePath) { ...
  • java:Base64图片字符串如何约束其大小

    万次阅读 2020-08-10 22:08:19
    //图片最大为300KB private static final max_image_kb=300 //转化为字符串时的最长长度 private static final max_image_size=max_image_kb*1024*4/3
  • base64图片的String字符串压缩变小

    万次阅读 2020-07-09 14:18:00
    base64图片的String字符串压缩变小(自测不失真)依赖环境编写工具类编写测试类验证验证效果其他知识补充Thumbnails用法介绍 依赖环境 需求:最近前端反馈对于上传的图片资源过大因此需要进行压缩,考虑Java后台实现...
  • 图片base64并压缩大小

    万次阅读 2018-01-08 12:00:18
    &lt;input id="file" type="file" capture="microphone" accept="image/*"... cutImageBase64(m_this,null,400,0.8);  }) function cutImageBase6
  • <input type="file" class="fileBtn disB" id="uploadImg" accept="image/*" style="margin-left:72px;position:relative;top:8px;" />... //图片文件转base64 var imgBaseArr,fileSize; ...
  • javaScript旋转Base64图片并得到新的base64数据 不合理的地方欢迎小伙伴雅正 js旋转base64图片90*N度,并产生新的base64数据 项目开发中,甲方希望上传图片的时候可以调整图片的方向,这也是一个合理要求,不合理又...
  • 最小 base64 图片

    2019-10-04 03:16:30
    Base64 Encode 1x1px透明GIF图片 Base64 Encode 1x1px透明GIF图片能干什么?这种图片的特征就是体积最小化,最大限度的减少带宽。而且是透明的,具有隐身作用。用到的场景很多,比如测试浏览器是否支持...
  • base64图片可用,不是处处都适用

    千次阅读 2020-07-27 16:25:19
    图片大小平均700KB,经过base64编码,长度又增长了1/3,差不多1MB了。 带来的缺陷: 1.邮件保存接口,保存了邮件正文内容,使用较大的图片base64编码,直接导致数据库表大小会迅速膨胀,一条记录1M,1000条记录就1G...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 82,644
精华内容 33,057
关键字:

base64图片大小