[adapters] [extension] 增加对多线程 HTTP 的支持，修复创建多线程扩展错误的问题

adapters/platforms/wechat/res/workers/handlers.js

@@ -9,3 +9,8 @@ if (globalThis.CC_WORKER_AUDIO_SYSTEM) {
     const audio = require("./audio-worker.js");
     registerHandler("audio", audio);
 }
+
+if (globalThis.CC_WORKER_HTTP_REQUEST) {
+    const http = require("./http-worker.js");
+    registerHandler("http", http);
+}

adapters/platforms/wechat/res/workers/http-worker.js

@@ -0,0 +1,56 @@
+const { main } = require("./ipc-worker.js");
+
+const methodMap = {
+    1: 'GET',
+    2: 'POST',
+    3: 'HEAD',
+    4: 'PUT',
+    5: 'DELETE',
+    6: 'CONNECT',
+    7: 'OPTIONS',
+    8: 'TRACE',
+    9: 'PATCH',
+};
+
+var http_worker = {
+    tasks: {},
+
+    request(id, data, url, method, header, responseType, timeout, callback) {
+        const task = worker.request({
+            data,
+            url: url,
+            method: methodMap[method],
+            header: header,
+            dataType: 'other',
+            responseType: responseType === 0 ? 'arraybuffer' : 'text',
+            timeout: typeof timeout === "number" ? timeout : undefined,
+            success: ({ data, statusCode, header }) => {
+                delete this.tasks[id];
+                callback(
+                    true,
+                    data,
+                    statusCode,
+                    header,
+                );
+            },
+            fail: ({ errMsg }) => {
+                delete this.tasks[id];
+                callback(false, errMsg);
+            },
+            useHighPerformanceMode: true,
+            enableHttp2: true,
+            enableQuic: true,
+        });
+        this.tasks[id] = task;
+    },
+
+    abort(id) {
+        const task = this.tasks[id];
+        if (task) {
+            task.abort();
+            delete this.tasks[id];
+        }
+    },
+};
+
+module.exports = http_worker;

adapters/platforms/wechat/res/workers/ipc-worker.js

