微信自带的浏览器无法输入链接，仅仅能通过扫描二维码实现。可是有时候看到一个有趣的站点，想分享，还得先去将链接转化成二维码的站点。先转成二维码。再扫描。有点麻烦。所以写了一个插件。直接生成二维码。

须要引用的文件：jquery.qrcode.js(将文字转化成二维码)和jquery

用的是Browser Actions实现。用户点击图标。在popup.html中显示二维码，代码例如以下：

manifest.json:

{

  "name": "WebSite2QRcode",

  "version": "1.0",

  "description": "将网址转化成二维码",

  "browser_action": {

    "default_icon": "icon.png" ,

    "default_title": "QRcode",

    "default_popup": "popup.html"

  } ,

  "permissions": [

        "tabs",

        "http://*/*",

        "https://*/*",

        "notifications"

      ],

   "manifest_version": 2

}

popup.html:

<!DOCTYPE html>

<html>

<head>

<title>Website2QRcode</title>

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

<script type="text/javascript" src="jquery.qrcode.min.js"></script>

<script type="text/javascript" src="popup.js"></script>

</head>

<body>

<p id="website">

	http://blog.csdn.net/iloster

</p>

<p id="title">

</p>

<div id="QRcode"></div>

</body>

</html>

popup.js

function getCurrentTabUrl(callback)

{

	//获取当前标签的网址和标题

	chrome.tabs.getSelected(function(tab)

		{

			var tabUrl = tab.url;

			var tabTitle = tab.title;

			callback(tabUrl,tabTitle);

		});

}

//监听点击时间

document.addEventListener('DOMContentLoaded', function() {

	 getCurrentTabUrl(function(tabUrl,tabTitle)

	 	{

	 		 var website = document.getElementById('website');

	 		 var title = document.getElementById('title');

	 		 website.textContent = "网址: " + tabUrl;

	 		 title.textContent = "标题: " + tabTitle;

	 		 //生成二维码

    		jQuery('#QRcode').qrcode(tabUrl);

	 	});

});

结果:

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaWxvc3Rlcg==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

有什么好的链接，直接扫描分享就好了

源代码地址：https://github.com/iloster/WebSite2QRcode

chrome插件开发-----------将网址转化成二维码website2QRcode的更多相关文章

  1. URL转换成二维码

    转载请注明出处:http://www.cnblogs.com/cnwutianhao/p/6685804.html 二维码已经成为我们日常生活中的一个不可获取的产物,火车票上,景区门票,超市付款等等都 ...

  2. JS框架_(Qrcode.js)将你的内容转换成二维码格式

    百度云盘 传送门 密码:304e 输入网址点击按钮生成二维码,默认为我的博客首页 二维码格式演示 <!DOCTYPE html> <html lang="en"& ...

  3. qrcode.js插件将你的内容转换成二维码格式

    ---qrcode.js插件将你的内容转换成二维码格式--- 我之前一直想知道二维码是怎么生成,所以就了解了一下, 最后还是不知道它的原理, 但是,我知道怎么生成. 现在就让我带你制作一个你喜爱的二维 ...

  4. 利用 Python django 框架 输入汉字，数字，字符，等。。转成二维码！

    利用 Python django 框架 输入汉字,数字,字符,等..转成二维码! 模块必备:Python环境 + pillow  + qrcode 模块 核心代码import qrcode qr = ...

  5. python将url转变成二维码图片

    将url数据转变成二维码数据,再将二维码图片转成base64格式返回 import qrcode import io def url_image(self,url): img = qrcode.mak ...

  6. iOS-生成二维码图片【附中间带有小图标二维码】（QRCode）

    生成二维码图片也是项目中常用到的,二维码的扫描Git上有很多好用的,这里主要说下二维码的生成 1.普通二维码 方法 /** 生成二维码 QRStering:字符串 imageFloat:二维码图片大小 ...

  7. c# url链接转成二维码图片，再转成byte[]二进制流，输出到前段ajax

    需要用到的 dll 添加引用 代码: //获取配置文件设置的url string urllink = ConfigurationManager.AppSettings["urllink&qu ...

  8. python将url转换成二维码

    准备环境 python生成二维码,需要依赖包qrcode和PIL(二维码的实质就是一个url.) python3安装PIL:pip install PIL python2安装PIL:pip insta ...

  9. apk下载的网址生成一个二维码

    apk提供二维码扫描下载,其实就是把apk所在的地址生成二维码. 下面提供一个在线二维码生成网址,http://cli.im/text/1833744?iID7V

随机推荐

  1. cordova 从xcode7迁移到xcode8

    环境以开发流程 当前项目使用的cordova环境 cordova 6.1.1 cordova-ios 3.9.2(vs15自动装的不知道在哪能改,所以考虑升级到vs17,能够手动指定) cordova ...

  2. Transport failed: java.io.EOFException

    ActiveMQ服务端有时会报Transport failed: java.io.EOFException这样的错误,这是由客户端丢失连接并反复尝试连接导致的,不是什么大问题,有时网络波动就会产生这种 ...

  3. Java集合里的一些“坑”

    这里主要谈下Java集合在使用中容易被忽略.又容易出现的两个“坑”,一个是集合与数组互相转换,另一个是集合遍历删除.主要通过代码演示. 一.集合与数组互相转换中的“坑” //Test1.java pa ...

  4. 2017百度春招<不等式排列>

    题目: 度度熊最近对全排列特别感兴趣,对于1到n的一个排列,度度熊发现可以在中间根据大小关系插入合适的大于和小于符号(即 '>' 和 '<' )使其成为一个合法的不等式数列.但是现在度度熊 ...

  5. 系统日志查看logrotate 工具

    logrotate是作为linux系统日志的管理工具存在.他可以轮换,压缩,邮件系统日志文件. 默认的logrotate被加入cron的/etc/cron.daily中作为每日任务执行./etc/lo ...

  6. 百度NLP面试题

    C++ :     1.拷贝构造函数和重载=符分别在什么情况下被调用,实现有什么区别 2.虚函数的目的,虚函数和模板类的区别,如何找到虚函数 常规算法: 1. 如何输出一个集合的所有真子集,递归和非递 ...

  7. EF – 8.多对多关联

    5.6.10 <多对多关联(上)> 时长:9分57秒 难度:难 5.6.11<多对多关联(下)> 时长:8分50秒 难度:难 如果单独地把多对多关联的CRUD拿出来讲,确实比较 ...

  8. 小程序canvasu真机上数据图片不能使用

    canvas遇到的坑 1.文字换行 2.真机不能使用网络数据图片(真坑) 点击显示效果我就不写了,你们可以自己加一下 全部代码贴出来 css #preview { width: 100%; heigh ...

  9. sql server 存储过程解密

    Create PROCEDURE [dbo].[sp_windbi$decrypt] () AS /**//* 王成辉翻译整理,转贴请注明出自微软BI开拓者www.windbi.com 调用形式为: ...

  10. Linux下Diff命令

    一般正常比较两个文件用vimdiff,算是直接进入vim界面,如果比较两个文件夹下面的文件,可以用diff,注意,这里只会比较文件夹下面的同名文件,他会列出不一样的点. 参考Linux下Diff命令使 ...