uni-app开发经验分享十三:实现手机扫描二维码并跳转全过程
最近使用 uni-app 开发 app ,需要实现一个调起手机摄像头扫描二维码功能,官网API文档给出了这样一个demo:
// 允许从相机和相册扫码
uni.scanCode({
success: function (res) {
console.log('条码类型:' + res.scanType);
console.log('条码内容:' + res.result);
}
});
该示例确实可以调起手机摄像头,但扫描后没有结果。但它打印了 条码类型 与 条码内容 ,我们控制台查看一下:

条码类型具体参考 官方API文档,写的非常清楚,我们主要谈一下条码内容。不难发现,条码内容的 URL 是由 res.result 产出,那么问题来了,这个 URL 可以访问吗?
带着好奇心,我来到了浏览器地址栏…发现正常访问,这时我就在想,只要扫码后跳转到这个 URL 不就可以完成了吗!
最后,我使用了 HTML5+ 的 openURL API 完成外部链接的跳转,我们先来看一下 API 介绍:
HTML5+ 官网 API 文档:http://www.html5plus.org/doc/zh_cn/runtime.html#plus.runtime.openWeb
1. 语法及介绍
描述:调用第三方程序打开指定的URL
void plus.runtime.openURL( url, errorCB, identity )
2. 参数与返回值
- url: ( String ): 必选,要打开的URL地址,字符串类型,各平台支持的地址类型存在差异,参考平台URL支持表。
- errorCB: ( OpenErrorCallback ) :可选,打开URL地址失败的回调,打开指定URL地址失败时回调,并返回失败信息。
- identity: ( String ) :可选,指定打开URL地址的程序名称,在iOS平台此参数被忽略,在Android平台为程序包名,如果指定的包名不存在,则打开URL地址失败。
返回值:void(无)
最后完善一下前面的示例,让其支持扫描二维码并跳转到相应地址:
uni.scanCode({
success: function (res) {
void plus.runtime.openWeb(res.result,function(){
// 识别失败代码
});
}
});
uni-app开发经验分享十三:实现手机扫描二维码并跳转全过程的更多相关文章
- 手机扫描二维码下载APP,根据操作系统不同自动下载
Android和IOS手机扫描二维码下载APP,根据OS不同,自动处理相应下载操作.IOS自动跳转至AppStore应用下载页,Android自动下载应用的apk包. <script type= ...
- 实现手机扫描二维码页面登录,类似web微信-第二篇,关于二维码的自动生成
转自:http://www.cnblogs.com/fengyun99/p/3541251.html 接上一章,我们已经基本把业务逻辑分析清楚了 下面我们第一步,实现二维码的web动态生成. 页面的二 ...
- 实现手机扫描二维码页面登录,类似web微信-第一篇,业务分析
转自:http://www.cnblogs.com/fengyun99/p/3541249.html 关于XMPP组件的文章,先休息两天,好歹已经完整的写了一份. 这两天,先实现一套关于web微信扫描 ...
- 实现手机扫描二维码页面登录,类似web微信-第三篇,手机客户端
转自:http://www.cnblogs.com/fengyun99/p/3541254.html 上一篇,介绍了二维码生成的机制,紧接着,我们就要开发手机客户端来识别这个二维码. 二维码,实际上是 ...
- 实现手机扫描二维码页面登录,类似web微信-第四篇,服务器端
转自:http://blog.csdn.net/otangba/article/details/8273952 终于到了服务器端,第三篇的手机客户端如果已经下载了的话,没有服务器是不能正常运行的. 服 ...
- asp:手机扫描二维码跳转手机版
如果想手机扫描用pc版网站生成的二维码跳转到对应的手机版的话,请在pc端的首页的<head></head>标签里面加入下面内容: <script src=" ...
- 大众点评试水O2O新模式:实体店试穿,扫描二维码付款 现场取货
在餐饮美食行业取得不错的成绩之后,大众点评将触角延伸到了线下的传统商铺,开始涉足线下商品的 O2O 团购.和传统的线上下单,线下消费的 O2O 模式不同.大众点评的 O2O 团购用户,可在店内试穿后通 ...
- 微信中扫描二维码自动打开手机系统默认浏览器下载APP(APK)
很多朋友问我怎么解决微信内点击链接或扫描二维码可以直接跳出微信在外部浏览器打开网页链接,其实这并不难,只要我们实现微信跳转功能即可.下面给大家介绍这个功能 功能目的 生成微信跳转链接,实现微信内置浏览 ...
- 扫描二维码自动识别手机系统(Android/IOS)
移动互联网发展迅速,各种APP的开发都会推出多个版本(多终端),比如:iPhone版.iPad版.Android版.有些APP还会考虑覆盖到多个国家(国际化),比如:中文版.英文版.日文版.韩文版等. ...
随机推荐
- Restful API 接口设计标准及规范
Restful API 接口设计标准以及规范 RESTful概念 理解和评估以网络为基础的应用软件的架构设计,得到一个功能强.性能好.适宜通信的架构.REST指的是一组架构约束条件和原则." ...
- Linux环境下使用logrotate工具实现nginx日志切割
一. 前提背景及需求 nginx运行日志默认保存在nginx安装目录下的 /usr/local/nginx/logs 文件夹, 包含access.log和error.log两个文件. (1) acce ...
- NET 5 爬虫框架/抓取数据
爬虫大家或多或少的都应该接触过的,爬虫有风险,抓数需谨慎. 爬虫有的是抓请求,有的是抓网页再解析 本着研究学习的目的,记录一下在 .NET Core 下抓取数据的实际案例.爬虫代码一般具有时效性,当 ...
- webform中按钮触发事件顺序
执行顺序 先执行js端的方法,后执行后台的方法 一般js端方法用做数据的校验,校验成功 return true;后才执行后台的方法. 示例 <asp:Button runat="ser ...
- 【Azure App Service】C#下制作的网站,所有网页本地测试运行无误,发布至Azure之后,包含CHART(图表)的网页打开报错,错误消息为 Runtime Error: Server Error in '/' Application
问题描述 C#下制作的网站,所有网页本地测试运行无误,发布至Azure之后,包含CHART(图表)的网页打开报错,错误消息为 Runtime Error: Server Error in '/' Ap ...
- 开发规范(二)如何写单元测试 By 阿里
- navicat12.0.26如何激活
首先准备好所需工具链接:https://pan.baidu.com/s/1EHATRC0M34n-aNteIyBXbw 密码:r7tf 下载后如图分别为64位和32位. 操作时需要断掉网络 Nav ...
- 「每日一题」面试官问你对Promise的理解?可能是需要你能手动实现各个特性
关注「松宝写代码」,精选好文,每日一题 加入我们一起学习,day day up 作者:saucxs | songEagle 来源:原创 一.前言 2020.12.23日刚立的flag,每日一题,题目类 ...
- VC维相关知识
假设空间H(Hypothesis Set) 输入空间D(X1...Xn) 1.增长函数(grown function) 是关于输入空间尺寸n的函数 假设空间对于D中所有实例实现分类(赋予标记)的分类方 ...
- [LeetCode]501. Find Mode in Binary Search Tree二叉搜索树寻找众数
这次是二叉搜索树的遍历 感觉只要和二叉搜索树的题目,都要用到一个重要性质: 中序遍历二叉搜索树的结果是一个递增序列: 而且要注意,在递归遍历树的时候,有些参数如果是要随递归不断更新(也就是如果递归返回 ...