base64 显示图片和pdf

base64 显示图片和pdf,通过base64 编码在页面上显示图片和pdf,实现如下

 

1、图片

图片

base64 显示图片和pdf_第1张图片

java 代码,将图片转成 base64 字符串

package com.tmp;

import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;
import java.util.Base64;

public class Demo1 {

    public static void main(String[] args) throws IOException {
        File file = new File("C:\\Users\\Administrator\\Desktop\\img\\xiyang.jpg");

        FileInputStream inputStream = new FileInputStream(file);
        ByteArrayOutputStream baos = new ByteArrayOutputStream();

        byte[] bytes = new byte[1024];
        int len;
        while ((len = inputStream.read(bytes)) != -1) {
            baos.write(bytes, 0, len);
        }

        byte[] res = Base64.getEncoder().encode(baos.toByteArray());
        String str = new String(res);

        System.out.println(str);
    }
}

base64 字符串

base64 显示图片和pdf_第2张图片

html 代码

在 img标签中显示 base64编码图片时,src后的 base64字符串添加前缀 data:image/png;base64,



	
		
		
	
	
				
	

效果如下

base64 显示图片和pdf_第3张图片

2、pdf

base64 显示图片和pdf_第4张图片

 

pdf 内容

base64 显示图片和pdf_第5张图片

java代码

package com.tmp;

import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;
import java.util.Base64;

public class Demo1 {

    public static void main(String[] args) throws IOException {
        File file = new File("C:\\Users\\Administrator\\Desktop\\article\\纳兰词一首.pdf");

        FileInputStream inputStream = new FileInputStream(file);
        ByteArrayOutputStream baos = new ByteArrayOutputStream();

        byte[] bytes = new byte[1024];
        int len;
        while ((len = inputStream.read(bytes)) != -1) {
            baos.write(bytes, 0, len);
        }

        byte[] res = Base64.getEncoder().encode(baos.toByteArray());
        String str = new String(res);

        System.out.println(str);
    }
}

base64 字符串

base64 显示图片和pdf_第6张图片

html 代码

在 iframe中显示 base64编码pdf 时,src后的 base64字符串添加前缀 data:application/pdf;base64,

base64 显示图片和pdf_第7张图片

 

 

 

你可能感兴趣的:(html5)