feat: enhance script loading with error handling and cleanup, update routing for chat navigation

v3.2
wxg0103 2025-10-20 18:10:55 +08:00
parent 75eab6749e
commit 39bd4de6ee
2 changed files with 46 additions and 30 deletions

View File

@ -115,42 +115,51 @@ interface LoadScriptOptions {
}
export const loadScript = (url: string, options: LoadScriptOptions = {}): Promise<void> => {
const {jsId, forceReload = false} = options
const scriptId = jsId || `script-${btoa(url).slice(0, 12)}` // 生成唯一 ID
const { jsId, forceReload = false } = options;
const scriptId = jsId || `script-${btoa(url).slice(0, 12)}`;
const cleanupScript = (script: HTMLScriptElement) => {
if (script && script.parentElement) {
script.parentElement.removeChild(script);
}
};
return new Promise((resolve, reject) => {
// 检查是否已存在且无需强制加载
const existingScript = document.getElementById(scriptId) as HTMLScriptElement | null
if (typeof document === 'undefined') {
reject(new Error('Cannot load script in non-browser environment'));
return;
}
const existingScript = document.getElementById(scriptId) as HTMLScriptElement | null;
if (existingScript && !forceReload) {
if (existingScript.src === url) {
existingScript.onload = () => resolve() // 复用现有脚本
return
console.log(`[loadScript] Reuse existing script: ${url}`);
resolve();
return;
}
// URL 不同则移除旧脚本
existingScript.parentElement?.removeChild(existingScript)
existingScript.remove();
}
// 创建新脚本
const script = document.createElement('script')
script.id = scriptId
script.src = url
script.async = true // 明确启用异步加载
const script = document.createElement('script');
script.id = scriptId;
script.src = url;
script.async = true;
// 成功回调
script.onload = () => {
resolve()
}
console.log(`[loadScript] Script loaded: ${url}`);
resolve();
};
// 错误处理(兼容性增强)
script.onerror = () => {
reject(new Error(`Failed to load script: ${url}`))
cleanupScript(script)
}
console.error(`[loadScript] Failed to load: ${url}`);
cleanupScript(script);
reject(new Error(`Failed to load script: ${url}`));
};
// 插入到 <head> 确保加载顺序
document.head.appendChild(script)
})
}
document.head.appendChild(script);
});
};
// 清理脚本(可选)
const cleanupScript = (script: HTMLScriptElement) => {

View File

@ -425,7 +425,7 @@ onBeforeMount(() => {
}
})
declare const window: any
onMounted(() => {
onBeforeMount(() => {
const route = useRoute()
const currentUrl = ref(route.fullPath)
const params = new URLSearchParams(currentUrl.value.split('?')[1])
@ -437,7 +437,6 @@ onMounted(() => {
dd.runtime.permission.requestAuthCode({corpId: code}).then((res) => {
console.log('DingTalk client request success:', res)
chatUser.dingOauth2Callback(res.code, accessToken).then(() => {
router.push({name: 'home'})
})
})
}
@ -450,7 +449,11 @@ onMounted(() => {
appId: appId,
success: (res: any) => {
chatUser.larkCallback(res.code, accessToken).then(() => {
router.push({name: 'home'})
router.push({
name: 'chat',
params: {accessToken: accessToken},
query: route.query,
})
})
},
fail: (error: any) => {
@ -459,18 +462,22 @@ onMounted(() => {
})
}
loadScript('https://lf-scm-cn.feishucdn.com/lark/op/h5-js-sdk-1.5.35.js', {
loadScript('https://lf-scm-cn.feishucdn.com/lark/op/h5-js-sdk-1.5.44.js', {
jsId: 'lark-sdk',
forceReload: true,
})
.then(() => {
if (window.tt) {
window.tt.requestAccess({
window.tt?.requestAccess({
appID: appId,
scopeList: [],
success: (res: any) => {
chatUser.larkCallback(res.code, accessToken).then(() => {
router.push({name: 'home'})
router.push({
name: 'chat',
params: {accessToken: accessToken},
query: route.query,
})
})
},
fail: (error: any) => {