微信通过页面(H5)直接打开本地app的解决方法


Posted in Javascript onSeptember 09, 2017

简述

微信中通过页面直接打开app分为安卓版和IOS版,两个的实现方式是完全不同的。

安卓版实现:使用腾讯的应用宝,只要配置了“微下载”之后,打开链接腾讯会帮你判断本地是否已经安装了app,如果本地安装就直接打开,没有安装的话就是腾讯微下载的页面进行app下载,当然微下载的页面腾讯提供了几个模板,可以自己选择和修改。

IOS实现:ios像直接点击链接打开本地app就难了,有两种方式可供我们选择:

1.腾讯深度合作的公司,微信可以帮你打开app;

2.使用IOS9+的新功能“Universal Links”(通用链接);

很显然,第二种方式更适合我们普通的公司。

效果展示

微信通过页面(H5)直接打开本地app的解决方法

实现步骤

1.配置https(必须是https)网站支持;

创建“apple-app-site-association”文件,注意不带后缀,放到网站根目录,确保可以使用:https://xxx.xxx.xxx/apple-app-site-association直接可以访问,apple-app-site-association文件内容如下:

{
  "applinks": {
    "apps": [],
    "details": [
      {
        "appID": "*****.com.gangguwang.yewugo",
        "paths": [ "/app/*" ]
      }
    ]
  }
}

其中appId是你的Prefix + ID,如图:

微信通过页面(H5)直接打开本地app的解决方法

paths为你链接拦截的地址,比如我上面填写的是“/app/*”,就是当我访问https://xxx.xxxx.xxx/app/x的时候,会打开本地app,其他连接时候则为正常显示,这个地址可以配置成多个,也可以直接写*;

2.配置苹果证书,开启“Associated Domains”,如下图:

Identifiers - App IDs ?Edit 然后开启打钩 Associated Domains 后保存,配置地址:https://developer.apple.com/account/ios/identifier/bundle

微信通过页面(H5)直接打开本地app的解决方法

3.配置你的App的Universal Links(通用链接)

如果你是普通的ios项目的的话,配置如下:项目 targets->Capabilities->Associated Domains,如图填写你的链接域名

微信通过页面(H5)直接打开本地app的解决方法

域名的格式必须为:applinks:你的域名(ex:applinks:www.domain.com),可以配置多个;

如果你是Xamarin项目的话,需要选择Entitlements.plist配置关联域,如图:

微信通过页面(H5)直接打开本地app的解决方法

这样配置完之后,打包即可测试你的应用咯。

官方配置文件:https://developer.apple.com/library/content/documentation/General/Conceptual/AppSearch/UniversalLinks.html

注意事项

1.配置的网站必须是https,不能为http;

2.[重要]展示地址和打开的地址不能在一个域名下(作者测试发现放在同一服务器下都不行),比如展示页的地址是https://a.domain.com/?id=10,打开的如果是https://a.domain.com/app/?id=10,系统默认是打开页面,而不是触发通用链接打开app;

3.[重要]配置玩证书之后需要更新证书,才能内部打包和提测上传成功;

4.通用链接可被屏蔽,点击右上角配置的链接之后,通用链接就失效了,解决方案下次讨论。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 多浏览器分别判断代码
Apr 01 Javascript
关于javascript DOM事件模型的两件事
Jul 22 Javascript
基于jQuery的投票系统显示结果插件
Aug 12 Javascript
jQuery动画animate方法使用介绍
May 06 Javascript
chrome浏览器不支持onmouseleave事件的解决技巧
May 31 Javascript
浏览器检测JS代码(兼容目前各大主流浏览器)
Feb 21 Javascript
移动端js触摸事件详解
Sep 18 Javascript
浅谈Koa服务限流方法实践
Oct 23 Javascript
AngularJS与BootStrap模仿百度分页的示例代码
May 23 Javascript
微信小程序授权登录及解密unionId出错的方法
Sep 26 Javascript
详解微信小程序中组件通讯
Oct 30 Javascript
Vue.js中v-for指令的用法介绍
Mar 13 Vue.js
React-Native中禁用Navigator手势返回的示例代码
Sep 09 #Javascript
js实现音乐播放控制条
Sep 09 #Javascript
Vue2.0用 watch 观察 prop 变化(不触发)
Sep 08 #Javascript
详解vue2 $watch要注意的问题
Sep 08 #Javascript
Express + Session 实现登录验证功能
Sep 08 #Javascript
Vue中组件之间数据的传递的示例代码
Sep 08 #Javascript
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 #jQuery
You might like
实现了一个PHP5的getter/setter基类的代码
2007/02/25 PHP
PHP goto语句简介和使用实例
2014/03/11 PHP
PHP使用curl_multi实现并发请求的方法示例
2018/04/29 PHP
JAVASCRIPT  THIS详解 面向对象
2009/03/25 Javascript
javascript 多级checkbox选择效果
2009/08/20 Javascript
jQuery入门问答 整理的几个常见的初学者问题
2010/02/22 Javascript
遨游,飞飞,IE,空中网 浏览器无提示关闭方法
2011/07/11 Javascript
js跨域问题浅析及解决方法优缺点对比
2014/11/08 Javascript
js中split和replace的用法实例
2015/02/28 Javascript
原生JS实现响应式瀑布流布局
2015/04/02 Javascript
yui3的AOP(面向切面编程)和OOP(面向对象编程)
2015/05/01 Javascript
javascript自定义in_array()函数实现方法
2015/08/03 Javascript
浅析JavaScript Array和string的转换(推荐)
2016/05/20 Javascript
JavaScript必知必会(九)function 说起 闭包问题
2016/06/08 Javascript
javascript实现二叉树遍历的代码
2017/06/08 Javascript
vue获取当前激活路由的方法
2018/03/17 Javascript
js input输入百分号保存数据库失败的解决方法
2018/05/26 Javascript
jQuery+Datatables实现表格批量删除功能【推荐】
2018/10/24 jQuery
jQuery添加新内容的四个常用方法分析【append,prepend,after,before】
2019/03/19 jQuery
jQuery操作attr、prop、val()/text()/html()、class属性
2019/05/23 jQuery
express + jwt + postMan验证实现持久化登录
2019/06/05 Javascript
Node.js控制台彩色输出的方法与原理实例详解
2019/12/01 Javascript
详解JavaScript数据类型和判断方法
2020/09/04 Javascript
Python UnicodeEncodeError: 'gbk' codec can't encode character 解决方法
2015/04/24 Python
Python爬虫实例扒取2345天气预报
2018/03/04 Python
pandas DataFrame数据转为list的方法
2018/04/11 Python
对python的bytes类型数据split分割切片方法
2018/12/04 Python
解决django中ModelForm多表单组合的问题
2019/07/18 Python
python try...finally...的实现方法
2020/11/25 Python
全网最详细的PyCharm+Anaconda的安装过程图解
2021/01/25 Python
钉钉企业内部H5微应用开发详解
2020/05/12 HTML / CSS
捷克汽车配件和工具销售网站:TorriaCars
2018/02/26 全球购物
全球最大化妆品零售网站:SkinStore
2020/10/24 全球购物
英国婴儿产品专家:Samuel Johnston
2020/04/20 全球购物
美德好少年主要事迹
2014/01/29 职场文书
文明美德伴我成长演讲稿
2014/05/12 职场文书