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 data
console.log("Success response");
console.log(response);
},
function (response) { // 取消扫描
//We will go there only when user cancel a scanning.
//response always null
console.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位以下,并且是浮雕数字)的更多相关文章
- ionic实现双击返回键退出功能
实现这个功能需要四个步骤: 步骤一: 说明:因为需要和手机的硬件(返回按钮)打交道,而ionic本身是不具备该功能的,但是有一个东西可以:ng-cordova插件,这个插件是phoneGap为了能让i ...
- 使用ownCloud搭建你的个人云服务(ubuntu 14.04 server)(ownCloud对文件不切片,Seafile对文件切片),owncloud没有存储的功能 只能同步 本地删除了服务器也会删除
ownCloud是什么 ownCloud是一个自由且开源的个人云存储解决方案(类似百度网盘或者Dropbox),包括两个部分:服务器和客户端. ownCloud在客户端可通过网页界面,或者安装专用的客 ...
- 如何Android中加入扫描名片功能
要想实现android手机通过扫描名片,得到名片信息,可以使用脉可寻提供的第三方SDK,即Maketion ScanCard SDK,脉可寻云名片识别服务.他们的官方网站为http://www.mak ...
- ionic实现下载文件并打开功能(file-transfer和file-opener2插件)
作为一款app,下载文件功能,和打开文件功能,在某些场景下还是十分有必要的.使用cordova-plugin-file-transfer和cordova-plugin-file-opener2这两个插 ...
- Android OCR文字识别 实时扫描手机号(极速扫描单行文本方案)
身份证识别:https://github.com/wenchaosong/OCR_identify 遇到一个需求,要用手机扫描纸质面单,获取面单上的手机号,最后决定用tesseract这个开源OCR库 ...
- Android限定EditText的输入类型为数字或者英文(包括大小写),EditText,TextView只能输入两位小数
Android限定EditText的输入类型为数字或者英文(包括大小写) // 监听密码输入框的输入内容类型,不可以输入中文 TextWatcher mTextWatcher = new Tex ...
- hadoop2.6.0汇总:新增功能最新编译 32位、64位安装、源码包、API下载及部署文档
相关内容: hadoop2.5.2汇总:新增功能最新编译 32位.64位安装.源码包.API.eclipse插件下载Hadoop2.5 Eclipse插件制作.连接集群视频.及hadoop-eclip ...
- input和React-Native的TextInput的输入限制,只能输入两位小数(阻止0开头的输入),类似价格限制
一.背景: 想要实现一功能: 1. 最多只能输入两位小数,类似的价格限制 2. 实时监听限制输入,禁止输入不符合规范的字符(当输入违禁字符,进行删除操作) 这样做的优点: 1. 在用户输入时直接进行限 ...
- HOLOLENS 扫描特效 及得出扫描结果(SurfacePlane)
HOLOLENS 扫描特效 及得出扫描结果(SurfacePlane) 要求只扫出地板和墙, 由于地板和墙面积较大 扫描结果 HOLOTOOLKIT老版本点在参数调节PlaneFinding.Find ...
随机推荐
- SpringCloud学习(三)服务消费者(Feign)(Finchley版本)
上一篇文章,讲述了如何通过RestTemplate+Ribbon去消费服务,这篇文章主要讲述如何通过Feign去消费服务. Feign简介 Feign是一个声明式的伪Http客户端,它使得写Http客 ...
- 项目使用Hbase进行数据快速查询的代码案例
之前项目中对于数据详情的查询使用的ddb技术,由于成本过高,现考虑使用开源的hbase框架,借此机会进行hbase的代码案例记录,之前已经对 hbase的原理进行介绍,介绍了hbase中的rowkey ...
- PATB1040/A1093 有几个PAT
题目描述 The string APPAPT contains two PAT's as substrings. The first one is formed by the 2nd, the 4th ...
- curl put方式上传文件
发送端 <?php function curlPut($destUrl, $sourceFileDir, $headerArr = array(), $timeout = 10) { $ch = ...
- Linux命令-文件管理篇-cat
1.cat 说明 cat 是一个文本文件查看和连接工具.查看一个文件的内容,用cat比较简单,就是cat 后面直接接文件名. 2.使用权限 所有使用者 <!-- more --> 3.ca ...
- Spring实战(九)AOP概念以及Spring AOP
1.横切关注点(cross-cutting concern) 软件开发中,散布于应用中多处的功能被称为横切关注点,如事务.日志.安全. 横切关注点从概念上是与应用的业务逻辑相分离的(但是往往会直接嵌入 ...
- [C#]访问共享文件夹或者磁盘(需要用户名密码)
有项目要求使用对方本地管理员访问访问对方D盘,网上找到一段API,刚开始可以使用一段时间,升级到1903就失效了,一脸懵逼啊 using System; using System.Collection ...
- O044、一张图秒懂 Nova 16种操作
参考https://www.cnblogs.com/CloudMan6/p/5565757.html
- MySQL学习笔记:count(1)、count(*)、count(字段)的区别
关于数据库中行数统计,无论是MySQL还是Oracle,都有一个函数可以使用,那就是COUNT. 但是,就是这个常用的COUNT函数,却暗藏着很多玄机,尤其是在面试的时候,一不小心就会被虐.不信的话请 ...
- 【Git的基本操作五】比较文件差异
比较文件差异 1. git diff [文件名] 将工作区中的文件和暂存区对应文件进行比较 例:git diff test.txt 2. git diff [本地库中文件历史记录(指针)] [文件名] ...