第三方链接跳转原生APP( H5前端 对接 原生前端 )

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

前言

需求：微信群点击第三方链接跳转原生APP

一、URL Schemes是什么？

url schemes：页面跳转协议

组成: [scheme:][authority][path][?query][#fragment]

scheme : 协议名称 - 必须

host : 协议地址 - 必须

port : 协议的端口，可以不填

path : 协议路径，可用 / 连接多个

query : 携带的参数可用 & 连接多个

fragment : 锚点

通过定义自己的scheme协议，可以非常方便跳转app中的各个页面；

通过scheme协议，服务器可以定制化告诉App跳转到APP内部页面。

栗子1：http://baidu:8080/news?system=pc&id=45464

栗子2：alipays://platformapi/startapp?appId=20000067

二、Universal Link是什么？

Universal Link 是 Apple 在 WWDC 2015 上为 iOS 9 引入的一个新功能，是通过传统HTTP链接来启动App的新技术。可以使用相同的网址打开网站和App。 通过唯一的网址，就可以链接到App中具体的视图，不需要特殊的Scheme。如果用户没有安装App则链接到对应的普通网页。

栗子： https://company.jiajuxy.com/?’+window.location.hash

三、解决方案

1.callapp-lib（第三方依赖）

开箱即用的callapp-lib
使用文档参考
callapp-lib使用

## Install

Install with [npm](https://www.npmjs.com/):

```sh
npm install --save callapp-lib

Usage

const CallApp = require('callapp-lib');

or;

import CallApp from 'callapp-lib';

callapp-lib 同样支持 script 加载，你可以使用下面的 cdn 文件（地址在下面的示例中），也可以下载 dist/index.umd.js 到你的项目中，index.umd.js 会暴露一个全局变量 CallApp ，这个全局变量和上面 commonjs 导入的 CallApp 内容是一致的，使用方法也是一致的。

2.第三方集成MobLink

此项方式需要原生端配合生成集成
moblink使用教程入口

3.朴素的按钮（手动写）

---

总结

可以通过三种方式实现，按需求取舍！ 谢谢观看！如有不对，欢迎指证！