[TOC]
二維碼基本原理
二維條碼是指在一維條碼的基礎(chǔ)上擴(kuò)展出另一維具有可讀性的條碼靶衍，使用黑白矩形圖案表示二進(jìn)制數(shù)據(jù)，被設(shè)備掃描后可獲取其中所包含的信息宴合。一維條碼的寬度記載著數(shù)據(jù)忧便，而其長(zhǎng)度沒(méi)有記載數(shù)據(jù)档泽。二維條碼的長(zhǎng)度瓣蛀、寬度均記載著數(shù)據(jù)浑度。二維條碼有一維條碼沒(méi)有的“定位點(diǎn)”和“容錯(cuò)機(jī)制”。容錯(cuò)機(jī)制在即使沒(méi)有辨識(shí)到全部的條碼缎患、或是說(shuō)條碼有污損時(shí)慕的，也可以正確地還原條碼上的信息。二維條碼的種類很多挤渔，不同的機(jī)構(gòu)開(kāi)發(fā)出的二維條碼具有不同的結(jié)構(gòu)以及編寫(xiě)肮街、讀取方法。
堆疊式/行排式二維條碼判导，如嫉父，Code 16K沛硅、Code 49、PDF417等熔号。
矩陣式二維碼稽鞭，最流行莫過(guò)于QR CODE，二維碼的名稱是相對(duì)與一維碼來(lái)說(shuō)的引镊，比如以前的條形碼就是一個(gè)“一維碼”。它的優(yōu)點(diǎn)有：二維碼存儲(chǔ)的數(shù)據(jù)量更大篮条；可以包含數(shù)字弟头、字符，及中文文本等混合內(nèi)容涉茧；有一定的容錯(cuò)性（在部分損壞以后可以正常讀雀昂蕖）；空間利用率高等伴栓。
二維碼掃描器是根據(jù)條碼的顏色反差 (Color Contrast) 而識(shí)別伦连，因此以黑白顏色配搭效果最好。二維碼的反差色不明顯會(huì)出現(xiàn)掃描不出來(lái)的情況钳垮。白色的二維碼惑淳，可以換成黑色的底色。二維碼掃描器是根據(jù)條碼的顏色反差 (Color Contrast) 而識(shí)別饺窿，所以以黑白顏色配搭的效果是最好的歧焦。
顏色使用須知如下：
- 條紋使用深色，空白位用淺色肚医。
- 條紋使用冷色绢馍，例如黑色、藍(lán)色肠套、綠色舰涌、靛藍(lán)色。
- 空白位使用暖色你稚，例如白色瓷耙、紅色、橙色入宦、黃色哺徊。
- 透明的包裝，底色要明顯反差色乾闰。
二級(jí)碼生成
在線二維碼生成
(草料二維碼)：
https://cli.im/
java代碼生成二維碼
參考:https://www.cnblogs.com/huanzi-qch/p/10097791.html
ZXing(google開(kāi)源)落追，一個(gè)支持在圖像中解碼和生成條形碼(如二維碼、PDF 417涯肩、EAN轿钠、UPC巢钓、Aztec、Data Matrix疗垛、Codabar)的庫(kù)症汹。ZXing(“zebra crossing”)是一個(gè)開(kāi)源的、多格式的贷腕、用Java實(shí)現(xiàn)的一維/二維條碼圖像處理庫(kù)背镇，具有到其他語(yǔ)言的端口。
- GitHub地址泽裳，猛戳：https://github.com/zxing/zxing
- API文檔瞒斩，猛戳：https://zxing.github.io/zxing/apidocs/index.html
- 介紹文檔，猛戳：https://zxing.github.io/zxing/
前端二維碼生成
后端生成我們可以用ZXing框架涮总，那么前端js又應(yīng)該如何生成胸囱、識(shí)別二維碼呢？QRCode.js瀑梗，QRCode.js 是一個(gè)用于生成二維碼的 JavaScript 庫(kù)烹笔。主要是通過(guò)獲取 DOM 的標(biāo)簽,再通過(guò) HTML5 Canvas 繪制而成,不依賴任何庫(kù)。菜鳥(niǎo)教程抛丽，猛戳：http://www.runoob.com/w3cnote/javascript-qrcodejs-library.html
但是qrcode默認(rèn)不支持自定義logo谤职，怎么辦呢？?jī)煞N方法：
1铺纽、創(chuàng)建一個(gè)img標(biāo)簽柬帕，調(diào)整樣式，讓logo在二維碼區(qū)域上居中顯示
2狡门、創(chuàng)建一個(gè)canvas畫(huà)布陷寝，將二維碼跟logo重新繪制，讓logo在二維碼區(qū)域上居中顯示
app掃碼下載
支付寶等其它app掃描其馏，可以使用瀏覽器打開(kāi)直接下載凤跑。微信掃碼禁用的下載功能，可以使用旋風(fēng)微跳叛复，生成可以在微信可下載的二維碼：
http://www.zjychina.cn/
但是旋風(fēng)微跳類服務(wù)是收費(fèi)的仔引。
可以采用間接的方法支持微信掃描下載。
參考：http://www.reibang.com/p/f6a6406e023f
核心代碼如下:
goDownload();
// 去下載
function goDownload() {
var u = navigator.userAgent, app = navigator.appVersion;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1;
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
// 是安卓瀏覽器
if (isAndroid) {
window.location.; // 跳安卓端下載地址
}
// 是iOS瀏覽器
if (isIOS) {
window.location.; // 跳AppStore下載地址
}
// 是微信內(nèi)部webView
if (is_weixn()) {
alert("請(qǐng)點(diǎn)擊右上角按鈕, 點(diǎn)擊使用瀏覽器打開(kāi)");
}
// 是PC端
if (IsPC()) {
window.location.; // 公司主頁(yè)
}
}
// 是微信瀏覽器
function is_weixn(){
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=="micromessenger") {
return true;
} else {
return false;
}
}
function IsPC() {
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone",
"SymbianOS", "Windows Phone",
"iPad", "iPod"];
var flag = true;
for (var v = 0; v < Agents.length; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) {
flag = false;
break;
}
}
return flag;
}
臭味相投的朋友們褐奥，我在這里:
猿in小站:http://www.yuanin.net
csdn博客:https://blog.csdn.net/jiabeis
簡(jiǎn)書(shū):http://www.reibang.com/u/4cb7d664ec4b
微信免費(fèi)訂閱號(hào)“猿in”
猿in
