年后换了部门，现在主要的职责就是在网上卖精油，似乎这个就是传说中的网络营销。

跟着公司的MM们也了解不了少关于网络营销的知识，间接的了解到马云和刘强东都是些怎样龌龊的人，尽管之前也这样认为。

淘宝就不多说了，全球最大的中文假货销售平台（尽管淘宝没有打出全球中文等字样，可是其必须当之无愧）。百度，当当等厚颜无耻之徒的明智之举就在于此，老外做的再大也很少会有直接支持中文的，因此他们都会在其名称前增加：“全球最大的中文”等字样，为自己镶金。

之前还一直比较力挺京东的，认为其根本自营根本不会销售假货，所以最近一次手机都是在京东上购买的，I9300I 买了不到半个月京东掉价350块，一个月不到的时间直接掉价500多块，找了客服寻求“报价保护”，之后才发现京东的“价格保护”究竟是如何的保护其自身的利益。反正维护老百姓的权益那是不可能的，500多块只能当喂狗了，京东收取个人商家开店费也是尽可能的为个人商家输送利益，商家得利，其自然也少不了。遇到卖假货的也是先协调，协调不成最多退货赔款，售假商家依旧在京东内活跃。因为商家孝敬京东的钱不是少数。以后京东自营售假的事情，可能也就是分分钟的事情了。

上述描述，纯属发泄一下自己的情绪，哈哈！

说到正题，用朋友的话来说，他们楼下送快餐的都有二维码，是不是我们自己的网站也上个二维码呢？刚好公司要为奥蔓精油做个官网，想必二维码是必不可少的，因此今天对二维码进行了学习。之前对二维码一点概念都没有，居然还无知到以为是腾讯推出的产品，不上进坑死人啊。

二维码的专业术语说明，请大家参照维基百科对二维码描述。

用我个人的话来说，我觉得二维码就是一个字符串。不管是扫描还是生成，都是应用这个字符串进行我们需要的操作。可能这样说有点肤浅。不过通过解析二维码我们获得的不就是一个指定的字符串吗？可以是产品的编号，可以让我们找到指定的商品、也可以说一个网站的连接，通过获得这个连接，我们可以做我们需要的动作，例如打开网页。

二维码的高级应用我个人还没有系统的研究，通过扫码器扫描二维码进行库管方面的业务都是应用的案例。快递单号也可以使用，通过扫码器扫描之后把ID传输到电脑中，然后进行货物的事件跟踪数据更新什么的。

查看了京东、淘宝等网站的二维码都是先生成图片然后显示，可是在搜索资料时发现了jquery-qrcode，一个不错的jquery类库。Google已经快一个月不能使用了，期间被迫使用了几天百度，最终给我的体验只有两个字：“恶心”。用百度我似乎什么资料都找不到，排在首位的永远都是花钱的，要么就是百度百科，百度知道里的毫无用处的垃圾链接。今天一个天基本都在使用Google，心情好好的无法比拟。有需要的可以联系我，每年只需300块钱。

使用jquery-qrcode的好处，不需要在服务器端生成多余的二维码图片，二维码直接通过JavaScript直接在客户端生成，有效减少带宽，以及维护成本。

jquery-qrcode的简单用例，再此我就不再做累赘的翻译阐述了，因为我压根也不会英语。请参考jquery-qrcode官网，并下载类库，里边的例题很详细。

需要引用jquery类库(例题中使用的是1.5.2版本，其连接到google服务中，暂时不能访问，为什么不能访问，你懂的，需要看效果时，请自己替换“https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js”为本地文件),其次再把“jquery.qrcode.min.js”引用了，这样必要的环境就搭建起来了。

使用过程中不知道有哪些配置参数，请参考“jquery.qrcode.js”的源文件。

可是在我的使用中发现jquery-qrcode只能生成二维码图形，却不能直接在二维码图形中加入我们自定义的Logo图片。因此我对其类库进行了扩展，该修正版添加了Logo功能，只需要配置src属性即可。生成时Logo图片会占据设置宽高的2.5为比例。例如二维码宽高均为200时，Logo的宽高则为200/2.5=80。

这里使用到JavaScript为Canvas标记添加img标签的问题，请参照stackoverflow上的帖子《How to add image to canvas》。

下载我修改后的“jquery.qrcode.min.js”文件，不要再引用官方的了，引用从本帖下载的js文件。下载链接

调用代码如下：

<!DOCTYPE html>

<html>

<head>

    <title>Demo page</title>

</head>

<body>

    <p>

        http://jeromeetienne.github.io/jquery-qrcode/ <br />

        原版jquery-qrcode二维码生成，使用jquery-qrcode的好处，不需要在服务器端生成多余的二维码图片，二维码直接通过JavaScript直接在客户端生成，减少带宽。 <br />

        该修正版添加了Logo功能，只需要配置src属性即可。生成时Logo图片会占据设置宽高的2.5为比例。例如二维码宽高均为200时，Logo的宽高则为200/2.5=80。

    </p>

    <div id="output">

    </div>

    <script src="../jquery.min.js"></script>

    <script type="text/javascript" src="../jquery.qrcode.min.js"></script><!--这里不再调用官方的压缩文件，换成从本帖内下载的jquery.qrcode.min.js文件-->

    <script>

        jQuery(function() {

            jQuery('#output').qrcode({

                text: "http://aoman.tmall.com/",

                height: 250,

                width: 250,

                src: 'AroMiin.jpg'//这里配置Logo的地址即可。

            });

        })

    </script>

</body>

</html>

生成出来的效果图如下：

支持下小弟的工作，扫一扫，提供订单号，会有惊喜，也许是源代码哦！

