Ver Fonte

修改登录

修改登录
dangyunlong há 3 meses atrás
pai
commit
52f29d4733
3 ficheiros alterados com 199 adições e 40 exclusões
  1. 57 10
      src/store/modules/user.js
  2. 39 5
      src/utils/auth.js
  3. 103 25
      src/views/login/index.vue

+ 57 - 10
src/store/modules/user.js

@@ -1,6 +1,7 @@
 import { login, logout, getInfo, getMenu ,getImgCode,updateUserAvatarNickname } from '@/api/user'
-import { getToken, setToken, setUserUrl, removeToken ,removUserUrl,getUserUrl } from '@/utils/auth'
+import { getToken, setToken, setUserUrl, removeToken ,removUserUrl,getUserUrl,getUseType,removUseType,setUseType,getExp,setExp,removeExp } from '@/utils/auth'
 import router, { resetRouter } from '@/router'
+import axios from 'axios'
 
 const state = {
   token: getToken(),
@@ -11,6 +12,8 @@ const state = {
   userid:'',
   role_id:'',
   userurl: getUserUrl(),
+  usertype: getUseType(),
+  exp:getExp(),
 }
 
 const mutations = {
@@ -20,6 +23,9 @@ const mutations = {
   SET_URL: (state, url) => {
     state.userurl = url
   },
+  SET_USE_TYPE: (state, user_type) => {
+    state.usertype = user_type
+  },
   SET_INTRODUCTION: (state, introduction) => {
     state.introduction = introduction
   },
@@ -38,10 +44,12 @@ const mutations = {
   SET_USERID: (state, id) => {
     state.userid = id
   },
+  SET_EXP: (state, exp) => {
+    state.exp = exp
+  },
   // 退出登录逻辑直接放在 mutations 中
   LOGOUT(state) {
     state.token = '';
-    state.userurl = '';
     state.roles = [];
     state.userid = '';
     state.role_id = '';
@@ -51,26 +59,58 @@ const mutations = {
     removeToken();
     removUserUrl();
     resetRouter();
+    removUseType();
+    removeExp();
+    //退出登录跳转回原网站
+    window.location.href = "http://" + state.userurl
   }
 }
 
 const actions = {
   // 用户登录
   login({ commit }, userInfo) {
-    const { username, password, type, captcha } = userInfo
+    const { username, password, type, captcha, code } = userInfo
+
+    //会员登录进入系统并储存
+    if(userInfo.userurl){
+      //设置axios请求头
+      axios.defaults.headers.common['userurl'] = userInfo.userurl
+    }
+    //会员登录不进入系统
+    if(userInfo.backurl){
+      //设置axios请求头
+      axios.defaults.headers.common['userurl'] = userInfo.backurl
+    }
+    
     return new Promise((resolve, reject) => {
-      login({ username: username.trim(), password: password, type: type, captcha: captcha.trim() }).then(response => {
+      login({ username: username.trim(), password: password, type: type, captcha: captcha.trim(), code: code}).then(response => {
         const { data } = response;
-        //设置token
-        setToken(data.token,data.exp)
-        commit('SET_TOKEN',data.token)
-        //如果用户登录携带了userurl 就存起来
+
+        //会员登录跳转 但不储存
+        if(userInfo.backurl){
+          //设置用户url
+          setUserUrl(userInfo.backurl,data.exp)
+          commit('SET_URL',userInfo.backurl)
+          //只设置token 不储存url
+          setToken(data.token,data.exp)
+          commit('SET_TOKEN',data.token)
+          //储存过期时间
+          setExp(data.exp,data.exp)
+          commit('SET_EXP',data.exp)
+        }
+
+        //会员登录进入系统,储存所属url
         if(userInfo.userurl){
-          //设置backurl
           setUserUrl(userInfo.userurl,data.exp)
           commit('SET_URL',userInfo.userurl)
+          //设置token
+          setToken(data.token,data.exp)
+          commit('SET_TOKEN',data.token)
+          //储存过期时间
+          setExp(data.exp,data.exp)
+          commit('SET_EXP',data.exp)
         }
-      
+        
         resolve(response)
       }).catch(error => {
         reject(error)
@@ -101,6 +141,12 @@ const actions = {
         commit('SET_AVATAR', avatar)
         commit('SET_INTRODUCTION', introduction)
         commit('SET_ROLE_ID', role_id)
+        //设置用户等级
+        commit('SET_USE_TYPE',data.type_id)
+        setUseType(data.type_id,state.exp)
+        console.log(data.type_id)
+        console.log(state.exp)
+
         resolve(data)
       }).catch(error => {
         reject(error)
@@ -119,6 +165,7 @@ const actions = {
     })
   },
 
+
   // 用户退出
   // logout({ commit, state, dispatch }) {
   //   return new Promise((resolve, reject) => {

+ 39 - 5
src/utils/auth.js

@@ -2,7 +2,10 @@ import Cookies from 'js-cookie'
 
 const TokenKey = 'Admin-Token'
 const useUrl = 'Back-Url'
+const useType = 'use-Type'
+const expTime = 'exp-time'
 
+//1.设置token
 export function getToken() {
   return Cookies.get(TokenKey)
 }
@@ -12,6 +15,11 @@ export function setToken(token,exp) {
   return Cookies.set(TokenKey, token, { expires: expdays })
 }
 
+export function removeToken() {
+  return Cookies.remove(TokenKey)
+}
+
+//2.设置所属网站
 export function setUserUrl(url,exp) {
   const expdays = convertSecondsToDays(exp)
   return Cookies.set(useUrl, url, { expires: expdays })
@@ -21,15 +29,41 @@ export function getUserUrl() {
   return Cookies.get(useUrl)
 }
 
-export function removeToken() {
-  return Cookies.remove(TokenKey)
-}
-
 export function removUserUrl() {
   return Cookies.remove(useUrl)
 }
 
-//把秒转换成天
+//3.储存用户等级
+export function setUseType(url,exp) {
+  const expdays = convertSecondsToDays(exp)
+  return Cookies.set(useType, url, { expires: expdays })
+}
+
+export function getUseType() {
+  return Cookies.get(useType)
+}
+
+export function removUseType() {
+  return Cookies.remove(useType)
+}
+
+//4.设置过期时间
+export function getExp() {
+  return Cookies.get(expTime)
+}
+
+export function setExp(exp) {
+  const expdays = convertSecondsToDays(exp)
+  return Cookies.set(exp, exp, { expires: expdays })
+}
+
+export function removeExp() {
+  return Cookies.remove(expTime)
+}
+
+//5.把秒转换成天
 function convertSecondsToDays(seconds) {
   return seconds/(60*60*24); //1天=60秒*60分钟*24小时
 }
+
+

+ 103 - 25
src/views/login/index.vue

@@ -84,7 +84,7 @@
             <el-button :loading="loading" type="primary" class="loginBtn" @click.native.prevent="singleLogin">
               登录
             </el-button>
-            <!-- <div class="singleLogin" @click="singleLogin"><i class="el-icon-cloudy" /> 单点登录测试</div> -->
+            <!-- <div class="singleLogin" @click="goBackWebUrl"><i class="el-icon-refresh-right" /> 点此返回原网站</div> -->
           </el-form>
           <!--开始验证表单 end-->
         </div>
@@ -95,6 +95,7 @@
 
 <script>
 import { validUserPhone } from '@/utils/validate'
+import axios from 'axios'
 
 export default {
   name: 'Login',
@@ -127,7 +128,8 @@ export default {
         username: '', // 15210211200
         password: '', // 111111
         type: 1, //1=账号密码登录
-        captcha: ''
+        captcha: '',//验证码图片
+        code:''//验证code
       },
       loginRules: { // 2.配置from表单验证规则
         username: [{ required: true, trigger: 'blur', validator: validateUsername }],
@@ -212,7 +214,7 @@ export default {
               }else if(res.code!=0&&res.code!=200){
                 this.$message({
                   type:'error',
-                  message:"用户不存在!"
+                  message:res.message
                 })
               }
             })
@@ -229,8 +231,17 @@ export default {
     getImgCode() {
       const that = this
       this.$store.dispatch('user/getImgCode').then( res => {
-        console.log(res)
-        that.codeImg = res.data
+        if(res.code==200){
+          console.log(res)
+          //that.codeImg = res.data
+          that.codeImg = res.data.img;
+          that.loginForm.code = res.data.code;
+
+          console.log(that.loginForm)
+        }else{
+          this.$message.error("获取验证码失败,请稍后再试!")
+        }
+
       }).catch(() => {
         this.loading = false
       })
@@ -278,24 +289,36 @@ export default {
       // 解码backurl
       const decodedBackurl = decodeURIComponent(backurl);
       const decodedUserurl = decodeURIComponent(userurl);
-
+      
       // 第一种情况, 不含有backUrl或者userUrl 说明登录者是超级管理员
       if(hashParams.size==0||system=='/dashboard'){
+        // 获取当前网址
+        const currentUrl = window.location.origin.replace(/^https?:\/\//, '').split('/')[0];
+        console.log("当前网址是:" + currentUrl);
         console.log("执行超级管理员登录!")
-        this.login(1)
+        this.login(1,currentUrl)
       }else{
         // 第二种情况,含有backurl 说明是单点登录
         if(backurl!=null){
           console.log("执行单点登录!")
           const backurlObj = new URL(decodedBackurl);
           const back_url = backurlObj.hostname;
-          this.login(2)
+          this.login(2,back_url)
 
         }else if(userurl!=null){
+          //第三种情况 含有userurl 说明是会员登录
+          console.log(user_url)
           console.log("执行会员登录!")
           const backurlObj = new URL(decodedUserurl);
           const user_url = backurlObj.hostname;
-          this.login(3,user_url)
+
+          if(user_url==""){
+            this.$message.error("登录链接错误!")
+          }else{
+            console.log("当前登录链接是:" + user_url)
+            this.login(3,user_url)
+          }
+
 
         }else{
           this.$message.error("检查登录链接失败,请从正规渠道登录!")
@@ -306,8 +329,12 @@ export default {
     // 登录分路器 end ---------------------------------------->
     // 登录 start ---------------------------------------->
     login(type,url){
+
       //超级管理员登录
       if(type==1){
+        // 获取当前页面的 URL
+        this.loginForm.userurl = url;
+
         this.$refs.loginForm.validate(valid => {
           if (valid) {
             this.loading = true
@@ -319,13 +346,19 @@ export default {
                   type:'error',
                   message:res.message
                 })
-              }else if(res.code==200){
+              }else if(res.code==200&&res.token!=''){
+                this.sendUrlServ()
                 console.log("登录成功,将跳转至详情页面!")
                 this.$router.push({ path: this.redirect || '/', query: this.otherQuery })
               }else if(res.code!=0&&res.code!=200){
                 this.$message({
                   type:'error',
-                  message:"用户不存在!"
+                  message:res.message
+                })
+              }else if(res.token==''||res.token==null||res.token==undefined){
+                this.$message({
+                  type:'error',
+                  message:"登录失败!未能正确获取用户token,请重试!"
                 })
               }
             })
@@ -338,9 +371,8 @@ export default {
       //单点登录
       if(type==2){
         // 获取当前页面的 URL
-        const currentUrl = window.location.href;
-        const backurlValue = this.getBackUrl(currentUrl);
-        
+        this.loginForm.backurl = url;
+
         this.$refs.loginForm.validate(valid => {
           if (valid) {
             this.loading = true
@@ -351,16 +383,23 @@ export default {
                 if(res.code==0){
                   this.$message({
                     type:'error',
-                    message:"表单项有误,请检查!"
+                    message:res.message
                   })
-                }else if(res.code==200){
+                }else if(res.code==200&&res.token!=''){
+                  const currentUrl = window.location.href;
+                  const backurlValue = this.getBackUrl(currentUrl);
                   console.log("单点登录成功,开始启动跳转!")
-                  window.location.href = 'http://admindev.bjzxtw.org.cn/auth/back_login.php?backurl=' + backurlValue + '&token='+res.data.token;
+                  console.log(backurlValue)
+                  console.log(res.data.token)
+                  this.sendUrlServ()
+                  //下面还有一个
+                  //window.location.href = 'http://admindev.bjzxtw.org.cn/auth/back_login.php?backurl=' + backurlValue + '&token=' + res.data.token; //dev返回链接
+                  window.location.href = 'http://adminpre.bjzxtw.org.cn/auth/back_login.php?backurl=' + backurlValue + '&token=' + res.data.token; //pre返回地址
 
                 }else if(res.code!=0&&res.code!=200){
                   this.$message({
                     type:'error',
-                    message:"用户不存在!"
+                    message:res.message
                   })
                 }
               })
@@ -376,11 +415,10 @@ export default {
       }
       //会员登录
       if(type==3){
+        this.loginForm.userurl = url;
         this.$refs.loginForm.validate(valid => {
           if (valid) {
             this.loading = true;
-            this.loginForm.userurl = url;
-            //console.log(this.loginForm)
             this.$store.dispatch('user/login', this.loginForm).then( res => {
               this.loading = false
               console.log(res)
@@ -389,32 +427,72 @@ export default {
                   type:'error',
                   message:res.message
                 })
-              }else if(res.code==200){
+              }else if(res.code==200&&res.token!=''){
+                this.sendUrlServ()
                 console.log("登录成功,将跳转至详情页面!")
                 this.$router.push({ path: this.redirect || '/', query: this.otherQuery })
               }else if(res.code!=0&&res.code!=200){
                 this.$message({
                   type:'error',
-                  message:"用户不存在!"
+                  message:res.message
+                })
+              }else if(res.token==''||res.token==null||res.token==undefined){
+                this.$message({
+                  type:'error',
+                  message:"登录失败!未能正确获取用户token,请重试!"
                 })
               }
-            })
 
+            })
           }else {
             console.log('表单填写错误!请检查!')
             return false;
           }
         })
       }
-    }
+    },
     // 登录 end ---------------------------------------->
+
+    // 返回原网站 start---------------------------------------->
+    goBackWebUrl(){
+      // 获得当前域名
+      const urlString = window.location.href;
+      // 创建一个URL对象
+      const url = new URL(urlString);
+      // 获取hash部分(即#后面的部分)
+      const hash = url.hash;
+      // 从hash中提取查询参数
+      const hashParams = new URLSearchParams(hash.split('?')[1]);
+      // 获取backurl参数的值
+      const backurl = hashParams.get('backurl');
+      // 解码backurl
+      const decodedBackurl = decodeURIComponent(backurl);
+
+      if(hashParams.size!=0&&backurl!=null){
+        window.location.href = decodedBackurl
+      }else{
+        this.$message.error("无法返回原网站,请检查登录地址链接!")
+      }
+    },
+    //登录成功通知后端 上面还有一个
+    sendUrlServ(){
+      //axios.get('http://admindev.bjzxtw.org.cn/auth/loginapi.php',{params: {
+      axios.get('http://adminpre.bjzxtw.org.cn/auth/loginapi.php',{params: {
+          token: this.$store.state.user.token
+      }}).then(res => {
+        console.log(res)
+      }).catch(err => {
+        
+      });
+    }
+    // 返回原网站 end---------------------------------------->
   }
 }
 </script>
 
 <style scoped lang="less">
   .singleLogin {
-    font-size: 14px;
+    font-size: 18px;
     color: #666;
     cursor: pointer;
     margin-top: 30px;