Explorar o código

---author:liusq---date:2023-12-01---for:增加oauth2登录逻辑---

25067 %!s(int64=2) %!d(string=hai) anos
pai
achega
19d370eaca

+ 6 - 0
api/api.js

@@ -14,6 +14,12 @@ const apiService = {
 	phoneNoLogin(params) {
 		return http.post('/sys/phoneLogin',params);
 	},
+	/**
+	  * 第三方登录
+	  */
+	thirdLogin(token, thirdType,tenantId) {
+		return http.get(`/sys/thirdLogin/getLoginUser/${token}/${thirdType}/${tenantId}`);
+	},
 	/**
 	  * 退出
 	  */

+ 26 - 5
common/router/index.js

@@ -2,6 +2,7 @@ import modules from './modules'
 import Vue from 'vue'
 import Router from '@/plugin/uni-simple-router/index.js'
 import {ACCESS_TOKEN} from '@/common/util/constants.js'
+import {isOAuth2AppEnv} from '@/common/util/util.js'
 
 Vue.use(Router)
 //初始化
@@ -10,22 +11,42 @@ const router = new Router({
     routes: [...modules]//路由表
 });
 
-const whiteList = ['/pages/login/login'] 
+const whiteList = ['/pages/login/login','/pages/login/loginOauth2']
 //全局路由前置守卫
 router.beforeEach((to, from, next) => {
+	if(to.path == '/oauth2-app/login'){
+		let temp = location.href;
+		location.href = temp.replace('/oauth2-app/login','/pages/login/loginOauth2')
+		return;
+	}
 	let token=uni.getStorageSync(ACCESS_TOKEN);
 	if(token){
-		 next()
+		 if (to.path === '/pages/login/login' || to.path === '/pages/login/loginOauth2') {
+			 if(from.path ==='/pages/index/index'){
+				 return;
+			 }else{
+				 next()
+			 }
+		}
+		next()
 	}else{
 		if (whiteList.indexOf(to.path) !== -1) {
-		  next()
+		  // 在免登录白名单,如果进入的页面是login页面并且当前是OAuth2app环境,就进入OAuth2登录页面
+		  if (to.path === '/pages/login/login' && isOAuth2AppEnv()) {
+			next({path: '/pages/login/loginOauth2'})
+		  } else {
+			// 在免登录白名单,直接进入
+			next()
+		  }
 		}else{
-		  next({ path: '/pages/login/login'})
+			// 如果当前是在OAuth2APP环境,就跳转到OAuth2登录页面
+			let path = isOAuth2AppEnv() ? '/pages/login/loginOauth2' : '/pages/login/login';
+			next({ path: path })
 		}
 	} 
 })
 // 全局路由后置守卫
 router.afterEach((to, from) => {
 	console.log("afterEach")
-})
+});
 export default router;

+ 7 - 0
common/router/modules/routes.js

@@ -6,6 +6,13 @@ const routes = [
 			 title: '登录',
 		 },
 	},
