使用formdata存储图片和通过base64解析二进制转换而成的字符串，然后以字符串返回给前端

前言

图片的存储和从数据库中取出并在前端显示，这个问题我搞了3天左右，终于有了一个解决方案。

1.首先我是通过formdata将图片传到后台，后台自动自动将其转为字符串，然后将字符串转为二进制，因为我的数据库中的图片类型是image，所以是二进制类型的。

2.从数据库取出二进制数据，并转为字符串。我遇到的问题就出现在这里，我直接将字符串给了前端，没有进行base64解码，所以前端不认识该数据格式，所以图片显示不出来。

详细说明

什么都不说了，直接上代码。

@RequestMapping("/saveAuth.action")
	public void UserAuth(HttpServletRequest req, HttpServletResponse response) throws ServletException, IOException {
		
		Logger.getLogger(AuthController.class).info("********************保存用户******************************");
		DiskFileItemFactory factory = new DiskFileItemFactory();
		ServletFileUpload upload = new ServletFileUpload(factory);
		String openid = req.getParameter("openid");
		Logger.getLogger(AuthController.class).info(openid);
		try {	
			List<?> items = upload.parseRequest(req);
			Map<String, Object> map = new HashMap<String, Object>();
			Logger.getLogger(AuthController.class).info(JSON.toJSONString(items));
			for(Object object:items){
				FileItem fileItem = (FileItem)object;
				
				map.put(fileItem.getFieldName(), fileItem.getString("utf-8"));
			}	
			
			Logger.getLogger(AuthController.class).info(JSON.toJSONString(map));
			TbRzsj tbRzsj = new TbRzsj();
			tbRzsj.setName((String)map.get("username"));
			tbRzsj.setOpenid((String)map.get("openId"));
			SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
			String rzrq = df.format(new Date());
			tbRzsj.setRzrq(df.parse(rzrq));
			tbRzsj.setTel((String)map.get("phone"));
			tbRzsj.setSfzhm((String)map.get("identity"));
			if(map.get("img-one") != null && map.get("img-one") != ""){
				tbRzsj.setSfzzm(((String)map.get("img-one")).getBytes());
			}
			if(map.get("img-two") != null && map.get("img-two") != ""){
				tbRzsj.setSfzfm(((String)map.get("img-two")).getBytes());
			}
			
			int result = authService.insert(tbRzsj);	
			Map<String, Object> resultMap = new HashMap<>();
			if (result>0){
				//数据保存成功
				resultMap.put("success", true);
				resultMap.put("msg","认证成功");
			} else {
				//数据保存失败
				resultMap.put("success", false);
				resultMap.put("msg","认证失败");
			}
			response.setContentType("text/html;charset=utf-8");
			PrintWriter out = response.getWriter();
			out.print(new JSONObject(resultMap));
		} catch (Exception e) {
			e.printStackTrace();
		}
	}

这个是将图片存入到数据库中的。

2.读取二进制文件，并将图片显示在前端

这里我就不从数据库中获取数据了，最主要的是后面的两个方法。

package test;

import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.IOException;
import java.io.UnsupportedEncodingException;

import org.junit.Test;

import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;

import sun.misc.BASE64Decoder;

public class ByteToImage {

	@Test
	public void test(){
		String path = "G:\\data.txt";
		
		String content = readToString(path);
		
		JSONObject jsonObject = (JSONObject)JSON.parse(content);
		
		JSONArray jsonArray = jsonObject.getJSONArray("jsxx");
		
		jsonObject = (JSONObject)jsonArray.get(0);
		
		try {
			System.out.println(jsonObject.get("pic1").toString());
			
			String result = parseBase64(jsonObject.get("pic1").toString());
			
			System.out.println(result);
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		
		
	}
	
	/**
     * 读取文件数据
     * @param fileName
     * @return
     */
    private String readToString(String fileName) {
        String encoding = "GBK";
        File file = new File(fileName);
        Long filelength = file.length();
        byte[] filecontent = new byte[filelength.intValue()];
        try {
            FileInputStream in = new FileInputStream(file);
            in.read(filecontent);
            in.close();
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        } catch (IOException e) {
            e.printStackTrace();
        }
        try {
            return new String(filecontent, encoding);
        } catch (UnsupportedEncodingException e) {
            System.err.println("The OS does not support " + encoding);
            e.printStackTrace();
            return null;
        }
    }

    /**
     * 解析BASE64
     * @param picStr
     * @return
     * @throws IOException
     */
    private String parseBase64(String picStr) throws IOException {
        BASE64Decoder base64Decoder = new BASE64Decoder();
        return new String(base64Decoder.decodeBuffer(picStr));
    }
}

将上面的模拟数据放到G:/data.txt中，写个测试文件，将pic1的字符串界面，然后将解码后的字符串的放在前端的<img src="">中就可以显示图片了。

我获得的字符串是这样格式的：

data:image/jpeg;base64,/9j/4AAQSkZJRgABAgEASABIAAD/7gAOQWRvYmUAZAAAAAAB/9sAhAAGBAQEBQQGBQUGCQYFBgkLCAYGCAsMCgoLCgoMEAwMDAwMDBAMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMAQcHBw0MDRgQEBgUDg4OFBQODg4OFBEMDAwMDBERDAwMDAwMEQwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz/wAARCAK7A+gDAREA

然后放入前端就可以了。

结束语

写的不好，欢迎大家指点