网页打开app

爷,独闯天下 提交于 2020-03-01 10:04:45

App中页面分享到第三方app(微信、微博)或在浏览器打开时,有时需要提供打开app的功能。

目前有两种实现方式:(手机安装了app)

一、Andriod通过使用应用宝打开,ios通过app store打开。

实现方式:在html页面中将<a>标签href属性设定为下载app的url,当点击a标签更改window.location时,就会打开对应的app。

弊端:经测试在ios 9及以下版本和android中如果不安装应用宝,点击下载链接url时不会直接打开app,而是会跳转到app的下载界面。

二、通过在app中配置url scheme本地协议(手机安装了app)

弊端:不论是在ios还是andriod系统中,微信都不支持直接打开app,但是可以通过浏览器二次跳转来解决。

实现方式(以ios为例):

         html代码:

         <!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width,initial-scale=1.0">

         <title>打开app的页面</title>

</head>

<body>

         <button id="openApp">点击这里app</button>  

</body>

<script>

function isInstalled(){

         window.location=" devzeng://";//打开某手机上的某个app应用,后可以带参数

         setTimeout(function(){

 window.location="http://a.app.qq.com/o/simple.jsp?pkgname=com.lechange.x.robot.phone";//如果超时就跳转到app下载页

         },2000);   

}

var open = document.getElementById('openApp');

open.onclick = function(){

         isInstalled();

}

</script>

</html>

创建URL Scheme

1、首先在*-Info.plist中添加一行,选择URL types,效果如下图所示:

2、在展开的Item 0中填写URL identifier,这个用来唯一标识用户自定义的URL Scheme,推荐使用域名的反转形式,如:com.devzeng.demo

3、在Item 0中添加新的一行,选择URL Schemes

4、展开URL Schemes,在Item 0中输入自定义的Scheme的名称。在这里只需要输入自定义的Scheme的名称即可,不需要加上://,例如这里输入的是devzeng,那么对应的自定义的URL就是devzeng://,这里可以输入多个。

5.完整

经测试以上步骤没有问题,

参考资料:http://blog.163.com/l1_jun/blog/static/1438638820156254120715/

http://blog.csdn.net/henrywulibin/article/details/52087041

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!