vue：h5实现微信授权

先在main.js中设置全局的项目地址 方便在其他页面调用

Vue.prototype.globalVerb={

openMpOpenPlatformHost:"http://afopen.afarsoft.com"

}

1、先调用本地接口获取到后端提供的初始用户信息

getInfo() {
      This.http.get(“接口地址xxx”,{
params:{...})
.then(res => {
        console.log(res.Result);
        if (res.Result.Data) {
          this.appId = res.Result.Data.MpAppId;
          this.img = res.Result.Data.MpHeadImg;
          this.NickName = res.Result.Data.MpNickName;
          this.UserName = res.Result.Data.UserName;
        }
      });
    },

2 、授权页面点击按钮调取授权接口，按照如下格式拼接url

http://test.crm.afarsoft.com/WeChatSynchronization?nickname=1&headimg=https%3A%2F%2Fss1.baidu.com%2F6ONXsjip0QIZ8tyhnq%2Fit%2Fu%3D1750833952,2529388352%26fm%3D58%26bpow%3D380%26bpoh%3D380&appid=3&username=4&qrcode=https%3A%2F%2Fss1.baidu.com%2F6ONXsjip0QIZ8tyhnq%2Fit%2Fu%3D1750833952,2529388352%26fm%3D58%26bpow%3D380%26bpoh%3D380

btn() {
     var host = request.defaults.baseURL;
              if(/^\//g.test(host)){
                host=window.location.protocol + "//" + window.location.host+host;
              }
      var notifyUrl = encodeURIComponent(
        this.baseURL + "/api/mp/mpeventhandler"
    //baseUrl 在http.js里，所以要在该授权页面引入http
      );
      var returnUrl = encodeURIComponent(
        window.location.protocol +
          "//" +
          window.location.host +
          this.$route.fullPath
      );
      window.location =
        this.globalVerb.openMpOpenPlatformHost +
        "/home/index?returnurl=" +
        returnUrl +
        "&notifyurl=" +
        notifyUrl +
        "&type=mp";
    }

3、更新用户信息

updateInfo(query) {
      this.appId = query.appid;
      this.img = query.headimg;
      this.NickName = query.nickname;
      this.UserName = query.username;
      this.qrCode = query.qrcode;
      This.http.post(“接口地址xxx”,{
        MpAppId: this.appId,
        MpNickName: this.NickName,
        MpHeadImg: this.img,
        UserName: this.UserName,
        MpQrcode: this.qrCode
      })
.then(res => {
        console.log(res.Result);
      });
    },

4、判断状态

 created() {
    var query = this.$router.currentRoute.query;
    if (query.nickname) {
      this.updateInfo(query);
    } else {
      this.getInfo();
    }
  }