图片转为base64格式

目录：图片为什么要转base64格式base64概念java实现图片与base64互转（编码与解码）后端图片转base64格式返回给前端，前端如何展示一.图片为什么要转base64格式图片的 base64 编码就是可以将一副图片数据编码成一串字符串，使用该字符串代替图像地址1. 提升性能: 网页上的每一个图片，都是需要消耗一个 http 请求下载而来的, 图片的下载始终都要向服务器发出请求，要是图

yigg

64977人浏览 · 2021-12-26 22:22:32

yigg · 2021-12-26 22:22:32 发布

目录：

图片为什么要转base64格式
base64概念
java实现图片与base64互转（编码与解码）
后端图片转base64格式返回给前端，前端如何展示

一.图片为什么要转base64格式

图片的 base64 编码就是可以将一副图片数据编码成一串字符串，使用该字符串代替图像地址

1. 提升性能: 网页上的每一个图片，都是需要消耗一个 http 请求下载而来的, 图片的下载始终都要向服务器发出请求，要是图片的下载不用向服务器发出请求，base64可以随着 HTML 的下载同时下载到本地.减少https请求。

2. 加密: 让用户一眼看不出图片内容 , 只能看到编码。

3. 方便引用: 在多个文件同时使用某些图片时, 可以把图片转为base64格式的文件, 把样式放在全局中, 比如common.css, 以后在用的时候就可以直接加类名, 二不需要多层找文件路径, 会提升效率

二.base64概念

Base64是网络上最常见的用于传输8Bit字节码的编码方式之一，Base64就是一种基于64个可打印字符来表示二进制数据的方法。维基百科：base64_百度百科

原理：

将字符转二进制字节
3个字节为一组转为4个字节
根据转换表将4个字节转换为相对应的字符
输出结果

		byte[] b1 = "天明".getBytes("UTF-8");
		for(int i=0; i<b1.length; i++) {
			System.out.print(b1[i]+","); // -27,-92,-87,-26,-104,-114
		}
		byte[] b2 = new byte[]{-27,-92,-87};
		String name = new String(b2, "UTF-8");
		System.out.println(name); // 天
		
		// 如： "https://game.gtimg.cn/images/lol/act/img/passive/Annie_Passive.png";
		// 第一步：将字符转为byte
		String imgUrl = "http";
		byte[] b3 = imgUrl.getBytes();
		for(int i=0; i<b3.length; i++) {
			System.out.print(b3[i]+","); // 104,116,116,112
		}
		// 第二步：将十进制字节码转为二进制
		// 104 01101000
		// 116 01110100
		// 116 01110100
		// 112 01110000
		
		// 第三步：3个字节为一组，变为4个字节（上面的112没有分在这一组中）
        // 104 116 116分一组
        // 合并：011010000111010001110100
        // 六个一组分4组 011010 000111 010001 110100
        // 高位补0，结果如下
		// 00011010 00000111 00010001 00110100
		// 转为10进制分别为：26 7 17 52
		
		// 第四步：根据转换表(base64转换表，维基百科有)得出结果为：aHA0

问题：负数（二进制）在计算机中如何表示？（转）负数在计算机中如何表示？（转） - 走看看

一般用补码方式表示，举例说明：
-52，假设存储的数据是8位二进制数，即8位二进制补码
先将52转换成二进制数：00110100B
取反：11001011B
加1：11001100B
则-52D的8位二进制补码为11001100B

三.java实现图片转base64

import java.io.ByteArrayOutputStream;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.io.UnsupportedEncodingException;
import java.net.HttpURLConnection;
import java.net.URL;
import java.util.Base64;
import java.util.Base64.Decoder;
import java.util.Base64.Encoder;
 
 
public class ImgToBase64 {
	public static void main(String[] args) throws UnsupportedEncodingException {
		System.out.println(getImgFileToBase642("f://user/12.jpg"));
		System.out.println(getImgUrlToBase64("https://game.gtimg.cn/images/lol/act/img/rune/Electrocute.png"));
		System.out.println(getImgBase64ToImgFile(getImgUrlToBase64("https://game.gtimg.cn/images/lol/act/img/rune/Electrocute.png"),"f://user/base2.jpg"));
	}
	
	/**
	 * 本地图片转base64
	 */
	public static String getImgFileToBase642(String imgFile) {
        //将图片文件转化为字节数组字符串，并对其进行Base64编码处理
        byte[] buffer = null;
        //读取图片字节数组
        try(InputStream inputStream = new FileInputStream(imgFile);){
            int count = 0;
            while (count == 0) {
                count = inputStream.available();
            }
            buffer = new byte[count];
            inputStream.read(buffer);
        } catch (IOException e) {
            e.printStackTrace();
        }
        // 对字节数组Base64编码
        Encoder encode = Base64.getEncoder();
        return encode.encodeToString(buffer);
    }
	
