vue2 H5页面 调取安卓和IOS方法的记录

为什么要写这篇呢 是因为在vue环境下安卓和IOS方法的交互不一样
安卓我们在vue页面直接调取就可以获取到需要的信息了
IOS就复杂一些 需要先挂载之类的 为了避免忘记再次踩坑 复习一下之前已经上线的项目

例如安卓 window.android.requestLocation()
单独的获取IOS的  window.webkit.messageHandlers.getLocationInfo

    // 选择问题地址
    selectAdd () {
      this.coordinate = []
      if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { //判断iPhone|iPad|iPod|iOS

        clearInterval(this.getiosdizhi)
        this.getiosdizhi = null

        window.webkit.messageHandlers.getLocationInfo.postMessage(null).then(res => {
          this.getiosdizhi = setInterval(this.getdizhi, 3000);
        })

        // IOS方法
      } else if (/(Android)/i.test(navigator.userAgent)) {  //判断Android

        let currentPositon = {};
        var codeindex = process.env.NODE_ENV === "development" ? 200
          : (JSON.parse(window.android.requestLocation())).code

        if (codeindex == 200) {

          var str =
            process.env.NODE_ENV === "development"
              ? {
                aoiName: "当代梦工场",
                city: "信阳市",
                district: "平桥区",
                lat: '32.123274',
                lng: '114.075031',
                poiName: "城管局",
                province: "河南省",
                street: "关南园一路"
              } : (JSON.parse(window.android.requestLocation())).data

          var P = str.lng.toString().length < 9 ? str.lng : str.lng.toString().substring(0, 9)
          var O = str.lat.toString().length < 9 ? str.lat : str.lat.toString().substring(0, 9)

          currentPositon.P = P;
          currentPositon.O = O;

          this.coordinate.push(currentPositon);
          this.currentAddress = `${str.province}${str.city}${str.district}${str.street}${str.poiName}`


        } else {
          this.$toast({
            message: '获取定位失败,请检测是否开启定位权限或GPS信号。'
          });
        }
      }
    },

IOS 需要现在created挂载
  created () {
    window.getLocationInfo = this.getLocationInfo;
    window.getGetrotateInfo = this.getGetrotateInfo;
  },

	然后再methods里面定义
    定位信息 在data里自己定义一个变量接收 message就是IOS返给你的数据
    getLocationInfo (message) {
      this.iosLocation = JSON.parse(message)
    },

	因为方法获取有延迟的问题 所以需要使用定时器来调取 所以需要单独抽出来
	看实际运用有没有延迟 去掉就好啦
    点击获取问题地址时候的IOS方法 
    getdizhi () {
      if (this.iosLocation.code == 200) {
        clearInterval(this.getiosdizhi)
        this.getiosdizhi = null

        let currentPositon = {};

        var str = this.iosLocation


        var P = str.lng.toString().length < 9 ? str.lng : str.lng.toString().substring(0, 9)
        var O = str.lat.toString().length < 9 ? str.lat : str.lat.toString().substring(0, 9)

        currentPositon.P = P;
        currentPositon.O = O;

        // alert(this.iosLocation.addr)

        this.coordinate.push(currentPositon);
        this.currentAddress = this.iosLocation.addr
      } else {

        // alert(this.iosLocation)

        this.$toast({
          message: '获取定位失败,请检测是否开启定位权限或GPS信号。'
        });
      }
    },

这篇好文章是转载于：学新通技术网