今天给大家分享一下基于angularjs与ionic框架实现手机二维码扫描的功能。没有用到cordova等任何插件,h5+实现的。

开发工具:hbuilder

首先,需要在hbuilder项目下面的配置文件里面引入“Barcode”的配置,具体步骤:

1.找到“manifest.json”文件,右键打开,切换到代码试图

2.在里面,可以看到"permissions",直接添加

"Barcode": {
"description": "二维码扫描"
},这个配置就可以了。下面贴出图片供大家参考

其次,废话不多说,直接上代码截图了。

中间我画红圈的就是二维码显示的区域,这个是页面的代码。下面是js代码。

我圈出来的都是关键部分,在官网上面都有详细的解释,这里就不多哔哔了。请记住,在这个js执行之前一定要移动设备判断,否则在浏览器调试会报错。

最后,官网地址:http://www.html5plus.org/doc/zh_cn/barcode.html

angularjs+ionic+'h5+'实现二维码扫描功能的更多相关文章

  1. iOS 自带二维码扫描功能的实现

    自从iOS7以后中新增了二维码扫描功能.因此可以在不借助第三方类库的情况下简单的写出二维码的扫描功能: 原生的二维码扫描功能在AVFoundation框架下,所以在使用原生的二维码扫描功能时要先导入A ...

  2. 有关iOS系统中调用相机设备实现二维码扫描功能的注意点(3/3)

    今天我们接着聊聊iOS系统实现二维码扫描的其他注意点. 大家还记得前面我们用到的输出数据的类对象吗?AVCaptureMetadataOutput,就是它!如果我们需要实现目前主流APP扫描二维码的功 ...

  3. IOS开发---菜鸟学习之路--(二十)-二维码扫描功能的实现

    本章将讲解如何实现二维码扫描的功能 首先在github上下载ZBar SDK地址https://github.com/bmorton/ZBarSDK 然后将如下的相关类库添加进去 AVFoundati ...

  4. Android集成二维码扫描功能

    文章转载自  https://github.com/yipianfengye/android-zxingLibrary 在具体介绍该扫描库之前我们先看一下其具体的使用方式,看看是不是几行代码就可以集成 ...

  5. mui 二维码扫描功能

    mui 扫一扫识别二维码 以及多次扫码后从结果页返回时黑屏问题解决  扫一扫页面全部代码 <!doctype html><html>     <head>      ...

  6. Android二维码扫描功能的集成开发

    二维码开发主要依赖ZXing开源项目 项目地址:https://github.com/zxing/zxing 这个开源项目可以扫描一维,和二维码, 一维码指的是书后面的条形码 首先配置ZXing库和A ...

  7. Android实现二维码扫描功能

    1.效果预览 先上图展示效果(模拟器没有摄像头,录出来效果不好,将就看) 2.集成步骤 1.拷贝本项目demo中的com.google.zxing5个包引入到自己的项目中. 2.拷贝本项目demo中的 ...

  8. 使用ionic2开发一个二维码扫描功能

    界面添加一个按钮: <button ion-button block color="secondary" class="Scan-button" (cli ...

  9. Android仿微信二维码扫描

    转载:http://blog.csdn.net/xiaanming/article/details/10163203 了解二维码这个东西还是从微信中,当时微信推出二维码扫描功能,自己感觉挺新颖的,从一 ...

随机推荐

  1. Windows 7下将Tomcat Java程序设置为Windows Service

    可以参看以下资料: https://jingyan.baidu.com/article/b2c186c89f5127c46ef6ff08.html http://tomcat.apache.org/t ...

  2. jquery提供的插件无法删除cookie的解决办法

    之前使用jquery的cookie插件提供的 $.cookie("key",null)方法删除cookie,结果发现代码中的cookie一直无法删除,导致后面的种种问题. 经过各种 ...

  3. UWP 手绘视频创作工具技术分享系列 - 手绘视频与视频的结合

    本篇作为技术分享系列的第三篇,详细讲一下手绘视频中结合视频的处理方式. 随着近几年短视频和直播行业的兴起,视频成为了人们表达情绪和交流的一种重要方式,人们对于视频的创作.编辑和分享有了更多的需求.而视 ...

  4. jQuery的get()post()getJson()方法

    jQuery get() 和 post() 方法用于通过 HTTP GET 或 POST 请求从服务器请求数据. HTTP 请求:GET vs. POST 两种在客户端和服务器端进行请求-响应的常用方 ...

  5. ldap命令的使用

    转自:http://blog.chinaunix.net/uid-20690190-id-4085176.html 增:ldapadd 1)选项: -x   进行简单认证 -D   用来绑定服务器的D ...

  6. Java的迭代和foreach循环

    Java的迭代(interation statement) Java的迭代(interation statement) 其实就是循环控制语句while.do-while和for,因为他们会从重复地运行 ...

  7. JS中金额转换以及格式化

    abs = function(val){ //金额转换 分->元 保留2位小数 并每隔3位用逗号分开 1,234.56 var str = (val/100).toFixed(2) + ''; ...

  8. 从0到1搭建spark集群---企业集群搭建

    今天分享一篇从0到1搭建Spark集群的步骤,企业中大家亦可以参照次集群搭建自己的Spark集群. 一.下载Spark安装包 可以从官网下载,本集群选择的版本是spark-1.6.0-bin-hado ...

  9. Java学习笔记8---类的静态成员变量与静态成员方法的访问与调用方式

    (注:静态变量修改为静态成员变量,静态方法改为静态成员方法) 静态成员变量又称类变量,静态成员方法又称类方法,它们统称为静态成员或类成员.静态成员由static修饰,是属于整个类的,所有的对象共享这些 ...

  10. Python模块学习------ 多线程threading(2)

    一.避免使用thread模块,使用threading模块的原因: 1. 更高级别的threading模块更为先进,对线程的支持更加完善.而且使用thread模块的属性有可能会与threading 出现 ...