@@ -146,6 +146,7 @@ function _initFromWorker(id, meta) {
         CC_WORKER_ASSET_PIPELINE,
         CC_WORKER_AUDIO_SYSTEM,
         CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL,
+        CC_WORKER_HTTP_REQUEST,
     ] = meta;
 
     for (const wrapper of wrappers) {
@@ -162,6 +163,7 @@ function _initFromWorker(id, meta) {
     globalThis.CC_WORKER_ASSET_PIPELINE = CC_WORKER_ASSET_PIPELINE;
     globalThis.CC_WORKER_AUDIO_SYSTEM = CC_WORKER_AUDIO_SYSTEM;
     globalThis.CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL = CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL;
+    globalThis.CC_WORKER_HTTP_REQUEST = CC_WORKER_HTTP_REQUEST;
 
     _inited = true;
     if (_initCallback) _initCallback();

adapters/platforms/wechat/res/workers/macro.js

@@ -18,5 +18,8 @@ globalThis.CC_WORKER_ASSET_PIPELINE = null;
 // 是否启用 Worker 驱动音频系统
 globalThis.CC_WORKER_AUDIO_SYSTEM = null;
 
+// 是否启用 Worker 驱动 HTTP 请求
+globalThis.CC_WORKER_HTTP_REQUEST = null;
+
 // Worker 音频系统同步音频属性的间隔时间（单位：毫秒）
 globalThis.CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL = null;

adapters/platforms/wechat/worker/index.js

@@ -14,6 +14,8 @@ module.exports = {
                     CC_WORKER_ASSET_PIPELINE,
                     CC_WORKER_AUDIO_SYSTEM,
                     CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL,
+                    CC_CUSTOM_WORKER,
+                    CC_WORKER_HTTP_REQUEST,
                     CC_WORKER_SCHEDULER,
                     CC_WORKER_FS_SYNC,
                     CC_WORKER_SUB_PACKAGE,

adapters/platforms/wechat/worker/ipc-main.js

@@ -111,6 +111,7 @@ const ipcMain = {
             CC_WORKER_ASSET_PIPELINE,
             CC_WORKER_AUDIO_SYSTEM,
             CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL,
+            CC_WORKER_HTTP_REQUEST,
         ]);
     },
 

adapters/platforms/wechat/worker/macro.js

@@ -28,6 +28,13 @@ if (!("CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL" in globalThis)) {
     globalThis.CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL = 500;
 }
 
+// 是否启用 Worker 驱动 HTTP 请求
+if (!("CC_WORKER_HTTP_REQUEST" in globalThis)) {
+    globalThis.CC_WORKER_HTTP_REQUEST = false;
+    // NOTE 截止 2024.10.22，微信未修复 iOS、Windows、Mac 上仅文件系统 API 可以正常使用的问题
+    globalThis.CC_WORKER_HTTP_REQUEST = (isAndroid || isDevtools) && globalThis.CC_WORKER_HTTP_REQUEST;
+}
+
 // 是否启用自定义 Worker
 if (!("CC_CUSTOM_WORKER" in globalThis)) {
     globalThis.CC_CUSTOM_WORKER = false;
@@ -35,7 +42,7 @@ if (!("CC_CUSTOM_WORKER" in globalThis)) {
 
 // 是否启用 Worker
 if (!("CC_USE_WORKER" in globalThis)) {
-    globalThis.CC_USE_WORKER = (CC_WORKER_ASSET_PIPELINE || CC_WORKER_AUDIO_SYSTEM || CC_CUSTOM_WORKER) && hasWorker && !isSubContext;
+    globalThis.CC_USE_WORKER = (CC_WORKER_ASSET_PIPELINE || CC_WORKER_AUDIO_SYSTEM || CC_CUSTOM_WORKER || CC_WORKER_HTTP_REQUEST) && hasWorker && !isSubContext;
 }
 
 // 是否启用 Worker 调试模式

adapters/platforms/wechat/wrapper/builtin/XMLHttpRequest.js

@@ -6,6 +6,19 @@ const _requestHeader = new WeakMap()
 const _responseHeader = new WeakMap()
 const _requestTask = new WeakMap()
 
+let _worker_id = 0;
+const methodMap = {
+  'GET': 1,
+  'POST': 2,
+  'HEAD': 3,
+  'PUT': 4,
+  'DELETE': 5,
+  'CONNECT': 6,
+  'OPTIONS': 7,
+  'TRACE': 8,
+  'PATCH': 9,
+};
+
 function _triggerEvent(type, ...args) {
   if (typeof this[`on${type}`] === 'function') {
     this[`on${type}`].apply(this, args)
@@ -61,9 +74,13 @@ export default class XMLHttpRequest extends EventTarget {
     const myRequestTask = _requestTask.get(this)
 
     if (myRequestTask) {
+      if (CC_WORKER_HTTP_REQUEST) {
+        worker.http.abort([myRequestTask]);
+      } else {
         myRequestTask.abort()
       }
     }
+  }
 
   getAllResponseHeaders() {
     const responseHeader = _responseHeader.get(this)
@@ -90,15 +107,7 @@ export default class XMLHttpRequest extends EventTarget {
     if (this.readyState !== XMLHttpRequest.OPENED) {
       throw new Error("Failed to execute 'send' on 'XMLHttpRequest': The object's state must be OPENED.")
     } else {
-      let myRequestTask = wx.request({
-        data,
-        url: _url.get(this),
-        method: _method.get(this),
-        header: _requestHeader.get(this),
-        dataType: 'other',
-        responseType: this.responseType === 'arraybuffer' ? 'arraybuffer' : 'text',
-        timeout: this.timeout || undefined,
-        success: ({ data, statusCode, header }) => {
+      const onSuccess = ({ data, statusCode, header }) => {
         this.status = statusCode
         _responseHeader.set(this, header)
         _triggerEvent.call(this, 'loadstart')
@@ -135,8 +144,9 @@ export default class XMLHttpRequest extends EventTarget {
         _changeReadyState.call(this, XMLHttpRequest.DONE)
         _triggerEvent.call(this, 'load')
         _triggerEvent.call(this, 'loadend')
-        },
-        fail: ({ errMsg }) => {
+      };
+
+      const onFail = ({ errMsg }) => {
         // TODO 规范错误
         if (errMsg.indexOf('abort') !== -1) {
           _triggerEvent.call(this, 'abort')
@@ -146,12 +156,45 @@ export default class XMLHttpRequest extends EventTarget {
           _triggerEvent.call(this, 'error', errMsg)
         }
         _triggerEvent.call(this, 'loadend')
-        }
-      })
+      };
 
+      if (CC_WORKER_HTTP_REQUEST) {
+        const id = ++_worker_id;
+        worker.http.request(
+          [
+            id,
+            data,
+            _url.get(this),
+            methodMap[_method.get(this)],
+            _requestHeader.get(this),
+            this.responseType === 'arraybuffer' ? 0 : 1,
+            this.timeout,
+          ],
+          ([success, arg, statusCode, header]) => {
+            if (success) {
+              onSuccess({ data: arg, statusCode, header });
+            } else {
+              onFail({ errMsg: arg });
+            }
+          },
+        );
+        _requestTask.set(this, id);
+      } else {
+        let myRequestTask = wx.request({
+          data,
+          url: _url.get(this),
+          method: _method.get(this),
+          header: _requestHeader.get(this),
+          dataType: 'other',
+          responseType: this.responseType === 'arraybuffer' ? 'arraybuffer' : 'text',
+          timeout: this.timeout || undefined,
+          success: onSuccess,
+          fail: onFail,
+        });
         _requestTask.set(this, myRequestTask);
       }
     }
+  }
 
   setRequestHeader(header, value) {
     const myHeader = _requestHeader.get(this)

creator-sp.d.ts

@@ -962,6 +962,11 @@ declare var CC_WORKER_AUDIO_SYSTEM: boolean;
  */
 declare var CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL: number;
 
+/**
+ * 是否启用 Worker 驱动 HTTP 请求
+ */
+declare var CC_WORKER_HTTP_REQUEST: boolean;
+
 /**
  * 是否启用自定义 Worker
  */

extension/i18n/en.js

@@ -56,6 +56,8 @@ module.exports = {
     'thread_debug_desc': 'When enabled, detailed logs will be output for debugging, which may significantly reduce performance.',
     'thread_custom': 'Project multithreading extension',
     'thread_custom_desc': 'This will activate the multithreading extension in the project\'s worker directory.',
+    'thread_http': 'Multi-threaded XMLHttpRequest',
+    'thread_http_desc': 'When enabled, XMLHttpRequest will be moved to a thread for execution, because there is a data roundtrip time, please actually test whether there is an improvement in performance.',
     'thread_asset_pipeline': 'Multi-threaded Asset Pipeline',
     'thread_asset_pipeline_desc': 'When enabled, the asset pipeline will be executed in a separate thread, reducing stuttering caused by resource downloading, caching, and loading.',
     'thread_audio_system': 'Multi-threaded Audio System',

extension/i18n/zh.js

@@ -56,6 +56,8 @@ module.exports = {
     'thread_debug_desc': '启用后将会输出详细日志以便进行调试，这可能会大幅降低性能。',
     'thread_custom': '项目多线程扩展',
     'thread_custom_desc': '启用后将会激活项目 worker 目录下的自定义扩展。',
+    'thread_http': '多线程驱动 XMLHttpRequest',
+    'thread_http_desc': '启用后 XMLHttpRequest 将会移至线程中执行，由于存在数据往返的耗时，请实际测试对性能是否有提升。',
     'thread_asset_pipeline': '多线程驱动资源管线',
     'thread_asset_pipeline_desc': '启用后将资源管线移至线程中执行，减少由资源下载、缓存与加载导致的卡顿。',
     'thread_audio_system': '多线程驱动音频系统',

extension/main.js

@@ -110,6 +110,7 @@ function getSettings() {
             CC_WORKER_SCHEDULER: getMacroBooleanValue(content, "CC_WORKER_SCHEDULER"),
             CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL: getMacroIntegerValue(content, "CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL"),
             CC_CUSTOM_WORKER: getMacroBooleanValue(content, "CC_CUSTOM_WORKER"),
+            CC_WORKER_HTTP_REQUEST: getMacroBooleanValue(content, "CC_WORKER_HTTP_REQUEST"),
         };
     }
 }
@@ -174,7 +175,7 @@ function checkAndModifyWorkerFiles() {
         const gameJson = JSON.parse(fs.readFileSync(gameJsonPath, { encoding: "utf-8" }));
 
         // 是否启用 Worker
-        if (result.CC_WORKER_ASSET_PIPELINE || result.CC_WORKER_AUDIO_SYSTEM || result.CC_CUSTOM_WORKER) {
+        if (result.CC_WORKER_ASSET_PIPELINE || result.CC_WORKER_AUDIO_SYSTEM || result.CC_CUSTOM_WORKER || result.CC_WORKER_HTTP_REQUEST) {
             // 没有 Worker 目录与配置的话提醒用户重新安装
             if (!(gameJson.workers && fs.existsSync(workerDir))) {
                 Editor.error(t('thread_not_right_workers_dir'));

extension/panel/index.js

@@ -39,6 +39,9 @@ Editor.Panel.extend({
                     </ui-prop>
                 </div>
             </ui-prop>
+            <ui-prop id="th" tabindex="-1" name="${t('thread_http')}" tooltip="${t('thread_http_desc')}">
+                <ui-checkbox id="thc" tabindex="-1"></ui-checkbox>
+            </ui-prop>
             <ui-prop id="ts" tabindex="-1" name="${t('thread_scheduler')}" tooltip="${t('thread_scheduler_desc')}">
                         <ui-checkbox id="tsc" tabindex="-1"></ui-checkbox>
             </ui-prop>
@@ -56,6 +59,8 @@ Editor.Panel.extend({
         thread_asset_pipeline_checkbox: '#tapc',
         thread_custom: '#tc',
         thread_custom_checkbox: '#tcc',
+        thread_http: '#th',
+        thread_http_checkbox: '#thc',
         thread_audio_system: '#fs',
         thread_audio_system_checkbox: '#fsc',
         thread_audio_system_interval: '#fsi',
@@ -81,6 +86,7 @@ Editor.Panel.extend({
                 this.$thread_asset_pipeline_checkbox.checked = data.CC_WORKER_ASSET_PIPELINE;
                 this.$thread_audio_system_checkbox.checked = data.CC_WORKER_AUDIO_SYSTEM;
                 this.$thread_audio_system_interval_input.value = data.CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL;
+                this.$thread_http_checkbox.checked = data.CC_WORKER_HTTP_REQUEST;
                 this.$thread_scheduler_checkbox.checked = data.CC_WORKER_SCHEDULER;
 
                 this.$thread_debug_checkbox.addEventListener('change', () => {
@@ -95,6 +101,10 @@ Editor.Panel.extend({
                     this.setSettings("CC_CUSTOM_WORKER", this.$thread_custom_checkbox.checked);
                 });
 
+                this.$thread_http_checkbox.addEventListener('change', () => {
+                    this.setSettings("CC_WORKER_HTTP_REQUEST", this.$thread_http_checkbox.checked);
+                });
+
                 const onAudioSystemEnableChange = (enabled) => {
                     this.$thread_audio_system_interval_input.disabled = !enabled;
                 };

extension/templates/2.4.13/2.2.0/worker/creator-worker.d.ts

@@ -0,0 +1,72 @@
+declare namespace worker {
+    export const createInnerAudioContext: any;
+    export const connectSocket: any;
+    export function createSharedArrayBuffer(size: number): WXSharedArrayBuffer;
+    export const downloadFile: any;
+    export const env: { USER_DATA_PATH: string };
+    export const getFileSystemManager: any;
+    export const onMessage: any;
+    export const postMessage: any;
+    export const request: any;
+    export const uploadFile: any;
+    export interface WXSharedArrayBuffer {
+        buffer: SharedArrayBuffer;
+    }
+}
+
+declare module "ipc-worker.js" {
+    /**
+     * 是否初始化完成
+     * 
+     * - 初始化完成后，宏才被设为有效值
+     */
+    export const inited: boolean;
+
+    /**
+     * 访问主线程的入口
+     */
+    export const main: any;
+
+    /**
+     * 注册主线程可以访问的入口
+     * 
+     * 请务必在脚本执行时调用才有效。
+     */
+    export function registerHandler(name: string, handler: object): void;
+}
+
+/**
+ * 是否启用自定义 Worker
+ */
+declare var CC_CUSTOM_WORKER: boolean;
+
+/**
+ * 是否启用 Worker 调度模式，这会减少通信次数
+ */
+declare var CC_WORKER_SCHEDULER: boolean;
+
+/**
+ * 是否启用 Worker 调试模式
+ */
+declare var CC_WORKER_DEBUG: boolean;
+
+/**
+ * 是否启用 Worker 使用同步版本的文件系统 API
+ */
+declare var CC_WORKER_FS_SYNC: boolean;
+
+/**
+ * 是否启用 Worker 驱动资源管线
+ */
+declare var CC_WORKER_ASSET_PIPELINE: boolean;
+
+/**
+ * 是否启用 Worker 驱动音频系统
+ */
+declare var CC_WORKER_AUDIO_SYSTEM: boolean;
+
+/**
+ * Worker 音频系统同步音频属性的间隔时间（单位：毫秒）
+ */
+declare var CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL: number;
+

extension/templates/2.4.13/2.2.0/worker/jsconfig.json

@@ -0,0 +1,13 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "target": "ES5",
+        "skipLibCheck": true,
+        "downlevelIteration": true,
+        "allowSyntheticDefaultImports": true,
+    },
+    "include": [
+        "src",
+        "creator-worker.d.ts"
+    ],
+}

extension/templates/2.4.13/2.2.0/worker/src/index.js

@@ -0,0 +1,3 @@
+// 该文件会在 Worker 初始化时执行，可在这里初始化或者引用其它脚本
+// This file will be executed when the Worker is initialized, either initialize it here or require another script.
+require("math.js");

extension/templates/2.4.13/2.2.0/worker/src/math.js

@@ -0,0 +1,9 @@
+const { registerHandler } = require("ipc-worker.js");
+
+export function add(x, y, callback) {
+    callback(x + y);
+}
+
+registerHandler("math", {
+    add,
+});

extension/templates/2.4.13/2.3.0/worker/creator-worker.d.ts

@@ -0,0 +1,76 @@
+declare namespace worker {
+    export const createInnerAudioContext: any;
+    export const connectSocket: any;
+    export function createSharedArrayBuffer(size: number): WXSharedArrayBuffer;
+    export const downloadFile: any;
+    export const env: { USER_DATA_PATH: string };
+    export const getFileSystemManager: any;
+    export const onMessage: any;
+    export const postMessage: any;
+    export const request: any;
+    export const uploadFile: any;
+    export interface WXSharedArrayBuffer {
+        buffer: SharedArrayBuffer;
+    }
+}
+
+declare module "ipc-worker.js" {
+    /**
+     * 是否初始化完成
+     * 
+     * - 初始化完成后，宏才被设为有效值
+     */
+    export const inited: boolean;
+
+    /**
+     * 访问主线程的入口
+     */
+    export const main: any;
+
+    /**
+     * 注册主线程可以访问的入口
+     * 
+     * 请务必在脚本执行时调用才有效。
+     */
+    export function registerHandler(name: string, handler: object): void;
+}
+
+/**
+ * 是否启用自定义 Worker
+ */
+declare var CC_CUSTOM_WORKER: boolean;
+
+/**
+ * 是否启用 Worker 调度模式，这会减少通信次数
+ */
+declare var CC_WORKER_SCHEDULER: boolean;
+
+/**
+ * 是否启用 Worker 调试模式
+ */
+declare var CC_WORKER_DEBUG: boolean;
+
+/**
+ * 是否启用 Worker 使用同步版本的文件系统 API
+ */
+declare var CC_WORKER_FS_SYNC: boolean;
+
+/**
+ * 是否启用 Worker 驱动资源管线
+ */
+declare var CC_WORKER_ASSET_PIPELINE: boolean;
+
+/**
+ * 是否启用 Worker 驱动音频系统
+ */
+declare var CC_WORKER_AUDIO_SYSTEM: boolean;
+
+/**
+ * Worker 音频系统同步音频属性的间隔时间（单位：毫秒）
+ */
+declare var CC_WORKER_AUDIO_SYSTEM_SYNC_INTERVAL: number;
+
+/**
+ * 是否启用 Worker 驱动 HTTP 请求
+ */
+declare var CC_WORKER_HTTP_REQUEST: boolean;

extension/templates/2.4.13/2.3.0/worker/jsconfig.json

@@ -0,0 +1,13 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "target": "ES5",
+        "skipLibCheck": true,
+        "downlevelIteration": true,
+        "allowSyntheticDefaultImports": true,
+    },
+    "include": [
+        "src",
+        "creator-worker.d.ts"
+    ],
+}

extension/templates/2.4.13/2.3.0/worker/src/index.js

@@ -0,0 +1,3 @@
+// 该文件会在 Worker 初始化时执行，可在这里初始化或者引用其它脚本
+// This file will be executed when the Worker is initialized, either initialize it here or require another script.
+require("math.js");

extension/templates/2.4.13/2.3.0/worker/src/math.js

@@ -0,0 +1,9 @@
+const { registerHandler } = require("ipc-worker.js");
+
+export function add(x, y, callback) {
+    callback(x + y);
+}
+
+registerHandler("math", {
+    add,
+});