fix: 使用官方 tt.requestAuthCode API 替代 ttjsBridge
- 添加 tt 对象类型声明(官方 H5 API) - 优先使用 tt.requestAuthCode() 获取授权码 - 保留 ttjsBridge 作为降级兼容方案 - 修正环境检测逻辑 参考文档: https://open.feishu.cn/document/quickly-create-a-login-free-web-app/introduction Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -5,9 +5,18 @@ import { useUserStore } from '@/stores/user'
|
|||||||
import QRCodeLogin from './QRCodeLogin'
|
import QRCodeLogin from './QRCodeLogin'
|
||||||
import styles from './login.module.css'
|
import styles from './login.module.css'
|
||||||
|
|
||||||
// 声明 ttjsBridge 类型
|
// 声明飞书 JSAPI 类型
|
||||||
declare global {
|
declare global {
|
||||||
interface Window {
|
interface Window {
|
||||||
|
// 官方 tt API(H5 应用免登)
|
||||||
|
tt?: {
|
||||||
|
requestAuthCode: (params: {
|
||||||
|
appId: string
|
||||||
|
success?: (res: { code: string }) => void
|
||||||
|
fail?: (err: any) => void
|
||||||
|
}) => void
|
||||||
|
}
|
||||||
|
// 旧版 ttjsBridge(兼容性)
|
||||||
ttjsBridge?: {
|
ttjsBridge?: {
|
||||||
getAuthCode: (params: any) => void
|
getAuthCode: (params: any) => void
|
||||||
}
|
}
|
||||||
@@ -39,9 +48,9 @@ export default function Login() {
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
// 1. 检测是否在飞书客户端内
|
// 1. 检测是否在飞书客户端内
|
||||||
const ua = navigator.userAgent.toLowerCase()
|
const ua = navigator.userAgent.toLowerCase()
|
||||||
const isInFeishu = ua.includes('feishu') || ua.includes('lark') || (window as any).ttjsBridge !== undefined
|
const isInFeishu = ua.includes('feishu') || ua.includes('lark') || window.tt !== undefined
|
||||||
|
|
||||||
console.log('🔍 Environment check:', { ua, isInFeishu, hasBridge: !!(window as any).ttjsBridge })
|
console.log('🔍 Environment check:', { ua, isInFeishu, hasTt: window.tt !== undefined })
|
||||||
|
|
||||||
if (isInFeishu) {
|
if (isInFeishu) {
|
||||||
// 飞书内:静默授权
|
// 飞书内:静默授权
|
||||||
@@ -68,12 +77,30 @@ export default function Login() {
|
|||||||
}
|
}
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
// 飞书内静默授权
|
// 飞书内静默授权(使用官方 tt.requestAuthCode API)
|
||||||
const handleFeishuAutoLogin = () => {
|
const handleFeishuAutoLogin = () => {
|
||||||
console.log('🚀 Feishu auto login started')
|
console.log('🚀 Feishu auto login started')
|
||||||
|
|
||||||
if ((window as any).ttjsBridge) {
|
const appId = 'cli_a8033d607cba500d'
|
||||||
(window as any).ttjsBridge.getAuthCode({
|
|
||||||
|
if (window.tt) {
|
||||||
|
// 使用官方 tt.requestAuthCode API
|
||||||
|
window.tt.requestAuthCode({
|
||||||
|
appId: appId,
|
||||||
|
success: (res) => {
|
||||||
|
console.log('✅ Got auth code from tt.requestAuthCode:', res.code)
|
||||||
|
handleFeishuLogin(res.code)
|
||||||
|
},
|
||||||
|
fail: (error: any) => {
|
||||||
|
console.error('❌ requestAuthCode failed:', error)
|
||||||
|
setLoading(false)
|
||||||
|
Toast.show('获取授权失败,请重试')
|
||||||
|
},
|
||||||
|
})
|
||||||
|
} else if ((window as any).ttjsBridge) {
|
||||||
|
// 兼容旧版 ttjsBridge
|
||||||
|
console.warn('⚠️ Using legacy ttjsBridge API')
|
||||||
|
;(window as any).ttjsBridge.getAuthCode({
|
||||||
success: (authCode: string) => {
|
success: (authCode: string) => {
|
||||||
console.log('✅ Got auth code from ttjsBridge:', authCode)
|
console.log('✅ Got auth code from ttjsBridge:', authCode)
|
||||||
handleFeishuLogin(authCode)
|
handleFeishuLogin(authCode)
|
||||||
@@ -85,8 +112,9 @@ export default function Login() {
|
|||||||
},
|
},
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
console.warn('⚠️ ttjsBridge not available')
|
console.warn('⚠️ No Feishu bridge available')
|
||||||
setLoading(false)
|
setLoading(false)
|
||||||
|
Toast.show('请在飞书中打开')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user