	/**
	 * 网络图片转base64
	 */
	public static String getImgUrlToBase64(String imgUrl) {
        byte[] buffer = null;
        InputStream inputStream = null;
        try ( 
        	ByteArrayOutputStream outputStream = new ByteArrayOutputStream();){
            // 创建URL
            URL url = new URL(imgUrl);
            // 创建链接
            HttpURLConnection conn = (HttpURLConnection) url.openConnection();
            conn.setRequestMethod("GET");
            conn.setConnectTimeout(5000);
            inputStream = conn.getInputStream();
        	// 将内容读取内存中
            buffer = new byte[1024];
            int len = -1;
            while ((len = inputStream.read(buffer)) != -1) {
                outputStream.write(buffer, 0, len);
            }
            buffer = outputStream.toByteArray();
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
        	if (inputStream != null) {
                try {
                    // 关闭inputStream流
                    inputStream.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
        // 对字节数组Base64编码
        Encoder encode = Base64.getEncoder();
        return encode.encodeToString(buffer);
    }
	
	/**
	 * 本地或网络图片转base64
	 */
	public static String getImgStrToBase64(String imgStr) {
        InputStream inputStream = null;
        byte[] buffer = null;
        try (ByteArrayOutputStream outputStream = new ByteArrayOutputStream();){
            //判断网络链接图片文件/本地目录图片文件
            if (imgStr.startsWith("http://") || imgStr.startsWith("https://")) {
                // 创建URL
                URL url = new URL(imgStr);
                // 创建链接
                HttpURLConnection conn = (HttpURLConnection) url.openConnection();
                conn.setRequestMethod("GET");
                conn.setConnectTimeout(5000);
                inputStream = conn.getInputStream();
                // 将内容读取内存中
                buffer = new byte[1024];
                int len = -1;
                while ((len = inputStream.read(buffer)) != -1) {
                    outputStream.write(buffer, 0, len);
                }
                buffer = outputStream.toByteArray();
            } else {
                inputStream = new FileInputStream(imgStr);
                int count = 0;
                while (count == 0) {
                    count = inputStream.available();
                }
                buffer = new byte[count];
                inputStream.read(buffer);
            }
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            if (inputStream != null) {
                try {
                    // 关闭inputStream流
                    inputStream.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
        
        // 对字节数组Base64编码
        Encoder encode = Base64.getEncoder();
        return encode.encodeToString(buffer);
    }
	
	/**
	 * base64转图片存储在本地
	 * @param imgBase64 图片base64
	 * @param imgPath 图片本地存储地址
	 */
	public static boolean getImgBase64ToImgFile(String imgBase64, String imgPath) {
        boolean flag = true;
        Decoder decode = Base64.getDecoder();
        try (OutputStream outputStream = new FileOutputStream(imgPath);){
            // 解密处理数据
            byte[] bytes = decode.decode(imgBase64);
            for (int i = 0; i < bytes.length; ++i) {
                if (bytes[i] < 0) {
                    bytes[i] += 256;
                }
            }
            outputStream.write(bytes);
        } catch (Exception e) {
            e.printStackTrace();
            flag = false;
        }
        return flag;
    }
}

四.后端图片转base64格式返回给前端，前端如何展示

图片以base64形式在页面上展示出来

在这里要说到Data URI scheme，它可以直接将一些小的数据直接嵌入到网页中，不需要再引入。支持格式如下

data:, 文本数据
data:text/plain, 文本数据
data:text/html, HTML代码
data:text/html;base64, base64编码的HTML代码
data:text/css, CSS代码
data:text/css;base64, base64编码的CSS代码
data:text/javascript, Javascript代码
data:text/javascript;base64, base64编码的Javascript代码
data:image/gif;base64, base64编码的gif图片数据
data:image/png;base64, base64编码的png图片数据
data:image/jpeg;base64, base64编码的jpeg图片数据
data:image/x-icon;base64, base64编码的icon图片数据

所以此时只要是将base64格式的图片赋值给图片的src 属性即可。

<img src= "data:image/png;base64,图片的base64" />

如果想展示为jpg格式，前面变为data:image/jpeg;base64, 即可。

华为开发者空间

华为开发者空间，是为全球开发者打造的专属开发空间，汇聚了华为优质开发资源及工具，致力于让每一位开发者拥有一台云主机，基于华为根生态开发、创新。

更多推荐

开源for Huawei，Beam适配GaussDB实践案例分享

华为开发者空间

华为云数据库亮相创原会：拥抱AI，共创未来

华为开发者空间

GaussDB典型SQL调优点之自诊断和语句下推调优

华为开发者空间

所有评论(0)

查看更多评论

yigg

@yiguang_820

已为社区贡献9条内容