ajax接收后台传来的图片

图片与base64的转换

图片对象转换base64

   ByteArrayOutputStream baos = new ByteArrayOutputStream();//io流
    ImageIO.write(png, "png", baos);//写入流中
    byte[] bytes = baos.toByteArray();//转换成字节
    BASE64Encoder encoder = new BASE64Encoder();
    String png_base64 =  encoder.encodeBuffer(bytes);//转换成base64串
    png_base64 = png_base64.replaceAll("\n", "").replaceAll("\r", "");//删除 \r\n
    return png_base64;

ajax接收后台图片
后台

/**
	 * #获取验证码的图片
	 * #使用点击事件获取验证码图片
	 */
	@SuppressWarnings("unused")
	private void checkcodeImgClick(HttpServletRequest req, HttpServletResponse resp) 
			throws ServletException, IOException {
		//点击图片按键请求
		DrowPictureUtils pic = DrowPictureUtils.getDrawPicUtils();
		pic.set(65, 37);
		String checkCode = pic.generateCheckCode();//获取随机验证码
		BufferedImage image = pic.generateCheckImage(checkCode);
		req.getSession().setAttribute("checkcode", checkCode);//session需要记录该验证码
		
		//点击其他按键请求
		ByteArrayOutputStream baos = new ByteArrayOutputStream();//io流
        ImageIO.write(image, "png", baos);//写入流中
        byte[] bytes = baos.toByteArray();//转换成字节
        BASE64Encoder encoder = new BASE64Encoder();
        String png_base64 =  encoder.encodeBuffer(bytes);//转换成base64串
        png_base64 = png_base64.replaceAll("\n", "").replaceAll("\r", "");//删除 \r\n
		resp.getWriter().write(png_base64);
	}

前台

	/**
	 * 申请更新验证码
	 * 该请求不需要有任何参数
	 */
	$("#checkcodeImg").click(function() {
		$.ajax({
			type: "post",
			url: "./checkcodeImgClick.reg",
			dataType: "text",
			success: function(img, status){
				alert(img);
				$("#checkImg").attr("src","data:image/png;base64,"+img);
			},
			error:function(data){
	             alert('响应失败!');
	         },
		});
	});
  • 2
    点赞
  • 22
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值