vue项目hbuilder打包-微信登录调取手机微信登录权限

这个笔记得做好。

1.vue页面的点击事件

import {login,loginy,wxLog,wxLogin,logout} from '../network/login'

wxloginBtn() {

          let _this = this

          wxLog()                               //调取微信登录页面的js方法

          this.alertSzTipsFlage = true

          this.tips = '正在登录...'

          setTimeout(function () {

                _this.alertSzTipsFlage = false

          }, 1500)

          this.wxLoginUserInfo()

        },

        wxLoginUserInfo(){

          let _this = this

          let userInfo = localStorage.getItem("wxUserInfo")              //拾取在js页面localStorage存储到用户信息

          if (null != userInfo) {

            userInfo = JSON.parse(userInfo)

            wxLogin(userInfo).then(res => {                                       //这里是常规登录部分，这里传递的参数userInfo的openid，nickname，headimgurl

              if (res.token) {

                window.localStorage.setItem("user", JSON.stringify(res))

                this.alertSzTipsFlage = true

                this.tips = '微信登录成功'

                setTimeout(function () {

                  _this.alertSzTipsFlage = false

                  _this.$router.push('/index')

                }, 1500)

              } else {

                this.alertSzTipsFlage = true

                this.tips = '微信登录失败'

                setTimeout(function () {

                    _this.alertSzTipsFlage = false

                }, 1500)

              }

            })

          }else {

            this.alertSzTipsFlage = true

            this.tips = '微信登录失败'

            setTimeout(function () {

                _this.alertSzTipsFlage = false

            }, 1500)

          }

        }

2.拾取到用户微信登录信息后调用登录接口

export function wxLogin(userInfo) {

  return request({

    url:'/api/weChatLogin',

    data:{

      "mobile":userInfo.openid,

      "nickname":userInfo.nickname,

      "logo":userInfo.headimgurl

    },

    method:'post',

    headers:{

      'post':{'Content-Type': 'application/json;charset=UTF-8'}

    }

  })

}

至此微信登录成功

3.之前js页面是如何拿取到用户登录权限并存储微信登录权限的？在2.下面粘贴复制：

export function wxLog(){

  let self = this;

  getService()

  // 微信授权登录对象

  let aweixin = null;

  // 当前环境支持的所有授权登录对象

  let auths = null;

  // 获取登录授权认证服务列表，单独保存微信登录授权对象

  function getService(){

    plus.oauth.getServices(function(services){

      //plus.nativeUI.alert("services:"+JSON.stringify(services));

      auths = services;

      authLogin()

    }, function(e){

      plus.nativeUI.alert("获取登录授权服务列表失败，请稍后重试");

      plus.nativeUI.alert("获取登录授权服务列表失败："+JSON.stringify(e));

    } );

  }

  // 获取微信登录授权对象后可进行登录认证操作

  function authLogin(){

    for(let i = 0; i < auths.length; i++){

      if(auths[i].id == 'weixin'){

        aweixin = auths[i];

        break;

      }

    }

    if(!aweixin){

      plus.nativeUI.alert("当前环境不支持微信登录");

      return;

    }

    if(!aweixin.authResult){

      aweixin.login(function(e){

        //plus.nativeUI.alert("登录认证成功!"+JSON.stringify(e));

        authUserInfo()

      }, function(e){

        //plus.nativeUI.alert("登录认证失败: "+JSON.stringify(e));

      } );

    }else{

      authUserInfo()

      console.log("已经登录认证!");

    }

  }

  // 获取微信登录授权对象后获取用户信息操作

  function authUserInfo(){

    if(!aweixin){

      plus.nativeUI.alert("当前环境不支持微信登录");

      return;

    }

    if(aweixin.authResult){

      aweixin.getUserInfo( function(e){

        //登录成功处理

        //plus.nativeUI.alert("获取用户信息成功："+JSON.stringify(aweixin.userInfo));

        window.localStorage.setItem("wxUserInfo", JSON.stringify(aweixin.userInfo));

        authLoginOut(); //注销登录防止切换账号获取到旧信息

      }, function(e){

        console.log("获取用户信息失败： "+JSON.stringify(e));

      } );

    }else{

      plus.nativeUI.alert("未登录认证!");

    }

  }

  // 注销登录认证

  function authLoginOut(){

    if(!aweixin){

      plus.nativeUI.alert("当前环境不支持微信登录");

      return;

    }

    aweixin.logout(function(e){

      // plus.nativeUI.alert("注销登录认证成功!"+JSON.stringify(e));

    }, function(e){

      console.log("注销登录认证失败: "+JSON.stringify(e));

    });

  }

}