update

src/views/components/element/FrameElement/BaseFrameElement.vue

@@ -22,6 +22,7 @@
           :frameborder="0" 
           :allowfullscreen="true"
           allow="camera *; microphone *; display-capture; midi; encrypted-media; fullscreen; geolocation; clipboard-read; clipboard-write; accelerometer; autoplay; gyroscope; payment; picture-in-picture; usb; xr-spatial-tracking;"
+          @load="handleIframeLoad"
         ></iframe>
         <iframe 
           :key="`src-${iframeKey}`"
@@ -110,40 +111,41 @@ const handleIframeLoad = async (event: Event) => {
       if (iframe.contentWindow && iframe.contentDocument) {
         const iframeDoc = iframe.contentDocument
         const iframeHead = iframeDoc.head || iframeDoc.getElementsByTagName('head')[0]
-      
-        if (iframeHead) {
-        // 动态导入JS文件
-          const [awsJs, jqJs, jieTuJs] = await Promise.all([
-            import('./aws-sdk-2.235.1.min.js'),
-            import('./jquery-3.6.0.min.js'),
-            import('./jietu.js')
-          ])
         
-          // 创建script标签并注入JS文件
-          const scripts = [
-            { id: 'aws-sdk', content: awsJs.default || awsJs },
-            { id: 'jquery', content: jqJs.default || jqJs },
-            { id: 'jietu', content: jieTuJs.default || jieTuJs }
+        if (iframeHead) {
+          // 使用fetch获取JS文件内容
+          const jsFiles = [
+            { id: 'aws-sdk', url: '/src/views/components/element/FrameElement/aws-sdk-2.235.1.min.js' },
+            { id: 'jquery', url: '/src/views/components/element/FrameElement/jquery-3.6.0.min.js' },
+            { id: 'jietu', url: '/src/views/components/element/FrameElement/jietu.js' }
           ]
-        
-          scripts.forEach(script => {
-          // 检查是否已经注入过
-            if (!iframeDoc.getElementById(script.id)) {
-              const scriptElement = iframeDoc.createElement('script')
-              scriptElement.id = script.id
-              scriptElement.textContent = script.content
-              iframeHead.appendChild(scriptElement)
-            
-              console.log(`已注入 ${script.id} 到iframe中`)
+          
+          for (const jsFile of jsFiles) {
+            try {
+              // 检查是否已经注入过
+              if (!iframeDoc.getElementById(jsFile.id)) {
+                const response = await fetch(jsFile.url)
+                const jsContent = await response.text()
+                
+                const scriptElement = iframeDoc.createElement('script')
+                scriptElement.id = jsFile.id
+                scriptElement.textContent = jsContent
+                iframeHead.appendChild(scriptElement)
+                
+                console.log(`已注入 ${jsFile.id} 到iframe中`)
+              }
             }
-          })
-        
+            catch (fetchError) {
+              console.error(`获取 ${jsFile.id} 失败:`, fetchError)
+            }
+          }
+          
           // 可选：在iframe中执行一些初始化代码
           try {
             iframe.contentWindow.eval(`
-            console.log('iframe中的JS环境已准备就绪');
-            // 这里可以添加一些初始化代码
-          `)
+              console.log('iframe中的JS环境已准备就绪');
+              // 这里可以添加一些初始化代码
+            `)
           }
           catch (evalError) {
             console.warn('无法在iframe中执行代码:', evalError)
@@ -154,7 +156,6 @@ const handleIframeLoad = async (event: Event) => {
         console.warn('无法访问iframe内容，可能是跨域限制')
       }
     }, 2000)
-
   }
   catch (error) {
     console.error('注入JS到iframe失败:', error)