共计 4840 个字符，预计需要花费 13 分钟才能阅读完成。
导语：在日常开发过程中，咱们常常能够碰到很多的调起某个利用，关上唤醒某个 APP，链式启动 App 等场景，背地就波及到了 URLScheme 协定的相干常识，上面就简略介绍一下。
目录
- 简介
- 常见 URL Scheme
- 跳转办法
- 实战演练
- 案例展现
简介
URL Scheme是一个能够让 APP 之间相互跳转的协定，每个 APP 都有本人的 URL Scheme，如果存在雷同的 URL Scheme，会先跳转先装置的 APP，前面装置的会被笼罩掉。
协定格局
[scheme]://[host][:port]/[/path]?[query]
- scheme: 协定名称，由开发人员自定义
- host: 域名
- port: 端口
- path: 页面门路
- query: 申请参数
例如淘宝：taobao://
设施判断
// 游览器标识
const ua = navigator.userAgent.toLowerCase();
// 是否微信内
const isWeixin = ua.indexOf("micromessenger") !== -1;
// 是否 android 终端
const isAndroid = /(Android)/i.test(ua);
// 是否 ios 终端
const isIOS = /(iPhone|iPad|iPod|iOS|Mac)/i.test(ua);常见 URL Scheme
利用市场
- market 谷歌利用商店
- tmast 利用宝
- mimarket 小米
- samsungapps 三星
- huawei 华为
- oppomarket oppo
- vivomarket vivo
- itms-apps ios
电商
- taobao 淘宝
- tmall 天猫
- jdlogin 京东
- pinduoduo 拼多多
- kaola 网易考拉
- yanxuan 网易严选
- vipshop 唯品会
- suning 苏宁
- mishopv1 小米商城
- wireless1688 阿里巴巴
社交、社区
- weibo 微博
- zhihu 知乎
- xhsdiscover 小红书
- momochat 陌陌
- blued blued
- mqzone QQ 空间
- mqq QQ
- tantanapp 探探
- huputiyu 虎扑
- com.baidu.tieba 贴吧
- tianya 天涯社区
- douban 豆瓣
- jike 即刻
短视频
- snssdk1128 抖音
- snssdk1112 火山
- snssdk32 西瓜视频
- gifshow 快手
视频 / 直播
- tenvideo 腾讯视频
- youku 优酷
- bilibili B 站
- imgotv 芒果 TV
- qiyi-iphone 爱奇艺
- hanju 韩剧 TV
- douyutv 斗鱼
- yykiwi 虎牙
图片解决
- mtxx.open 美图秀秀
- faceu faceu 国内
- ulike 轻颜国内
资讯
- snssdk141 今日头条
- newsapp 网易新闻
- qqnews 腾讯新闻
- iting 喜马拉雅
- weread 微信读书
- jianshu 简书
- igetApp 失去
- kuaikan 快看漫画
财经
- sinanews 新浪财经
- amihexin 同花顺炒股
音乐
- orpheus 网易云音乐
- qqmusic qq 音乐
- kugouURL 酷狗
- qmkege 全民 K 歌
- changba 唱吧
工具
- iosamap 高德地图
- baidumap 百度地图
- baiduyun 百度网盘
- rm434209233MojiWeather 墨迹天气
办公
- wxwork 企业微信
- dingtalk 钉钉
生存
- imeituan 美团
- dianping 点评
- cainiao 菜鸟裹裹
- wbmain 58 同城
- mihome 米家
美食佳饮
- xcfapp 下厨房
- sbuxcn 星巴克中国
- meituanwaimai 美团外卖
静止衰弱
- fb370547106731052 小米静止
- meetyou.linggan 美柚
- babytree 宝宝树
- keep keep
旅行
- CtripWireless 携程
- diditaxi 滴滴
- taobaotravel 飞猪
- travelguide 马蜂窝
游戏
- tencent1104466820 王者光荣
- tencent100689805 天天爱打消
- tencent382 QQ 斗地主
跳转办法
应用程序相互跳转办法
以下是 uniapp 跳转利用的关上通用办法。
// 启动 app
function startApp(url) {
// #ifdef H5
window.open(url);
// #endif
// #ifdef APP-PLUS
if (plus) {plus.runtime.openURL(url, (res) => {console.log("res:", res);
});
}
// #endif
}uniapp 利用能够在 manifest.json 配置文件中设置：
//...
{
"app-plus": {
"distribute": {
"android": {"schemes": "hello"}
}
}
}
//...跳转到微信小程序
- URL Scheme：用于获取小程序 scheme 码，实用于短信、邮件、内部网页、微信内等拉起小程序的业务场景，目前仅针对国内非集体主体的小程序凋谢；
- URL Link：获取小程序 URL Link，实用于短信、邮件、网页、微信内等拉起小程序的业务场景，目前仅针对国内非集体主体的小程序凋谢；
- Short Link：获取小程序 Short Link，实用于微信内拉起小程序的业务场景。目前只凋谢给电商类目(具体蕴含以下一级类目：电商平台、商家自营、跨境电商)。通过该接口，能够抉择生成到期生效和永恒无效的小程序短链；
- wx-open-launch-weapp：用于页面中提供一个可跳转指定小程序的按钮。应用此标签后，用户需在网页内点击标签按钮方可跳转小程序；已认证的服务号和已认证的非集体主体的小程序；
微信凋谢标签
- 绑定域名：登录微信公众平台进入“公众号设置”的“性能设置”里填写“JS 接口平安域名”。
- 引入 JS 文件：在须要调用 JS 接口的页面引入如下 JS 文件 https://res2.wx.qq.com/open/js/jweixin-1.6.0.js，反对应用 AMD/CMD 规范模块加载办法加载。
- 通过 config 接口注入权限验证配置并申请所需凋谢标签，所有须要应用凋谢标签的页面必须先注入配置信息，并通过 openTagList 字段申请所须要的凋谢标签，否则将无奈应用（同一个 url 仅需调用一次）；
- 获取配置
function getConfig () {
wx.config({
debug: true, // 开启调试模式, 调用的所有 api 的返回值会在客户端 alert 进去，若要查看传入的参数，能够在 pc 端关上，参数信息会通过 log 打出，仅在 pc 端时才会打印
appId: '', // 必填，公众号的惟一标识
timestamp: , // 必填，生成签名的工夫戳
nonceStr: '', // 必填，生成签名的随机串
signature: '',// 必填，签名
jsApiList: [], // 必填，须要应用的 JS 接口列表
openTagList: [] // 可选，须要应用的凋谢标签列表，例如['wx-open-launch-app']
});
// 验证通过
wx.ready(function () {// config 信息验证后会执行 ready 办法，所有接口调用都必须在 config 接口取得后果之后，config 是一个客户端的异步操作，所以如果须要在页面加载时就调用相干接口，则须把相干接口放在 ready 函数中调用来确保正确执行。对于用户触发时才调用的接口，则能够间接调用，不须要放在 ready 函数中});
wx.error(function (res) {// config 信息验证失败会执行 error 函数，如签名过期导致验证失败，具体错误信息能够关上 config 的 debug 模式查看，也能够在返回的 res 参数中查看，对于 SPA 能够在这里更新签名});
}- 页面嵌入标签
<wx-open-launch-weapp
id="launch-btn"
appid="wx12345678"
path="pages/home/index?user=123&action=abc">
<script type="text/wxtag-template">
<style>.btn {padding: 12px}</style>
<button class="btn"> 关上小程序 </button>
</script>
</wx-open-launch-weapp>// 点击跳转操作
let btn = document.getElementById("launch-btn");
btn.addEventListener("launch", function (e) {console.log("success");
});
btn.addEventListener("error", function (e) {console.log("fail", e.detail);
});留神：有时候报错，能够采纳判断是否微信内置游览器环境，而后动静增加 script 标签形式进行嵌入网页。
async function addOpenScript() {const ua = navigator.userAgent.toLowerCase();
const isWxwork = ua.match(/wxwork/i) == "wxwork";
const isWeixin = !isWxwork && ua.match(/micromessenger/i) == "micromessenger";
if (isWeixin) {const wxOpen = document.createElement("script");
wxOpen.type = "text/javascript";
wxOpen.src = "https://res2.wx.qq.com/open/js/jweixin-1.6.0.js";
wxOpen.onload = getConfig;
document.body.appendChild(wxOpen);
}
}URL Scheme
- 调用接口
POST https://api.weixin.qq.com/wxa/generatescheme?access_token=ACCESS_TOKEN- 胜利返回
{
"errcode": 0,
"errmsg": "ok",
"openlink": Scheme,
}URL Link
- 调用接口
POST https://api.weixin.qq.com/wxa/generate_urllink?access_token=ACCESS_TOKEN- 胜利返回
{
"errcode": 0,
"errmsg": "ok",
"url_link": "URL Link"
}Short Link
- 调用接口
POST https://api.weixin.qq.com/wxa/genwxashortlink?access_token=ACCESS_TOKEN- 胜利返回
{
"errcode": 0,
"errmsg": "ok",
"link": "Short Link"
}实战演练
上面就写一个简略的页面来看一下成果。
模板局部
<view class="openapp-box">
<!-- #ifdef H5 -->
<button class="openapp-item" @click="openApp"> 关上谷歌利用市场 </button>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<button class="openapp-item" @click="openApp"> 关上谷歌利用市场 </button>
<!-- #endif -->
</view>款式局部
.openapp-box {
box-sizing: border-box;
padding: 30rpx;
.openapp-item {margin-bottom: 30rpx;}
}脚本局部
// 关上 app
function openApp() {
let url = "market://details?id=dev.hello";
proxy.$apis.utils.startApp(url);
}案例展现
- H5 端
如果 URL Scheme 协定地址不存在，则会报错。
- APP 端
最初
以上就是 URLScheme 协定常识总结的次要内容，有不足之处，请多多斧正。
正文完