+	{
+		path: "/pages/login/loginOauth2",
+		name: 'oauth2Login',
+		meta: {
+			title: 'oauth2登录',
+		},
+	},
 	{
         //注意:path必须跟pages.json中的地址对应,最前面别忘了加'/'哦
       path: '/pages/index/index',

+ 1 - 0
common/util/constants.js

@@ -1,6 +1,7 @@
 export const ACCESS_TOKEN = 'Access-Token'
 export const USER_NAME = 'login_username'
 export const USER_INFO = 'login_user_info'
+export const X_TENANT_ID = 'X-Tenant-Id'
 
 
 const STORAGE_OPTIONS = {

+ 28 - 0
common/util/util.js

@@ -0,0 +1,28 @@
+/** 判断是否是OAuth2APP环境 */
+export function isOAuth2AppEnv() {
+    // #ifdef H5
+    return /wxwork|dingtalk/i.test(navigator.userAgent)
+    // #endif
+    return false;
+}
+
+// 获取url中的参数
+export const getUrlParams = (url) => {
+    let result = {
+        url: '',
+        params: {}
+    };
+    let list = url.split('?');
+    result.url = list[0];
+    let params = list[1];
+    if (params) {
+        let list = params.split('&');
+        list.forEach(ele => {
+            let dic = ele.split('=');
+            let label = dic[0];
+            let value = dic[1];
+            result.params[label] = value;
+        });
+    }
+    return result;
+};

+ 200 - 0
pages/login/loginOauth2.vue

@@ -0,0 +1,200 @@
+<template>
+    <view class="zai-box">
+        <!-- 登录加载弹窗 -->
+        <view class="cu-load load-modal">
+            <image src="https://static.jeecg.com/upload/test/login4_1595818039175.png" mode="aspectFit"
+                   class="round"></image>
+            <view class="gray-text">正在登录中...</view>
+        </view>
+    </view>
+
+</template>
+
+<script>
+import {ACCESS_TOKEN} from "@/common/util/constants"
+import {mapActions} from "vuex"
+import {isOAuth2AppEnv, getUrlParams} from '@/common/util/util'
+import configService from '@/common/service/config.service.js';
+
+export default {
+    data() {
+        return {
+            loading: false,
+            env: {
+                thirdType: '',
+                thirdApp: false,
+                wxWork: false,
+                dingtalk: false,
+            },
+            redirectUrl: ''
+        };
+    },
+    beforeCreate() {
+        // 如果当前 不是 OAuth2APP环境,就重定向到 /user/login 页面
+        if (!isOAuth2AppEnv()) {
+            this.$Router.replace({name: 'login'})
+        }
+    },
+    created() {
+        this.checkEnv()
+        this.doOAuth2Login()
+    },
+    methods: {
+        ...mapActions(['ThirdLogin']),
+        /** 检测当前的环境 */
+        checkEnv() {
+            // 判断当时是否是企业微信环境
+            if (/wxwork/i.test(navigator.userAgent)) {
+                this.env.thirdApp = true
+                this.env.wxWork = true
+                //this.env.thirdType='wechat_enterprise'
+            }
+            // 判断当时是否是钉钉环境
+            if (/dingtalk/i.test(navigator.userAgent)) {
+                this.env.thirdApp = true
+                this.env.dingtalk = true
+                //this.env.thirdType='dingtalk'
+            }
+        },
+
+        /** 进行OAuth2登录操作 */
+        doOAuth2Login() {
+            if (this.env.thirdApp) {
+                // 判断是否携带了Token,是就说明登录成功
+                this.redirectUrl = ''
+                let search = window.location.search;
+                if (search.indexOf('hasToken') > 0) {
+                    let obj = getUrlParams(search);
+                    if (obj.params.redirect) {
+                        this.redirectUrl = decodeURIComponent(decodeURIComponent(obj.params.redirect));
+                        this.goRedirectUrl();
+                    } else {
+                        alert('hasToken参数错误!')
+                    }
+                } else if (search.indexOf('oauth2LoginToken') > 0) {
+                    let obj = getUrlParams(search);
+                    this.env.thirdType = obj.params.thirdType;
+                    let token = obj.params.oauth2LoginToken;
+                    if (obj.params.redirect) {
+                        this.redirectUrl = decodeURIComponent(obj.params.redirect)
+                    }
+                    this.doThirdLogin(token)
+                } else if (this.env.wxWork) {
+                    this.doWechatEnterpriseOAuth2Login()
+                } else if (this.env.dingtalk) {
+                    this.doDingTalkOAuth2Login()
+                }
+            }
+        },
+
+        // 根据token执行登录
+        doThirdLogin(token) {
+            this.ThirdLogin({token: token, thirdType: this.env.thirdType}).then(res => {
+                if (res.data.success) {
+                    this.loginSuccess()
+                } else {
+                    this.requestFailed(res)
+                }
+            }).catch((e) => {
+                alert(e.message || e)
+            })
+        },
+        loginSuccess() {
+		      	this.$Router.replaceAll({name: 'index'})
+        },
+        requestFailed(err) {
+            this.$message.warning("登录失败")
+        },
+        goRedirectUrl() {
+            let obj = getUrlParams(this.redirectUrl);
+            let path = obj.url;
+            let params = obj.params;
+            if (params.info) {
+                let temp = JSON.parse(params.info);
+                let query = {
+                    instanceId: temp.procInsId,
+                    taskId: temp.taskId,
+                    taskDefKey: temp.taskDefKey
+                }
+                if (temp.claim == 1) {
+                    query['claim'] = 1
+                }
+                this.$Router.replaceAll({path, query})
+            } else {
+                this.$Router.replaceAll({path})
+            }
+        },
+        /** 企业微信OAuth2登录 */
+        doWechatEnterpriseOAuth2Login() {
+            this.sysOAuth2Login('wechat_enterprise')
+        },
+
+        /** 钉钉OAuth2登录 */
+        doDingTalkOAuth2Login() {
+            this.sysOAuth2Login('dingtalk')
+        },
+
+        /** 后台构造oauth2登录地址 */
+        sysOAuth2Login(source) {
+            let domainURL = configService.apiUrl;
+            let url = `${domainURL}/sys/thirdLogin/oauth2/${source}/login`;
+            let state = window.location.origin + window.location.search
+            url += `?state=${encodeURIComponent(state)}`;
+            console.log('sysOAuth2Login====》', url)
+            window.location.href = url;
+        },
+    }
+}
+</script>
+
+<style>
+.login-paddingtop {
+    padding-top: 100 upx;
+}
+
+.zai-box {
+    padding: 0 20 upx;
+    padding-top: 100 upx;
+    position: relative;
+}
+
+.zai-logo {
+    width: 200 upx;
+    height: 150px;
+}
+
+.zai-title {
+    font-size: 58 upx;
+    color: #000000;
+    text-align: center;
+}
+
+.input-placeholder, .zai-input {
+    color: #94afce;
+}
+
+.zai-label {
+    padding: 60 upx 0;
+    text-align: center;
+    font-size: 30 upx;
+    color: #a7b6d0;
+}
+
+.zai-btn {
+    background: #ff65a3;
+    color: #fff;
+    border: 0;
+    border-radius: 100 upx;
+    font-size: 36 upx;
+}
+
+.zai-btn:after {
+    border: 0;
+}
+
+/*按钮点击效果*/
+.zai-btn.button-hover {
+    transform: translate(1 upx, 1 upx);
+}
+
+</style>