二维码生成

开源工具

zxing

<!-- https://mvnrepository.com/artifact/com.google.zxing/core -->
<dependency>
    <groupId>com.google.zxing</groupId>
    <artifactId>core</artifactId>
    <version>3.3.3</version>
</dependency>

示例代码：

import com.google.zxing.BarcodeFormat;
import com.google.zxing.EncodeHintType;
import com.google.zxing.MultiFormatWriter;
import com.google.zxing.WriterException;
import com.google.zxing.client.j2se.MatrixToImageWriter;
import com.google.zxing.common.BitMatrix;
import com.google.zxing.qrcode.decoder.ErrorCorrectionLevel;

import java.io.File;
import java.io.IOException;
import java.io.OutputStream;
import java.util.HashMap;
import java.util.Map;

/**
* 二维码工具类
*/
public class QRCodeUtil {
  private static final int width = 300;// 默认二维码宽度
  private static final int height = 300;// 默认二维码高度
  private static final String format = "png";// 默认二维码文件格式
  private static final Map<EncodeHintType, Object> hints = new HashMap();// 二维码参数

  static {
      hints.put(EncodeHintType.CHARACTER_SET, "utf-8");// 字符编码
      hints.put(EncodeHintType.ERROR_CORRECTION, ErrorCorrectionLevel.H);// 容错等级 L、M、Q、H 其中 L 为最低, H 为最高
      hints.put(EncodeHintType.MARGIN, 2);// 二维码与图片边距
  }
  /**
   * 返回一个 BufferedImage 对象
   * @param content 二维码内容
   * @param width   宽
   * @param height  高
   */
  public static BufferedImage toBufferedImage(String content, int width, int height) throws WriterException, IOException {
      BitMatrix bitMatrix = new MultiFormatWriter().encode(content, BarcodeFormat.QR_CODE, width, height, hints);
      return MatrixToImageWriter.toBufferedImage(bitMatrix);
  }
  /**
   * 将二维码图片输出到一个流中
   * @param content 二维码内容
   * @param stream  输出流
   * @param width   宽
   * @param height  高
   */
  public static void writeToStream(String content, OutputStream stream, int width, int height) throws WriterException, IOException {
      BitMatrix bitMatrix = new MultiFormatWriter().encode(content, BarcodeFormat.QR_CODE, width, height, hints);
      MatrixToImageWriter.writeToStream(bitMatrix, format, stream);
  }
  /**
   * 生成二维码图片文件
   * @param content 二维码内容
   * @param path    文件保存路径
   * @param width   宽
   * @param height  高
   */
  public static void createQRCode(String content, String path, int width, int height) throws WriterException, IOException {
      BitMatrix bitMatrix = new MultiFormatWriter().encode(content, BarcodeFormat.QR_CODE, width, height, hints);
      //toPath() 方法由 jdk1.7 及以上提供
      MatrixToImageWriter.writeToPath(bitMatrix, format, new File(path).toPath());
  }
}

QRCode.js

基本用法

<div id="qrcode"></div>
<script type="text/javascript">
new QRCode(document.getElementById("qrcode"), "http://www.runoob.com");  // 设置要生成二维码的链接
</script>

或者使用一些可选参数设置：

var qrcode = new QRCode("test", {
    text: "http://www.runoob.com",
    width: 128,
    height: 128,
    colorDark : "#000000",
    colorLight : "#ffffff",
    correctLevel : QRCode.CorrectLevel.H
});

同样我们可以使用以下方法：

qrcode.clear(); // 清除代码
qrcode.makeCode("http://www.w3cschool.cc"); // 生成另外一个二维码

实例代码

HTML 代码

<input id="text" type="text" value="http://www.runoob.com" /><br />
<div id="qrcode"></div>

CSS 代码

#qrcode {
width:160px;
  height:160px;
  margin-top:15px;
}  

JavaScript 代码

var qrcode = new QRCode("qrcode");

function makeCode () {      
    var elText = document.getElementById("text");
    
    if (!elText.value) {
        alert("Input a text");
        elText.focus();
        return;
    }
    
    qrcode.makeCode(elText.value);
}

makeCode();

$("#text").
on("blur", function () {
    makeCode();
}).
on("keydown", function (e) {
    if (e.keyCode == 13) {
        makeCode();
    }
});

菜鸟教程演示页面：

第三方提供

Google API

• cht=qr:【必需 】指定图表类型为二维码
• chs=<width>x<height>：【必需 】生成二维码的尺寸，单位是像素，目前生成的二维码都是正方形的，所以生成的二维码的宽高值都应该设置为一样的值
• chl=<data>：【必需 】生成二维码的数据内容
• choe=<output_encoding>：【可选】内容的编码格式为UTF-8【默认值】
• chld=<error_correction_level>|<margin>：【可选】纠错级别以及生成的二维码离图片边框的距离，QR码支持四个等级纠错，用来恢复丢失的、读错的、模糊的、数据
  • L：【默认】可以识别已损失的7%的数据；
  • M：可以识别已损失15%的数据；
  • Q：可以识别已损失25%的数据；
  • H：可以识别已损失30%的数据；
    注意事项：
• 需要编码的数据必需是UTF-8格式的URL编码，且长度大于2k的时候必需使用POST的方式提交，但最大长度不得大于16K
  示例：https://chart.googleapis.com/chart?chs=150x150&cht=qr&chl=Hello%20world&choe=UTF-8
  

<form action='https://chart.googleapis.com/chart' method='POST'>
    <input type="hidden" name="cht" value="qr"  />
    <input type="hidden" name="chl" value="Hello+world"  />
    <input type='hidden' name='choe' value='UTF-8' />
    <input type="hidden" name="chs" value="150x150" />
    <input type="submit"  />
</form> 

使用JavaScript方式进行POST请求的示例【post_chart.html】：

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script type='application/javascript'>
    // Send the POST when the page is loaded,
    // which will replace this whole page with the retrieved chart.
    function loadGraph() {
      var frm = document.getElementById('post_form');
      if (frm) {
       frm.submit();
      }
    }
  </script>
  </head>
  <body onload="loadGraph()">
    <form action='https://chart.googleapis.com/chart' method='POST' id='post_form'>
      <input type="hidden" name="cht" value="qr"  />
      <input type="hidden" name="chl" value="Hello+world"  />
      <input type='hidden' name='choe' value='UTF-8' />
      <input type="hidden" name="chs" value="150x150" />
    </form>
  </body>
</html>

如果使用<form>元素，则不需要对字符串进行URL编码。然后，通过在其它中使用<iframe>，可以将此图表加载到另一页中，例如：

<iframe src="post_chart.html" width="300" height="200"></iframe>

联图网