网页生成二维码并实现打印的两种方式

来源：由于公司产品功能需要，要在客户回执上增加打印二维码，而用户使用的电脑甚至还有IE8的浏览器，根据工作的总结，记录下使用的两种二维码实现方式的方案，供以后参考。

• 
  
• 方案1：使用jquery-qrcode.js插件，在页面生成可打印的二维码(经过测试，该方案不能完全支持IE8)
  

qrcode的渲染方式render中的Canvas是html5的东西，所以会有兼容性问题，为了实现IE8的兼容，我使用了table方式渲染，的确可以在页面上显示出二维码，但是在打印的时候却不能打印出来，table也不能转换成png图片。所以，这个方案只适合支持canvas的浏览器打印二维码。

<script language="javascript">
    $(function(){
    //页面上每一个name='controlQrcode'的div都加上二维码  
    $("div[name='controlQrcode']").each(function(index,element){
            createControlQrcode(element);
        })
    });

    //生成办件二维码
    function createControlQrcode(obj){
        var qrcode = $(obj).qrcode({
            render: canvas, // 渲染方式有table方式（IE兼容）和canvas方式，默认是canvas
            text: '二维码里面的内容',
            width: 81,//宽度
            height: 81,//高度
            colorDark : '#000000',
            colorLight : '#ffffff',
            correctLevel:3//二维码纠错级别
        });
        var canvas = $(obj).children("canvas");
        //将canvas转换成png图片，才能被打印机识别打印
        var img = canvas[0].toDataURL("image/png")
        $(obj).html("<img src='" + img + "'>")
    }
</script>

更多详细资料参考：http://blog.csdn.net/gao36951/article/details/48736329

以上方法基本能满足目前大部分浏览器打印二维码的需求，但是如果一定要在IE8上实现二维码的打印，可以参考下面的方案二。

• 方案二：后台生成二维码图片传到页面显示并实现打印。

需要在maven引入两个jar包
<!-- 条形码、二维码生成 -->
<dependency>
    <groupId>com.google.zxing</groupId>
    <artifactId>core</artifactId>
    <version>2.2</version>
</dependency>
<dependency>
    <groupId>com.google.zxing</groupId>
    <artifactId>javase</artifactId>
    <version>2.2</version>
</dependency>

工具类QrCodeUtils.java：

package com.minstone.apprControl.system.util;

import java.awt.image.BufferedImage;
import java.io.ByteArrayOutputStream;
import java.io.IOException;
import java.util.Hashtable;

import javax.imageio.ImageIO;

import sun.misc.BASE64Encoder;

import com.google.zxing.BarcodeFormat;
import com.google.zxing.EncodeHintType;
import com.google.zxing.MultiFormatWriter;
import com.google.zxing.WriterException;
import com.google.zxing.common.BitMatrix;

/**
 * 二维码生成工具类
 * @author ChenDongWei
 * @date 2017年12月27日下午4:16:33
 */
public class QrCodeUtils {
    /**
     * creatRrCode:(这里用一句话描述这个方法的作用). <br/> 
     * @author ChenDongWei
     * @date 2017年12月27日下午5:05:19
     * @param contents 二维码的内容
     * @param width 二维码图片宽度
     * @param height 二维码图片高度
     * @return
     */
    public static String creatRrCode(String contents, int width, int height){
        String binary = null;
        Hashtable hints= new Hashtable();   
        hints.put(EncodeHintType.CHARACTER_SET, "utf-8");  
        try {
            BitMatrix bitMatrix = new MultiFormatWriter().encode(
                    contents,BarcodeFormat.QR_CODE, width, height, hints);
            // 1、读取文件转换为字节数组
            ByteArrayOutputStream out = new ByteArrayOutputStream();
            BufferedImage image = toBufferedImage(bitMatrix);
            //转换成png格式的IO流
            ImageIO.write(image, "png", out);
            byte[] bytes = out.toByteArray();

            // 2、将字节数组转为二进制
            BASE64Encoder encoder = new BASE64Encoder(); 
            binary = encoder.encodeBuffer(bytes).trim();
        } catch (WriterException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } catch (IOException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        } 
        return binary;
    }

    /**
     * image流数据处理
     * @author ChenDongWei
     * @date 2017年12月27日下午4:16:33
     */
    public static BufferedImage toBufferedImage(BitMatrix matrix) {
        int width = matrix.getWidth();
        int height = matrix.getHeight();
        BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
        for (int x = 0; x < width; x++) {
          for (int y = 0; y < height; y++) {
            image.setRGB(x, y, matrix.get(x, y) ? 0xFF000000 : 0xFFFFFFFF);
          }
        }
        return image;
      }
}

controller代码：

String binary = QrCodeUtils.creatRrCode("二维码内容", 150,150);
modelAndView.addObject("binary", binary);//将二维码传到页面

页面jsp代码：

<div name="controlQrcode" style="float: left;"><img src="data:image/png;base64,${binary }"></div>

至此，方案二实现完成。

以上两种二维码打印的实现方案，仅是个人在工作中遇到的案例，仅供参考。如有错误，请留言指正。