vue项目H5调起高德或百度地图手机应用，或调起高德百度网页版实现导航功能（已实现）

需求说明：H5实现唤起高德和百度地图导航到目标景点的功能

分析：用户通过点击选择使用百度还是高德地图，点击后调用guide方法，判断设备上是否有高德或者百度APP，有就直接调用APP，如果没有就调用网页版

实现效果

实现代码

//导航
guide(signMap) {
        let self = this;
        if (self.partnerAddress && self.partnerAddress != '') {
            //景点位置partnerAddress 景点经纬度lng lat
            var lng = self.lng;
            var lat = self.lat;
            if (signMap == 'gd') {
                // 高德地图
                if (self.customBrowserVersion().android) {
                    window.location.href = "androidamap://viewMap?sourceApplication=appname&poiname=" + self.partnerAddress +
                        "&lat=" + lat + "&lon=" + lng + "&dev=0";
                    //判断是否跳转
                    setTimeout(function () {
                        let hidden = window.document.hidden || window.document.mozHidden || window.document.msHidden ||
                            window.document.webkitHidden
                        if (typeof hidden == "undefined" || hidden == false) {
                            //调用高德地图
                            window.location.href = "https://uri.amap.com/marker?position=" + lng + "," + lat +
                                "&name=" + self.partnerAddress;
                        }
                    }, 2000);
                } else if (self.customBrowserVersion().ios) {
                    window.location.href = "iosamap://viewMap?sourceApplication=appname&poiname=" + self.partnerAddress +
                        "&lat=" + lat + "&lon=" + lng + "&dev=0";
                    //判断是否跳转
                    setTimeout(function () {
                        let hidden = window.document.hidden || window.document.mozHidden || window.document.msHidden ||
                            window.document.webkitHidden
                        if (typeof hidden == "undefined" || hidden == false) {
                            //调用高德地图
                            window.location.href = "https://uri.amap.com/marker?position=" + lng + "," + lat +
                                "&name=" + self.partnerAddress;
                        }
                    }, 2000);
                }
            } else if (signMap == 'bd') {
                // 百度地图
                if (self.customBrowserVersion().android) {
                    //安卓操作系统
                    let d = new Date();
                    let t0 = d.getTime();
                    window.location.href = "androidamap://viewMap?sourceApplication=appname&poiname=" + self.partnerAddress +
                        "&lat=" + lat + "&lon=" + lng + "&dev=0";
                    //由于打开需要1～2秒，利用这个时间差来处理－－打开app后，返回h5页面会出现页面变成app下载页面，影响用户体验
                    var delay = setInterval(function () {
                        var d = new Date();
                        var t1 = d.getTime();
                        if (t1 - t0 < 3000 && t1 - t0 > 2000) {
                            window.location.href = "http://api.map.baidu.com/marker?location=" + lat + "," +
                                lng + "&title=" + self.partnerAddress +
                                "&content=景点&output=html&src=webapp.baidu.openAPIdemo";
                        }
                        if (t1 - t0 >= 3000) {
                            clearInterval(delay);
                        }
                    }, 1000);
                }
                if (self.customBrowserVersion().ios) {
                    //ios操作系统
                    let d = new Date();
                    let t0 = d.getTime();
                    window.location.href = "iosamap://viewMap?sourceApplication=appname&poiname=" + self.partnerAddress +
                        "&lat=" + lat + "&lon=" + lng + "&dev=0";
                    //由于打开需要1～2秒，利用这个时间差来处理－－打开app后，返回h5页面会出现页面变成app下载页面，影响用户体验
                    let delay = setInterval(function () {
                        var d = new Date();
                        var t1 = d.getTime();
                        if (t1 - t0 < 3000 && t1 - t0 > 2000) {
                            window.location.href = "http://api.map.baidu.com/marker?location=" + lat + "," +
                                lng + "&title=" + self.partnerAddress +
                                "&content=景点&output=html&src=webapp.baidu.openAPIdemo";
                        }
                        if (t1 - t0 >= 3000) {
                            clearInterval(delay);
                        }
                    }, 1000);
                }
            }
        } else {
            this.$toast.showToast('暂不知道该景区位置')
        }
    },
    //区分设备
    customBrowserVersion() {
        var u = navigator.userAgent;
        return {
            trident: u.indexOf('Trident') > -1, //IE内核
            presto: u.indexOf('Presto') > -1, //opera内核
            webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
            gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
            mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
            ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
            android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
            iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
            iPad: u.indexOf('iPad') > -1, //是否iPad
            webApp: u.indexOf('Safari') == -1, //是否web应用程序，没有头部与底部
            weixin: u.indexOf('MicroMessenger') > -1, //是否微信 （2015-01-22新增）
            qq: u.match(/\sQQ/i) == " qq", //是否QQ
            isBaidu: u.indexOf('baiduboxapp') !== -1, //是否为百度浏览器
            isqqBrowser: u.indexOf('mqqbrowser') !== -1, //是否为qq浏览器
            isWxBrowser: u.indexOf('micromessenger') !== -1, //是否为微信浏览器
            isUc: u.indexOf('ucbrowser') !== -1, //是否为uc浏览器
        };
    },