天天看點

二維碼通訊錄的實作

二維碼通訊錄的實作

    功能介紹:根據使用者的填入的相關資訊生成二維碼,手機微信掃描二維碼直接可以添加該使用者到手機聯系人,主要涉及到二維碼的生成和手機聯系人vCard的設計,效果圖如下:

二維碼通訊錄的實作

微信掃描該二維碼之後直接點選儲存即可添加到手機通訊錄中。

1,生成二維碼的實作

    二維碼的實作借助了Qrcode,Qrcode是日本開發出來的,是由Denso公司于1994年9月份研發的一種矩陣二維碼符号,它具有一維條碼及其他二維條碼所具有的資訊容量大、可靠性高、可表示漢字及圖像等多種文字資訊、保密防僞性強等優點。

    建立二維碼工具類實作:

package com.qixiaoqi.utils;

import java.awt.Color;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.io.File;
import javax.imageio.ImageIO;

import com.swetake.util.Qrcode;

/**
 * 
 * @ClassName GenerateQrcodeUtils
 * @Description 生成二維碼的工具類
 * @author QiXiaoQi
 * @date 2017-12-4下午03:22:15
 * @version V1.0
 */
public class GenerateQrcodeUtils {

    /**
     * 
     * @Title GenerateQrCodeImg
     * @Description 生成二維碼的方法實作
     * @param content 需要生成二維碼的内容
     * @param imgPath 儲存生成的二維碼的路徑
     * @return void
     * <br>
     * <a href="https://www.baidu.com/" target="_blank" rel="external nofollow"  style="font-size:20px;color:red;">百度一下,你就知道了</a>
     */
    public static void GenerateQrCodeImg(String content, String imgPath) {

        /** 
         * 設定畫闆的大小
         * 注意:隻能大不能小,大了二維碼邊上有空白,能掃出來
         * 但是小了是掃描不出來的,因為小了生成的二維碼不完整 
         */
        int width = ;
        int height = ;

        /** 建立Qrcode對象 */
        Qrcode qrcode = new Qrcode();
        /** 設定二維碼糾錯級别 可選項L(7%),M(15%),Q(25%),H(30%) */
        qrcode.setQrcodeErrorCorrect('M');
        /** 設定二進制 */
        qrcode.setQrcodeEncodeMode('B');
        /** 設定版本号,版本号決定了生成的字元長度 */
        qrcode.setQrcodeVersion();
        /** 擷取畫闆 */
        BufferedImage img = new BufferedImage(width, height, BufferedImage.TYPE_INT_BGR);
        /** 擷取畫筆 */
        Graphics2D grap = img.createGraphics();
        /** 設定背景顔色 */
        grap.setBackground(Color.WHITE);
        /** 建立一個二維碼的區域 */
        grap.clearRect(, , width, height);
        /** 設定畫筆顔色 */
        grap.setColor(Color.BLACK);
        /** 擷取内容位元組數組,設定編碼集 */
        try {
            byte[] contentBytes = content.getBytes("utf-8");
            /** 生成二維碼(是一個二維數組) */
            boolean[][] codeOut = qrcode.calQrcode(contentBytes);
            /** 設定偏移量 */
            int offSet = ;
            for(int i = ; i < codeOut.length; i++) {
                for(int j = ; j < codeOut.length; j++) {
                    if(codeOut[i][j]) {
                        grap.fillRect(i*+offSet, j*+offSet, , );
                    }
                }
            }
            /** 釋放資源 */
            grap.dispose();
            img.flush();
            /** 生成二維碼圖檔 */
            File imageFile = new File(imgPath);
            ImageIO.write(img, "jpg", imageFile);
            System.out.println("成功生成二維碼");
            System.out.println("content = " + content);
            /** 調試的時候注意觀察列印出來的路徑 */
            System.out.println("imgPath = " + imgPath);

        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}
           

2,前台jsp的實作

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>二維碼通訊錄</title>
    <script type="text/javascript" src="js/jquery-1.11.1.js"></script>
    <script type="text/javascript">
        $(function() {
            $("#button_id").click(function() {
                var name = "",phone="",address="",company="",url="";
                if($("#name_id").val().length > ) {
                    name = "FN:" + $("#name_id").val() + "\n";
                }else {
                    alert("請輸入名字");
                    return;
                }
                if($("#phone_id").val().length > ) {
                    phone = "TEL;HOME:" + $("#phone_id").val() + "\n";
                }else {
                    alert("請輸入正确的手機号");
                    return;
                }
                if($("#address_id").val().length > ) {
                    address = "ADR;HOME:" + $("#address_id").val() + "\n"
                }
                if($("#company_id").val().length > ) {
                    company = "ADR;WORK:" + $("#company_id").val() + "\n"
                }
                if($("#url_id").val().length > ) {
                    url = "URL:" + $("#url_id").val() + "\n"
                }

                var info = "BEGIN:VCARD\n"+name+phone+address+company+url+"END:VCARD";

                $.ajax({
                    url:"result.jsp",
                    type:"post",
                    data:{"content":info},
                    success:function(result) {
                        $("#div_id").html("<img src="+result);
                    }
                });

            });
        });     
    </script>

  </head>

  <body>
    <br>
    <h3 align="center">二維碼通訊錄系統</h3>
    <center>姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名:<input id="name_id" type="text"/></center><br>
    <center>手機号碼:<input id="phone_id" type="text"/></center><br>
    <center>家庭住址:<input id="address_id" type="text"/></center><br>
    <center>機關位址:<input id="company_id" type="text"/></center><br>
    <center>個人首頁:<input id="url_id" type="text"/></center><br>

    <center><button id="button_id" type="button">&nbsp;&nbsp;生成通訊錄二維碼&nbsp;&nbsp;</button></center><br>
    <center><div id="div_id" height="233" width="233"></div></center><br>

  </body>
</html>
           

3,關于手機通訊錄的vCard設計

    在前台頁面的實作中,獲得使用者輸入的名字時:

name = "FN:" + $("#name_id").val() + "\n";

,這裡的”FN:”就是标準通信薄的基本格式,包括”TEL;HOME:”、”ADR;HOME:”、”ADR;WORK:”、”URL:”等。手機通訊錄就是通過這些格式來進行識别的,還有很多其他選項,具體可見百科中對vCard的具體解釋,在“标準通信薄基本格式”一欄中。

4,生成通訊錄二維碼的背景實作

<%@ page language="java" 
    import="java.util.*,com.qixiaoqi.utils.*" 
    pageEncoding="utf-8"%>
<%@page import="javax.imageio.ImageIO"%>

<%
    request.setCharacterEncoding("utf-8");
    String content = request.getParameter("content");   

    String fileName = "qrcode_" + new Date().getTime() + ".jpg";
    String imgPath = request.getRealPath("/") + fileName;

    GenerateQrcodeUtils.GenerateQrCodeImg(content, imgPath);
    out.print(fileName);
%>
           

繼續閱讀