uni-app打开淘宝、京东，并跳转到对应的商品链接MEve的博客-uniapp怎么打开淘宝

最近因为需要开发一个跨平台的app，最终选定了uni-app，记录一下学习过程中遇到的一些问题。

要实现在app中打开淘宝、京东、应用商店，并跳转到对应商品的功能。

打开淘宝，按照官方的例子就可以

需要注意的是，打开京东时，需要添加一些参数，才能够实现跳转到对应商品。这个方法是在uni-app社区看到的。

直接复制下方代码，即可运行

 <template>  <view class="content">   <button  @click="handleOpenJingdong">打开京东</button>   <button  @click="handleOpenTaobao">打开淘宝</button>   <button  @click="handleOpenShop">应用商店</button>  </view> </template>  <script>  export default {   methods: {    /**     * 打开淘宝     */    handleOpenTaobao() {     // 淘宝的商品链接，换成需要访问的地址     let url = "https://detail.tmall.com/item.htm?spm=a230r.1.14.1.3d4b76f0LV6kFy&id=605165654577&ns=1&abbucket=6";     let openUrl = url;     // 因为 url 一般是从其它地方获取的，所以这里要将 http 和 https 删去     // 也可以直接输入 https:// 之后的内容，则不需要此步判断，直接调用 plus.runtime.openURL     if (url.substr(0, 5) === 'https') {      openUrl = `taobao://${url.substr(8)}`;     } else if (url.substr(0, 4) === 'http') {      openUrl = `taobao://${url.substr(7)}`;     }     plus.runtime.openURL(openUrl, function(res) {      uni.showModal({       content: '本机未检测到对应客户端，是否打开浏览器访问页面？',       success: function(res) {        if (res.confirm) {         plus.runtime.openURL(url);        }       }      });     });    },    /**     * 打开京东     */    handleOpenJingdong() {     // 京东的商品链接     let url = "https://item.jd.com/1110592.html";     let openUrl = url;     if (url.substr(0, 5) === 'https') {      // 按照打开淘宝的方式打开京东，会出现无法跳转到对应的商品链接的问题      // 这里需要添加上参数，这样就能够正确跳转，这个方法是在uni-app社区看到的      let data = {category:'jump', des:'getCoupon',url: url.substr(8)}      openUrl = `openApp.jdMobile://virtual?params=${JSON.stringify(data)}`;     } else if (url.substr(0, 4) === 'http') {      let data = {category:'jump', des:'getCoupon',url: url.substr(7)}      openUrl = `openApp.jdMobile://virtual?params=${JSON.stringify(data)}`;     }     plus.runtime.openURL(openUrl, function(res) {      uni.showModal({       content: '本机未检测到对应客户端，是否打开浏览器访问页面？',       success: function(res) {        if (res.confirm) {         plus.runtime.openURL(url);        }       }      });     });    },    /**     * 打开应用商店     */    handleOpenShop() {     let appurl = '';     // 这个是通用应用市场，如果想指定某个应用商店，需要单独查这个应用商店的包名或scheme及参数     // 下文提供了几个常见的应用商店的scheme     if (plus.os.name=="Android") {           appurl = "market://details?id=io.dcloud.hellouniapp";        }       else{           appurl = "itms-apps://itunes.apple.com/cn/app/hello-uni-app/id1417078253";       }     plus.runtime.openURL(appurl, function(res) {      uni.showModal({       content: '本机未检测到对应客户端，是否打开浏览器访问页面？',       success: function(res) {        if (res.confirm) {         plus.runtime.openURL(url);        }       }      });     });    }   }  } </script>  <style>  .content {   display: flex;   flex-direction: column;   align-items: center;   justify-content: center;  } </style> 

另外记录一下常用的url scheme

这里参考了文章 https://ask.dcloud.net.cn/article/35621

 [        {           name: 'App Store',           scheme: 'itms-apps://'       },       {           name: '支付宝',           pname: 'com.eg.android.AlipayGphone',           scheme: 'alipay://'       },       {           name: '淘宝',           pname: 'com.taobao.taobao',           scheme: 'taobao://'       },       {           name: 'QQ',           pname: 'com.tencent.mobileqq',           scheme: 'mqq://'       },       {           name: '微信',           pname: 'com.tencent.mm',           scheme: 'weixin://'       },       {           name: '京东',           pname: 'com.jingdong.app.mall',           scheme: 'openApp.jdMobile://'       },       {           name: '新浪微博',           pname: 'com.sina.weibo',           scheme: 'sinaweibo://'       },       {           name: '优酷',           pname: 'com.youku.phone',           scheme: 'youku://'       }   ]  

应用商店的

 xiaomi: {     scheme: "mimarket://details?id=com.xx.xx" }, samsung: {     scheme: "samsungapps://ProductDetail/com.xx.xx" }, huawei: {     scheme: "appmarket://details?id=com.xx.xx" }, oppo: {     scheme: "oppomarket://details?packagename=com.xx.xx", }, vivo: {     scheme: "vivomarket://details?id=com.xx.xx" }