在网页中使用jQuery-qrcode生成二维码以及中文支持解决方案

在网页中也会经常用到二维码,比如说手机端扫码登录许可,APP下载等。但是如果使用第三方服务做的话会偶尔因为网络等其他原因造成生成失败。

所以比较推荐jQuery-QRCode生成,这是一个完全依靠浏览器生成二维码的方案,比较可靠。

以下为使用说明的GitHub地址:https://github.com/jeromeetienne/jquery-qrcode

但是此方法不支持中文,还是有一定的缺陷的,所以参照了网上一些大牛的关于中文支持的解决方案,以下为示例代码:


<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>



  
    
    
    生成二维码
    
	
	
	    
	
	
	
	
	
	
    
  
  
  
    	使用原生jQuery生成的二维码如下: 
使用原生jQuery生成的不支持中文的二维码如下:
进行转换生成的支持中文的二维码如下:



生成二维码的参数说明:
{  
    // render 方式: 'canvas', 'image' or 'div'  
    render: 'canvas',  
  
    // version range somewhere in 1 .. 40  
    minVersion: 1,  
    maxVersion: 40,  
  
    // error correction level: 'L', 'M', 'Q' or 'H'  
    ecLevel: 'L',  
  
    // offset in pixel if drawn onto existing canvas  
    left: 0,  
    top: 0,  
  
    // size in pixel  
    size: 200,  
  
    // code color or image element  
    fill: '#000',  
  
    // background color or image element, null for transparent background  
    background: null,  
  
    // content  


radius: 0, // quiet zone in modules quiet: 0, // modes // 0: normal // 1: label strip // 2: label box // 3: image strip // 4: image box mode: 0, mSize: 0.1, mPosX: 0.5, mPosY: 0.5, label: 'no label', fontname: 'sans', fontcolor: '#000', image: null }
识别中文原理:
我们试验的时候发现不能识别中文内容的二维码,通过查找多方资料了解 到,jquery-qrcode是采用charCodeAt()方式进行编码转 换的。而这个方法默认会获取它的Unicode编码,如果有中文内容,在生成二维码前就要把字符串转换成UTF-8,然后再生成二维码。您可以通过以下函 数来转换中文字符串:


浏览器打开效果:

在网页中使用jQuery-qrcode生成二维码以及中文支持解决方案_第1张图片






你可能感兴趣的:(Web)