zoukankan      html  css  js  c++  java
  • vue+h5 plus 第三方登录

    
    
    html:
    
    <div class="box" style="margin-top:0;" @click="getLogin('weixin')">微信登录</div>
    <div class="box" style="margin-top:0;" @click="getLogin('qq')">QQ登录</div>
    <div class="box" style="margin-top:0;" @click="getLogin('sinaweibo')">微博登录</div>



    data:
    
    oauth: null,
    auths: !window.localStorage.getItem('auths') ? null : JSON.parse(window.localStorage.getItem('auths')),
    Params: {}, // 第三方登录参数
    
    
     methods:
      
        //第三方登录
          getLogin(type) {
            this.oauth = type;
            plus.oauth.getServices(success => {
              this.auths = success
              window.localStorage.setItem('auths', JSON.stringify(success))
              this.$toast(`正在获取第三方登录...`);
              this.oauthLogin(type)
            }, error => {
              plus.nativeUI.alert("获取登录授权服务列表失败:" + JSON.stringify(error));
            })
          },
          // 获取登录认证
          oauthLogin(type) {
            console.log('======type' + type);
            var s;
            this.auths.forEach((item, index) => {
              if (this.auths[index].id == type) {
                s = this.auths[index]
              }
            })
            if (!s.authResult) {
              s.login(res => {
                // this.$toast('第一个微信登录')
                this.authUserInfo(type);
              }, error => {
                plus.nativeUI.alert('error' + JSON.stringify(error));
              })
            } else {
              this.authUserInfo(type);
              // this.$toast('第二个微信登录,已授权登录');
            }
          },
          // 获取授权用户信息
          authUserInfo(type) {
            var s;
            this.auths.forEach((item, index) => {
              if (this.auths[index].id == type) {
                s = this.auths[index]
              }
            })
            // console.log('===========s' + JSON.stringify(s));
            if (s.authResult) {
              s.getUserInfo(res => {
                this.Params = {
                  username: s.userInfo.nickname,
                  avatar: s.userInfo.headimgurl,
                  sex: s.userInfo.sex,
                  openid: s.userInfo.openid,
                  longitude: this.longitude,
                  latitude: this.latitude,
                  type: 2
                }
           this.register(s.authResult.openid) console.log(
    this.Params) }, error => { plus.nativeUI.alert(JSON.stringify(error)); this.$toast('失败报错'); }) } },
       //第三方登录
          register(openid){
            let sign;//标记
    
            if(this.oauth == 'weixin'){
              sign = 2;
            }
            if(this.oauth == 'sinaweibo'){
              sign = 3;
            }
            if(this.oauth == 'qq'){
              sign = 4;
            }
            let params = {
              type:sign,//1手机 2微信 3微博 4qq
              wx_openid:sign == 2?openid:'',
              wb_openid:sign == 3?openid:'',
              qq_openid:sign == 4?openid:'',
            }
            this.$post("/user/user/register", params).then(res => {
                if (!res.error_code) {
                    console.log(res.response_data,'res')
                    localStorage.setItem('access_token',res.response_data.access_token);
                    this.getUserInfo()
                } else {
                    this.$toast(res.error_msg);
                    console.log(res.error_msg,'error')
                }
            })
          },
     
    
    
  • 相关阅读:
    [java初探06]__排序算法的简单认识
    [java初探05]__数组的简单认识及Arrays类的常用方法
    [java工具类01]__构建格式化输出日期和时间的工具类
    [Java初探04]__字符串(String类)相关
    [Java初探实例篇02]__流程控制语句知识相关的实例练习
    【Java初探03】——流程控制语句
    iOS ipv6 被拒
    iOS工程中如何去掉第三方的警告
    iOS面试准备之思维导图(转)
    UML图基本类型
  • 原文地址:https://www.cnblogs.com/fanqiuzhuji/p/12888224.html
Copyright © 2011-2022 走看看