@yangyongtao/gaea 1.1.30 → 1.1.31

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [1.1.31] - 2026-09-09
+
+### Added
+- Vite 插件 `transformIndexHtml` 自动给外部跨域 `<script src="http(s)://...">` 补 `crossorigin="anonymous"`：解决跨域隔离（COEP: require-corp）下第三方脚本因缺少 CORP 响应头被拦截（`NotSameOriginAfterDefaultedToSameOriginByCoep`）并阻塞页面加载的问题（如 `live.dcyun.com` 的 DcVideo.js 视频库）
+- 注入前置脚本 hook `Node.prototype.appendChild/insertBefore`：第三方脚本内部 `document.createElement('script')` 动态加载的跨域子脚本自动补 `crossorigin`（DcVideo.js 内部的 jquery / DCHls / EasyWasmPlayer / ezuikit 等均可正常加载）
+- 新增 `gaeaVitePlugin({ skipExternalScripts: [...] })` 配置：构建期移除匹配的外部脚本（字符串子串或正则），用于跳过跨域隔离下无法正常工作且当前未使用的第三方脚本
+
 ## [1.1.30] - 2026-09-09
 
 ### Added

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yangyongtao/gaea",
-  "version": "1.1.30",
+  "version": "1.1.31",
   "description": "Gaea 3D visualization component library - Vue 3 components based on Godot WASM engine. Includes WMTS layer loading, camera view control, Vite plugin auto-injection, etc.",
   "type": "module",
   "main": "src/index.cjs",

package/src/vite-plugin.js

@@ -55,7 +55,40 @@ const COEP_HEADERS = {
   'Cross-Origin-Embedder-Policy': 'require-corp',
 };
 
-export default function gaeaVitePlugin() {
+/**
+ * 给外部跨域 <script src="http(s)://..."> 自动补 crossorigin="anonymous"。
+ *
+ * 背景：Gaea 引擎要求跨域隔离（COEP: require-corp）。在 COEP 下，普通 no-cors
+ * 跨域脚本因缺少 Cross-Origin-Resource-Policy 响应头会被浏览器拦截（
+ * NotSameOriginAfterDefaultedToSameOriginByCoep），且同步脚本会挂起阻塞页面加载。
+ * 补上 crossorigin 后改为 CORS 模式加载，只要服务器返回 Access-Control-Allow-Origin
+ * 即可通过 COEP 检查。
+ */
+function addCrossOriginToExternalScripts(html) {
+  return html.replace(/<script\b([^>]*?)>/g, (match, attrs) => {
+    if (!/\bsrc="https?:\/\//.test(attrs)) return match;
+    if (/\bcrossorigin(=|[\s>])/i.test(attrs)) return match;
+    return match.replace(/^<script/, '<script crossorigin="anonymous"');
+  });
+}
+
+/**
+ * 移除 HTML 中匹配的外部 <script src="http(s)://..."> 标签。
+ * 用于跳过某些在跨域隔离（COEP）下无法正常工作、且当前项目并未使用的第三方脚本
+ * （如第三方视频播放库），避免它们拖慢首屏、产生无意义报错。
+ * @param {string} html
+ * @param {Array<string|RegExp>} rules 匹配规则：字符串按子串匹配 src，正则直接 test
+ */
+function skipExternalScriptTags(html, rules) {
+  if (!rules?.length) return html;
+  return html.replace(/<script\b([^>]*?src="(https?:\/\/[^"]+)"[^>]*)>[\s\S]*?<\/script>/g, (match, attrs, src) => {
+    const hit = rules.some((rule) => (rule instanceof RegExp ? rule.test(src) : String(src).includes(rule)));
+    return hit ? '' : match;
+  });
+}
+
+export default function gaeaVitePlugin(options = {}) {
+  const skipScripts = options.skipExternalScripts || [];
   let resolvedOutDir = '';
 
   return {
@@ -166,6 +199,12 @@ export default function gaeaVitePlugin() {
     },
 
     transformIndexHtml(html) {
+      // 跳过配置中匹配的外部脚本（如项目未使用的第三方视频库）
+      html = skipExternalScriptTags(html, skipScripts);
+
+      // 外部跨域脚本自动补 crossorigin（绕过 COEP 拦截，避免阻塞页面）
+      html = addCrossOriginToExternalScripts(html);
+
       // 自动注入 Gaea.js（消费者无需在 HTML 中手动写 <script src="/Gaea.js">）
       if (!html.includes('/Gaea.js')) {
         html = html.replace(
@@ -174,10 +213,31 @@ export default function gaeaVitePlugin() {
         );
       }
 
-      // 跨域隔离检测
+      // 跨域隔离检测 + 动态跨域脚本自动补 crossorigin（必须在 body 脚本执行前注入到 head）
       html = html.replace(
         '</head>',
         `<script>
+          // 动态创建的跨域 <script> 自动补 crossorigin="anonymous"：
+          // 跨域隔离（COEP）下，第三方脚本内部 document.createElement('script') 动态加载的子脚本
+          // 若不带 crossorigin 会被拦截（NotSameOriginAfterDefaultedToSameOriginByCoep）并阻塞页面。
+          (function () {
+            if (!window.crossOriginIsolated) return;
+            function fix(el) {
+              if (el && el.tagName === 'SCRIPT' && el.src && !el.crossOrigin) {
+                try {
+                  if (new URL(el.src, location.href).origin !== location.origin) {
+                    el.crossOrigin = 'anonymous';
+                  }
+                } catch (e) {}
+              }
+            }
+            var oa = Node.prototype.appendChild;
+            var oi = Node.prototype.insertBefore;
+            Node.prototype.appendChild = function (el) { fix(el); return oa.call(this, el); };
+            Node.prototype.insertBefore = function (el, ref) { fix(el); return oi.call(this, el, ref); };
+          })();
+        </script>
+        <script>
           if (!window.crossOriginIsolated) {
             if (!location.search.includes('gaea_isolated=1')) {
               location.replace(location.href.split('?')[0] + '?gaea_isolated=1');