ionic使用CardIO实现扫描银行卡功能(只能扫描16位以下,并且是浮雕数字)
在一些涉及支付功能的app,一般需要绑定银行卡,除了靠用户手动输入银行卡号,用手机扫描银行卡也是一种常用的手段,查阅了写资料,发现ionic有CardIO插件可以实现这个功能,就兴致冲冲去尝试,结果有些失望。
下面介绍一下如何在ionic中使用CardIO实现扫描银行卡功能
相关CardIO插件的ngCordova说明
1、在入口文件main.js 中
const app = angular.module("app", ["ionic", "ngCordova", "ngAnimate", "ngCordova.plugins.cardIO"]);app.config(function ($ionicConfigProvider, $cordovaNgCardIOProvider) {"use strict";$cordovaNgCardIOProvider.setScanerConfig( // 配置显示的参数{"expiry": false,"cvv": false,"zip": false,"suppressManual": false,"suppressConfirm": false,"hideLogo": true});$cordovaNgCardIOProvider.setCardIOResponseFields( // 配置返回的参数["card_type","redacted_card_number","card_number","expiry_month","expiry_year","short_expiry_year","cvv","zip"]);
});
2、在controller文件中使用
angular.module("app").controller("mineCtrl", ["$scope", "$cordovaNgCardIO",function ($scope $cordovaNgCardIO) {"use strict";$scope.scanBankcard = () => {$cordovaNgCardIO.scanCard().then(function (response) { // 扫描成功//Success response - it`s an object with card dataconsole.log("Success response");console.log(response);},function (response) { // 取消扫描//We will go there only when user cancel a scanning.//response always nullconsole.log("when cancel scanning");console.log(response);});}; }]);
3、在html中
<ion-view view-title="扫描银行卡"><ion-content><i ng-click="scanBankcard ()" class="icon ion-camera"></i></ion-content>
</ion-view>
尝试了以后效果不是很理想,CardIO插件只能扫描16位以下,并且是浮雕数字的银行卡,无法满足设计需求,只能暂时放弃。如有大家有什么解决办法,欢迎交流
参考文章:
ionic使用cardio报错
ionic使用CardIO实现扫描银行卡功能(只能扫描16位以下,并且是浮雕数字)相关推荐
- Vue (用javaScript/JS)调用媒体摄像头拍照扫描银行卡
概述:在Vue中调用摄像头拍照进行银行卡识别. 流程:vue中调用媒体摄像头(无前后摄像头切换功能)-->根据规定的框(前端自己定制)放置银行卡-->将识别的图片通过接口传到后台,后台识别 ...
- Android扫描银行卡获取银行卡号
card.io开源的银行卡扫描的三方库真的是很好用啊. 首先需要在你的module的gradle的依赖文件中添加依赖 compile 'io.card:android-sdk:5.5.1' 2 清单文 ...
- ionic实现下载文件并打开功能(file-transfer和file-opener2插件)
作为一款app,下载文件功能,和打开文件功能,在某些场景下还是十分有必要的.使用cordova-plugin-file-transfer和cordova-plugin-file-opener2这两个插 ...
- c盘扩展卷功能只能向右扩展_信用风险管理:功能扩展和选择
c盘扩展卷功能只能向右扩展 Following feature engineering, this part moves to the next step in the data preparatio ...
- 手机所有录音功能失效_疯狂打CALL!小米手机自带扫描文字功能,一秒识别所有文字信息!...
平常遇到喜欢的句子想做笔记,是不是会先拍照下来,然后再自己手打输入或者手抄记录下来?如果文字太多怎么办?那就去打印店扫描啊,这样就能直接变成电子档了!NO NO NO!如果你还这么原始就out了,其实 ...
- 华为手机便签有扫描的功能么
华为手机系统没有自带的便签应用,与便签功能相类似的是备忘录.除了系统自带的备忘录功能之外,华为手机用户也可以通过应用市场搜索好用的便签App安装使用,比如支持多手机端云同步使用的敬业签云便签就适用于华 ...
- 打印机只能扫描图片,不能扫描成PDF解决办法
分享一个技巧,图片如何做成PDF 日常生活中经常要将很多东西(包括图片)做成PDF电子版,而一些手机软件扫描成PDF往往带有水印,不够美观,有时候打印机也不能直接打印为PDF,扫描为图片后还需要转换成 ...
- Python # 扫描端口功能 # 获取网卡的Mac地址 # 局域网扫描器IP地址和MAC地址,获取网卡名称和其ip地址
#!/usr/bin/env python # -*- coding: utf-8 -*- # 开发人员: # time: 2021-09-07 20:37 # 开发工具: PyCharm # Ver ...
- labspec6教程_LabSpec6软件功能–光谱扫描方式-Horiba.PDF
Raman Product Note HCT-HRPN02 LabSpec6 软件功能 – 光谱扫描方式 LabRAM HR Evolution 新一代高分辨拉曼光谱仪的无色差校像差设计.平场校正确保 ...
最新文章
- python sys.argv[] 的作用
- 2021 年 5 月程序员工资统计,惨不忍睹。。。
- jdbc封装mysql_用Java手动封装JDBC连接池(一)
- html与css项目,项目六HTML与CSS基础.doc
- CodeForces - 1337C Linova and Kingdom(贪心)
- JasperReport学习笔记6-JRXML的标签
- uni-app中的样式
- ioinic 怎样配置 android sdk,NiceFish-ionic: 这是一个移动端项目,示范Angular移动端组件库Ionic的基本用法,基于Ioinic 2.0,已支持PWA。...
- 计算机视觉实战(五)图像梯度计算
- 剖析 |数据现代化-富国银行的数据转型之路
- 05_过滤器解决请求中文乱码(继承HttpServletRequestWrapper)
- 基于jsp的新闻发布系统
- 4D领导力打造卓越团队
- 物联网蓝牙芯片的选型
- java 匹配任意字符_正则表达式匹配任意字符(包括换行符)
- js中对特殊字符进行转义
- FF4J(特性框架)简介及入门
- BILSTM详细介绍及代码实现
- 测绘——通过手机和smart3D创建三维模型
- PHP+MySQL实现精确统计网站访问量(IP个数)
热门文章
- wall poj 1113
- endnote教程:参考文献出现{zhang,2020,#365} 修改方法
- GraphPad Prism 9 如何一次处理多张图表?
- SQL server连接到服务器,无法连接到 (local)。在与 SQL Server 建立连接时出现与网络相关的或特定于实例的错误。未找到或无法访问服务器。请验证实例名称是否正确并且 SQL Se
- java 输出脉冲信号_一种使用SOC精确控制脉冲的方法
- 二叉树的建立与遍历(先中后层序)
- php-7.2.13的安装,php7.2 安装mcrypt扩展
- win7 安装c语言环境变量,win7下如何配置编程环境变量的方法
- carsim学习笔记5——carsim与simulink联合仿真
- Python 网络爬虫笔记6 -- 正则表达式