美文网首页
vue2.0微信公众号开发,ios下调用微信内置地图失败

vue2.0微信公众号开发,ios下调用微信内置地图失败

作者: rain129 | 来源:发表于2019-03-27 17:08 被阅读0次

    项目背景:vue2.0,路由为hash模式

    问题描述:微信公众号开发,调起微信内置地图、安卓一切正常,ios下会调用失败

    解决方法:

    首先确保自己签名算法正确,jsconfig都配置正确

    1.经纬度必须是number类型的值,不能是 字符串
    2.IOS中jsconfig的url地址使用“#”(路由为hash模式)前面的路径
    window.location.href.split('#')[0]

    下面贴出自己的代码(代码不全,只贴出上面说到两条问题的处理代码)

    //调起微信内置地图方法
    openWxMap(ev){
                    const that = this;
                    const appId = sessionStorage.getItem('appId');
                    const position = ev.target.dataset;
                    //const url = window.location.href;
                    const url = window.location.href.split('#')[0]; //解决ios下无法调起内置地图问题
                    const lat = parseFloat(position.lat); //转为number类型值
                    const lng = parseFloat(position.lng);//转为number类型值
                    const name = position.name;
                    const addres = position.address;
                    //getJsConfig方法是自己封装的方法
                    that.$request.getJsConfig({appid:appId, jsurl: url}, res => {
                        const data = res;
                        that.$helper.wxConfig(data, () => {
                            wx.openLocation({
                                latitude: lat, // 纬度,浮点数,范围为90 ~ -90
                                longitude: lng, // 经度,浮点数,范围为180 ~ -180。
                                name: name, // 位置名
                                address: addres, // 地址详情说明
                                scale: 15, // 地图缩放级别,整形值,范围从1~28。默认为最大
                                infoUrl: '' // 在查看位置界面底部显示的超链接,可点击跳转
                            });
                        });
                    })
                },
    

    相关文章

      网友评论

          本文标题:vue2.0微信公众号开发,ios下调用微信内置地图失败

          本文链接:https://www.haomeiwen.com/subject/mjzgmqtx.html