jquery-qrcode客户端二维码生成类库扩展--融入自定义Logo图片的更多相关文章

  1. QRCode二维码生成方案及其在带LOGO型二维码中的应用（1）

    原文:QRCode二维码生成方案及其在带LOGO型二维码中的应用(1) 提要:很多公司为商业宣传之需,常将企业LOGO加入二维码中,但如果LOGO遮挡区域足够地大,二维码就变得无法识别.那么,有没有一 ...

  2. QRCode二维码生成方案及其在带LOGO型二维码中的应用（2）

    原文:QRCode二维码生成方案及其在带LOGO型二维码中的应用(2) 续前:QRCode二维码生成方案及其在带LOGO型二维码中的应用(1)  http://blog.csdn.net/johnsu ...

  3. 利用phpqrcode二维码生成类库和imagecopymerge函数制拼接图片的经验

    前期准备 引入phpqrcode类库(下载地址:https://sourceforge.net/projects/phpqrcode/) PHP开启GD扩展库支持 1.利用phpqrcode生成二维码 ...

  4. 利用phpqrcode二维码生成类库合成带logo的二维码并且用合成的二维码生成海报(二)

    前期准备 引入phpqrcode类库(下载地址:https://download.csdn.net/download/weixin_37557729/11891240:支持彩色二维码的下载地址:htt ...

  5. 使用PHP二维码生成类库PHP QR Code生成二维码

    <?php include 'phpqrcode.php'; $value = 'http://www.helloweba.com'; //二维码内容 $errorCorrectionLevel ...

  6. QRCode 扫描二维码、扫描条形码、相册获取图片后识别、生成带 Logo 二维码、支持微博微信 QQ 二维码扫描样式

    目录 功能介绍 常见问题 效果图与示例 apk Gradle 依赖 布局文件 自定义属性说明 接口说明 关于我 功能介绍 根据之前公司的产品需求,参考 barcodescanner 改的,希望能帮助到 ...

  7. JAVA实现QRCode的二维码生成以及打印

    喜欢的朋友可以关注下,粉丝也缺. 不说废话了直接上代码 注意使用QRCode是需要zxing的核心jar包,这里给大家提供下载地址 https://download.csdn.net/download ...

  8. Winform窗体实现简单的二维码生成和保存

    二维码的生成需要用到二维码生成的类库,ThoughtWorks.QRCode.dll 步骤: 第一步:下载二维码生成类库,ThoughtWorks.QRCode.dll 第二步:新建winform项目 ...

  9. HTML5实现扫描识别二维码/生成二维码

    扫描识别二维码 思路: 1. 操作摄像头,获取图片.HTML5 WEBRTC的navigator.getUserMedia方法去实时获取摄像头资源.  2. 利用canvas使用相关算法分析图片识别图 ...

随机推荐

  1. C# 将PDF转为线性化PDF

    线性化PDF文件是PDF文件的一种特殊格式,可以通过Internet更快地进行查看.线性化的PDF,在页面数量很多的情况下,更能突出表现出快速浏览的优势.下面是通过后端.NET程序实现将PDF文件转为 ...

  2. Tornado 的安全性保障机制Cookie XSRF跨站请求伪造阻断 &用户验证机制

    6.1 Cookie 对于RequestHandler,除了在第二章中讲到的之外,还提供了操作cookie的方法. 设置/获取 注意:Cookie 在浏览器调试时, 只有在第一次访问该网站的时候获取到 ...

  3. 【剑指Offer】丑数 解题报告

    [剑指Offer]丑数 解题报告(Python) 标签(空格分隔): 剑指Offer 题目地址:https://www.nowcoder.com/ta/coding-interviews 题目描述: ...

  4. 【stm32】基于hal库使用野火指南者esp8266 WIFI模块进行TCP传输

    UART.c #include "stm32f1xx_it.h" #include "LED.h" #include "UART.h" #i ...

  5. PowerDotNet平台化软件架构设计与实现系列（11）：日志平台

    所有后端应用几乎都会记录日志,日志系统可以统一抽象出来提供服务. 最近被Log4j2的安全漏洞刷屏了,作为开发人员的我只能咩哈哈几次表示日志处理太难了,只有折腾过的人才知道这里面的艰辛啊. 在实现Po ...

  6. Capstone CS5268 Type-C转HDMI+VGA带PD快充+USB3.1扩展坞方案

    CS5268是一种高度集成的单芯片,适用于多个细分市场和显示应用,如拓展坞.扩展底座等. 2.CS5268参数说明 总则 USB Type-C规范1.2 HDMI规范v2.0b兼容发射机,数据速率高达 ...

  7. 自动化集成：Pipeline整合Docker容器

    前言:该系列文章,围绕持续集成:Jenkins+Docker+K8S相关组件,实现自动化管理源码编译.打包.镜像构建.部署等操作:本篇文章主要描述流水线集成Docker用法. 一.背景描述 微服务架构 ...

  8. Java Web程序设计笔记 • 【第10章 JSTL标签库】

    全部章节   >>>> 本章目录 10.1 JSTL 概述 10.1.1 JSTL 简介 10.1.1 JSTL 使用 10.1.2 实践练习 10.2 核心标签库 10.2. ...

  9. Java初学者作业——声明变量对个人信息进行输入和输出

    返回本章节 返回作业目录 需求说明: 声明变量存储个人信息(姓名.年龄.性别.地址以及余额),通过键盘输入个人信息并存储在相应的变量中, 最后将个人信息输出. 实现思路: 声明存储姓名.年龄.性别.地 ...

  10. 编写Java程序，使用JDialog构造登录窗体

    返回本章节 返回作业目录 需求说明: 实现思路: 定义用户信息实体类User. 创建LoginDemoStart主类,初始化UI. 从UI获取用户信息并保存到User实体. 实现代码: