二维码生成插件qrious及网站扫码登录的一些理解
什么是二维码
二维码又称QR Code，QR全称Quick Response，是一个近几年来移动设备上超流行的一种编码方式，它比传统的Bar Code条形码能存更多的信息，也能表示更多的数据类型。
二维条码/二维码（2-dimensional bar code）是用某种特定的几何图形按一定规律在平面（二维方向上）分布的黑白相间的图形记录数据符号信息的；在代码编制上巧妙地利用构成计算机内部逻辑基础的“0”、“1”比特流的概念，使用若干个与二进制相对应的几何形体来表示文字数值信息，通过图象输入设备或光电扫描设备自动识读以实现信息自动处理：它具有条码技术的一些共性：每种码制有其特定的字符集；每个字符占有一定的宽度；具有一定的校验功能等。同时还具有对不同行的信息自动识别功能、及处理图形旋转变化点。
特点：
信息容量大, 可以容纳多达1850个大写字母或2710个数字或500多个汉字
应用范围广, 支持文字,声音,图片,指纹等等...
容错能力强, 即使图片出现部分破损也能使用
成本低, 容易制作
容错级别：
**L级**（低） 7％的码字可以被恢复。
**M级**（中） 的码字的15％可以被恢复。
**Q级**（四分）的码字的25％可以被恢复。
**H级**（高） 的码字的30％可以被恢复。
二维码生成插件qrious.js
qrious是一款基于HTML5 Canvas的纯JS二维码生成插件。通过qrious.js可以快速生成各种二维码，你可以控制二维码的尺寸颜色，还可以将生成的二维码进行Base64编码。
| 参数 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| background | String | "white" | 二维码的背景颜色。 |
| foreground | String | "black" | 二维码的前景颜色。 |
| level | String | "L" | 二维码的误差校正级别(L, M, Q, H)。 |
| mime | String | "image/png" | 二维码输出为图片时的MIME类型。 |
| size | Number | 100 | 二维码的尺寸，单位像素。 |
| value | String | "" | 需要编码为二维码的值 |
qrious生成二维码的代码：
<html>
<head>
<title>二维码入门小demo</title>
</head>
<body>
<img id="qrious">
<script src="qrious.min.js"></script>
<script>
var qr = new QRious({
element:document.getElementById('qrious'),
size:250,
level:'H',
value:'http://www.baidu.com'
});
</script>
</body>
</html>
网站扫码登录的一些理解：
第一步：用户A访问网页版系统点击使用二维码登录，系统服务器为这个会话生成一个全局唯一的id，并以此id为基础生成url做成二维码放到页面上（www.xxx.com/login.html?id=xxxxxxx），
于此同时需要把此id写到redis之类的数据库中（可以以id为key），此时系统并不知道访问者是谁。 第二步：用户A打开自己的该系统的手机APP并扫描这个二维码，首先验证手机端用户是否登录，登录过后跳转到扫码得到的url中。 第三步：手机端是登录状态，用户点击url中的确认登录后，手机上的客户端将账号信息和这个扫描得到的id 一起提交到redis中（根据id这个key，把用户信息及token之类的登录信息写到value中）。 第四步：一般来说在第一步之后，需要建立一个长连接或者轮询查看redis这个以id为key的value值，如果value不为空且验证用户身份后，通知网页版系统，这个ID对应的用户是A，然后使其登录网页版。
但是这种长连接是比较耗费资源的，可以考虑用GOEASY之类的web消息推送来代替长连接这种方式。
二维码生成插件qrious及网站扫码登录的一些理解的更多相关文章
- 二维码生成插件qrious
1.qrious是基于canvas的纯JS二维码生成插件 1.1什么是二维码 二维码又称QR Code,QR全称Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的B ...
- jquery二维码生成插件_二维码生成器
jquery二维码生成插件_二维码生成器 下载地址:jquery生成二维码.rar
- Highcharts使用二维数组生成图表
Highcharts使用二维数组生成图表 二维数组是更为灵活的一种数据存储方式.在Highcharts中.能够使用配置项column和rows二维数组.对于使用columns构建的二维数组,Highc ...
- 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_6-3.微信网站扫码支付介绍
笔记 3.微信网站扫码支付介绍 简介:讲解微信网页扫码支付 1.扫码支付文档:https://pay.weixin.qq.com/wiki/doc/api/native.php ...
- 基于jquery二维码生成插件qrcode
1.首先在页面中加入jquery库文件和qrcode插件. ? 1 2 <script type="text/javascript" src="jquery.js& ...
- jquery二维码生成插件jquery.qrcode.js
插件描述:jquery.qrcode.js 是一个能够在客户端生成矩阵二维码QRCode 的jquery插件 ,使用它可以很方便的在页面上生成二维条码. 转载于:http://www.jq22.com ...
- js 二维码生成 插件
<div onclick="liaotian()">点击生成二维码</div><div id="qrcode"></d ...
- Chrome浏览器二维码生成插件
猛击就可以使用啦->>>猛击使用 源码如下: 源码打包 源码: jquery-2.1.3.min.js jquery.qrcode.min.js https://gith ...
- 修改二维码生成插件jquery.qrcode.js支持加入自定义LOGO
1,将jquery.qrcode.min.js和jquery添加到您的网页中 <script src="jquery.min.js"></script> & ...
随机推荐
- LeetCode Friend Circles
原题链接在这里:https://leetcode.com/problems/friend-circles/description/ 题目: There are N students in a clas ...
- HAL层编写规范
andriod HAL模块也有一个通用的入口地址,这个入口地址就是HAL_MODULE_INFO_SYM变量,通过它,我们可以访问到HAL模块中的所有想要外部访问到的方法. 在Linux系统中,后缀 ...
- 使用AWK分析Oracle系统锁定、Hang状态
在早期Oracle版本中,由于技术不成熟等原因,数据库锁定和僵死状态还是时有发生的.对待这些问题,老先生们的处理策略无外乎是“重启”和“考究”两种策略.所谓“重启”,通过强制的重启服务器或者数据库,将 ...
- 原生 Javascript 编写五子棋
原文地址:原生 Javascript 编写五子棋 博客地址:http://www.extlight.com 一.背景 近一个月没写 Javascript 代码,有点生疏.正好浏览网页时弹出五子棋的游戏 ...
- java的日期
直接看例子: import java.text.DateFormatSymbols; import java.util.Calendar; import java.util.GregorianCale ...
- 函数参数个数不确定时使用va_start
今天在网上看程序时忽然发现别人的函数参数中有省略号,甚是吃惊,发现其函数中使用了va_start,经过查资料大概明白其用法,个人觉得很好用! #include <stdio.h> #inc ...
- vs2015安装ORACLE的DbFirst
不说DbFirst好在哪里,它和ModelFirst,CodeFirst都各有各的好,由于对于已经存在的一个大型的业务库,使用EntityFramework的更倾向于DbFirst,因为好多同事已经习 ...
- java根据特定密钥对字符串进行加解密
package com.test; import java.io.IOException; import java.security.SecureRandom; import javax.crypto ...
- JVM调优总结(这个总结得比较全面)
堆大小设置 JVM 中最大堆大小有三方面限制:相关操作系统的数据模型(32-bt还是64-bit)限制:系统的可用虚拟内存限制:系统的可用物理内存限制.32位系统下,一般限制在1.5G~2G:64为操 ...
- 设置VS以管理员身份运行
以vs2013为例 vs右键属性 ----- 找到目标位置如下 "C:\Program Files (x86)\Microsoft Visual Studio 12.0\Common7\ ...