H5页面（vue项目）使用LinkedME实现唤起APP的功能

最近开发的混合app要做个分享的功能，需要实现在微信或者qq打开app分享出去的链接能够直接调起手机的app，所以用了LinkedME来实现h5页面唤起app的功能
LinkedME官网就有js集成的文档，按照那个步骤来就可以实现，详情见：官网
但因为我的项目是vue的，所以封装了下来实现这个功能

1.在index.html中引入 JS SDK

<script src="https://static.lkme.cc/linkedme.min.js" ></script>

因为它这个js sdk会不定时的更新，建议直接引用线上的版本

2.创建linkedme.js

在你的项目里面创建linkedme.js，以下是封装的代码

let LinkedME_KEY = ''		//这是你在官网网站注册账号，创建应用后生成的LinkedME Key
let linkedmeType = "live";
let defaultData = {};
defaultData.type = linkedmeType; //线上模式,填写"test"表示测试模式.【可选】
//这些参数在官网上都有详细的说明
defaultData.feature = "功能名称"; 
defaultData.stage = "阶段名称"; 
defaultData.channel = "渠道名称"; 
defaultData.tags = "标签名称"; 
defaultData.ios_custom_url = ""; 
defaultData.android_custom_url = ""; 

// 下面是自定义深度链接参数，用户点击深度链接打开app之后，params参数将被带入app，你可以通过这些参数跳到app里对应的页面
export default function(obj) {
    if (window.linkedme.LinkedME_KEY !== LinkedME_KEY) {
        window.linkedme.init(LinkedME_KEY, { type: linkedmeType }, null);
    }
    obj = obj || {}
    let str = '';
    for (let k in obj) {
        str += `"${k}":"${obj[k]}",`
    }
    str = str.slice(0, -1)
    let params = `{${str}}`
    return new Promise((resolve, reject) => {
        window.linkedme.link({
            ...defaultData,
            ... { params: params },
        }, function(err, data) {
            if (err) {
                console.log(err)
                reject(err)
            } else {
                /*
                 生成深度链接成功，深度链接可以通过data.url得到，
                 将深度链接绑定到标签，这样当用户点击这
                 个深度链接，如果是在pc上，那么跳转到深度链接二维
                 码页面，用户用手机扫描该二维码就会打开app；如果
                 在移动端，深度链接直接会根据手机设备类型打开ios
                 或者安卓app
                 */
                resolve(data)
            }
        }, false);

    });
}

3.在页面引入linkedme.js

<template>
  <div class="share-header">
      <a class="open" :href="hrefUrl" id=“open_header”>
          打开
      </a>
  </div>
</template>

<script>
import linkedmeLink from '@/utils/libs/linkedme';
  export default {
    name: "share-header",
    data() {
        return {
            hrefUrl:''
        }
    },
    mounted() {
        linkedmeLink({
        //这里面传你要携带的自定义参数
			id: '',
			type: ''
		}).then(res => {
            this.hrefUrl = res.url;
            //后面他们官方文档添加了trigger_deeplink
            //分享个做ios时遇到的问题，ios版分享的时候点击外链会先跳到APP store，然后再手动点击打开APP，这样整个跳转的流程就多了一步，后面和客户端的小伙伴研究了好久还和linked me的研发人员沟通才发现他们的文档后续做了更新，在生成url的时候除了给a标签赋值href外还要给a标签添加addEventListener来调用linkedme.trigger_deeplink方法
            var open_header= document.getElementById("open_header");
            open_header.addEventListener("click",function(){
                linkedme.trigger_deeplink(res.url);
            })
        });
    },
    methods: {
      
    }
  }