新增多线程错误捕获到主线程

Author: Haskely

Workers/AudioProcesserWorker.js

@@ -34,25 +34,21 @@ async function main() {
     const { MyWorkerScript, AudioContainer, AudioData, StftData, Float32Matrix } = await init_import();
     const pinyin = await prepare_pinyin();
     const myWorkerScript = new MyWorkerScript(self);
-    function log(msg) {
-        // console.log(`[MyWorkerScript]${msg}`);
-        myWorkerScript.sendData('Log', msg);
-    };
     myWorkerScript.reciveData('initInfo',
         async (dataContent) => {
-            log(`收到initInfo,准备初始化audioContainer`);
+            myWorkerScript.log(`收到initInfo,准备初始化audioContainer`);
             self.audioContainer = new AudioContainer(
                 dataContent.sampleRate,
                 dataContent.fft_s,
                 dataContent.hop_s,
                 dataContent.numberOfChannels,
                 dataContent.max_duration,
                 false);
-            log(`准备加载model...`);
+            myWorkerScript.log(`准备加载model...`);
             self.model = await init_model();
             const len = Math.round(self.audioContainer.max_duration / self.audioContainer.hop_s);
             self.model.predict(tf.zeros([1, len, 129]));
-            log(`当前tensorflowJS的Backend:${tf.getBackend()}`);
+            myWorkerScript.log(`当前tensorflowJS的Backend:${tf.getBackend()}`);
             myWorkerScript.sendData('Event', 'inited');
         }
     );

Workers/MyWorker.js

@@ -7,15 +7,22 @@ class MyWorker {
             if (this.reciveDataFunctions[data.type] instanceof Function) {
                 this.reciveDataFunctions[data.type](data.content);
             } else {
-                console.error(`收到的data.type:${data.type}没有注册处理函数！`);
+                console.error(`[MyWorker]收到的data.type:${data.type}没有注册处理函数！`);
                 console.log(data);
             };
         };
+        this.Worker.onerror = function (err) {
+            console.log('[MyWorker]worker is suffering!', err)
+        };
         this.reciveDataFunctions = {};
+        this.reciveData('Log', (msg) => { console.log(`[MyWorkerScript]${msg}`); });
+        this.reciveData('Error', (error_args) => {
+            console.error(`[MyWorkerScript]遇到错误！\n${error_args}`);
+        });
         this.reciveData('UnknownDatatype', (data) => {
-            console.error(`[MainThread]发送给${this.WebWorkScriptURL}的data.type为:${data.type}的数据其MyWorkerScript没有注册处理函数！`);
+            console.error(`[MyWorker]发送给${this.WebWorkScriptURL}的data.type为:${data.type}的数据其MyWorkerScript没有注册处理函数！`);
             console.log(data);
-        })
+        });
     };
 
     sendData = (dataType, dataContent, transferList = []) => {
@@ -26,23 +33,43 @@ class MyWorker {
     };
 
     reciveData = (dataType, dealDataContent = (dataContent) => { }) => {
+        if (this.reciveDataFunctions[dataType]) console.warn(`警告！dataType:${dataType}的处理函数已经存在,进行覆盖！`)
         this.reciveDataFunctions[dataType] = dealDataContent;
     };
+
+    unreciveData = (dataType) => {
+        if (dataType in this.reciveDataFunctions) delete this.reciveDataFunctions[dataType];
+    };
 };
 
 class MyWorkerScript {
     constructor(worker_self) {
-        this.reciveDataFunctions = {};
         this.worker_self = worker_self;
-        worker_self.onmessage = ({ data }) => {
+        this.reciveDataFunctions = {};
+
+        this.worker_self.onmessage = ({ data }) => {
             if (this.reciveDataFunctions[data.type] instanceof Function) {
                 this.reciveDataFunctions[data.type](data.content);
             } else {
-                console.error(`[WorkerThread]收到的data的data.type:${data.type}没有注册处理函数！`);
+                console.error(`[MyWorkerScript]收到的data的data.type:${data.type}没有注册处理函数！`);
                 console.log(data);
                 this.sendData('UnknownDatatype', data);
             };
         };
+        this.worker_self.onerror = (...args) => {
+            this.sendData('Error', args);
+        };
+
+        this.worker_self.addEventListener('unhandledrejection', (event) => {
+            // the event object has two special properties:
+            // event.promise - the promise that generated the error
+            // event.reason  - the unhandled error object
+            this.sendData('Error', event.reason);
+        });
+    };
+
+    log = (msg) => {
+        this.sendData('Log', msg);
     };
 
     sendData = (dataType, dataContent, transferList = [], targetOrigin = undefined) => {

main.js

@@ -84,8 +84,6 @@ switch_btn.onclick = async function (e) {
 const sampleRate = 8000, fft_s = 0.032, hop_s = 0.008;
 const audioContainer = new AudioContainer(sampleRate, fft_s, hop_s, 1, 10);
 const myWorker = new MyWorker('./Workers/AudioProcesserWorker.js');
-myWorker.reciveData('Log', (msg) => { console.log(`[MyWorkerScript]${msg}`); });
-// myWorker.reciveData('predict_res', (content) => { console.log(`输出长度:${content.length},${content[0].length},${content[0][0].length}`) });
 myWorker.reciveData('pinyinArray', (pinyinArray) => { console.log(pinyinArray) });
 myWorker.reciveData('Event', (content) => {
     switch (content) {