panyy
/
UnisKB
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: update WeCom QR code handling to use iframe and include callback URL

v3.2
wxg0103 2025-11-04 16:05:34 +08:00
parent eb867daa6c
commit c7443757f0
2 changed files with 30 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
ui/src/views/chat/user-login/scanCompinents/wecomQrCode.vue
View File

@ -1,78 +1,39 @@
<template> <template>
<div id="wecom-qr" class="wecom-qr flex"></div> <iframe :src="iframeUrl" width="100%" height="380px" frameborder="0"></iframe>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import {useRoute, useRouter} from 'vue-router'
import * as ww from '@wecom/jssdk'
import {
WWLoginLangType,
WWLoginPanelSizeType,
WWLoginRedirectType,
WWLoginType
} from '@wecom/jssdk'
import {ref, nextTick, defineProps} from 'vue' import {ref, nextTick, defineProps} from 'vue'
import {MsgError} from '@/utils/message'
import useStore from '@/stores'
import {getBrowserLang} from '@/locales' import {getBrowserLang} from '@/locales'
const router = useRouter()
const route = useRoute()
const {
params: {accessToken},
} = route as any
const wwLogin = ref({})
const obj = ref<any>({isWeComLogin: false})
const {chatUser} = useStore()
const props = defineProps<{ const props = defineProps<{
config: { config: {
app_secret: string app_secret: string
app_key: string app_key: string
corp_id?: string corp_id?: string
agent_id?: string agent_id?: string
callback_url: string
} }
}>() }>()
const iframeUrl = ref('')
const init = async () => { const init = async () => {
await nextTick() // 确保DOM已更新 await nextTick() // 确保DOM已更新
const data = { const data = {
corpId: props.config.corp_id, corpId: props.config.corp_id,
agentId: props.config.agent_id agentId: props.config.agent_id,
redirectUri: props.config.callback_url,
} }
const lang = localStorage.getItem('MaxKB-locale') || getBrowserLang() || 'en-US' let lang = localStorage.getItem('MaxKB-locale') || getBrowserLang() || 'en-US'
const redirectUri = window.location.origin if (lang === 'en-US') {
try { lang = 'en'
wwLogin.value = ww.createWWLoginPanel({ } else {
el: '#wecom-qr', lang = 'zh'
params: {
login_type: WWLoginType.corpApp,
appid: data.corpId || '',
agentid: data.agentId,
redirect_uri: redirectUri,
state: 'fit2cloud-wecom-qr',
lang: lang === 'zh-CN' || lang === 'zh-Hant' ? WWLoginLangType.zh : WWLoginLangType.en,
redirect_type: WWLoginRedirectType.callback,
panel_size: WWLoginPanelSizeType.small
},
onCheckWeComLogin: obj.value,
async onLoginSuccess({code}: any) {
chatUser.wecomCallback(code, accessToken).then(() => {
setTimeout(() => {
router.push({
name: 'chat',
params: {accessToken: accessToken},
query: route.query,
})
})
})
},
onLoginFail(err) {
MsgError(`${err.errMsg}`)
}
})
} catch (error) {
} }
const redirectUri = encodeURIComponent(data.redirectUri)
console.log('redirectUri', data.redirectUri)
// 手动构建生成二维码的url
iframeUrl.value = `https://login.work.weixin.qq.com/wwlogin/sso/login?login_type=CorpApp&appid=${data.corpId}&agentid=${data.agentId}&redirect_uri=${redirectUri}&state=fit2cloud-wecom-qr&lang=${lang}&lang=${lang}&panel_size=small`
} }
init() init()

64
ui/src/views/login/scanCompinents/wecomQrCode.vue
View File

@ -1,25 +1,10 @@
<template> <template>
<div id="wecom-qr" class="wecom-qr flex"></div> <iframe :src="iframeUrl" width="100%" height="380px" frameborder="0"></iframe>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { useRouter } from 'vue-router' import {ref, nextTick, defineProps} from 'vue'
import * as ww from '@wecom/jssdk' import {getBrowserLang} from '@/locales'
import {
WWLoginLangType,
WWLoginPanelSizeType,
WWLoginRedirectType,
WWLoginType
} from '@wecom/jssdk'
import { ref, nextTick, defineProps } from 'vue'
import { MsgError } from '@/utils/message'
import useStore from '@/stores'
import { getBrowserLang } from '@/locales'
const router = useRouter()
const { login } = useStore()
const wwLogin = ref({})
const obj = ref<any>({ isWeComLogin: false })
const props = defineProps<{ const props = defineProps<{
config: { config: {
@ -27,45 +12,28 @@ const props = defineProps<{
app_key: string app_key: string
corp_id?: string corp_id?: string
agent_id?: string agent_id?: string
callback_url: string
} }
}>() }>()
const iframeUrl = ref('')
const init = async () => { const init = async () => {
await nextTick() // 确保DOM已更新 await nextTick() // 确保DOM已更新
const data = { const data = {
corpId: props.config.corp_id, corpId: props.config.corp_id,
agentId: props.config.agent_id agentId: props.config.agent_id,
redirectUri: props.config.callback_url,
} }
const lang = localStorage.getItem('MaxKB-locale') || getBrowserLang() || 'en-US' let lang = localStorage.getItem('MaxKB-locale') || getBrowserLang() || 'en-US'
const redirectUri = window.location.origin if (lang === 'en-US') {
console.log('redirectUri', redirectUri) lang = 'en'
try { } else {
wwLogin.value = ww.createWWLoginPanel({ lang = 'zh'
el: '#wecom-qr',
params: {
login_type: WWLoginType.corpApp,
appid: data.corpId || '',
agentid: data.agentId,
redirect_uri: redirectUri,
state: 'fit2cloud-wecom-qr',
lang: lang === 'zh-CN' || lang === 'zh-Hant' ? WWLoginLangType.zh : WWLoginLangType.en,
redirect_type: WWLoginRedirectType.callback,
panel_size: WWLoginPanelSizeType.small
},
onCheckWeComLogin: obj.value,
async onLoginSuccess({ code }: any) {
login.wecomCallback(code).then(() => {
setTimeout(() => {
router.push({ name: 'home' })
})
})
},
onLoginFail(err) {
MsgError(`${err.errMsg}`)
}
})
} catch (error) {
} }
const redirectUri = encodeURIComponent(data.redirectUri)
console.log('redirectUri', data.redirectUri)
// 手动构建生成二维码的url
iframeUrl.value = `https://login.work.weixin.qq.com/wwlogin/sso/login?login_type=CorpApp&appid=${data.corpId}&agentid=${data.agentId}&redirect_uri=${redirectUri}&state=fit2cloud-wecom-qr&lang=${lang}&panel_size=small`
} }
init() init()