連續的WebWorker通訊和查詢

Question

我正在嘗試創建一個WebWorker，我的意思是我已經創建了它，它在Angular應用程序中，並且我想查詢該工作程序以獲取各種東西，主要是權限（不需要諸如“對於用戶工作程序來說，資源不是很密集的）等等，我計划將來在這些網絡工作者上分擔更多的工作”）。

問題在於，我似乎丟失了一些消息 -因為我向它發送了3-4個請求，而我僅收到2條回復，或者類似這樣的事情，我在2個月前放棄了此內容，但我想重新開始在這里有一個問題。

代碼如下：

.factory('permissionsWorker', ['$q', '$timeout', function ($q, $timeout) {

        'use strict';

        // Returns a function, that, as long as it continues to be invoked, will not
        // be triggered. The function will be called after it stops being called for
        // N milliseconds. If `immediate` is passed, trigger the function on the
        // leading edge, instead of the trailing.
        function debounce(func, wait, immediate) {
            var timeout;
            return function() {
                var context = this, args = arguments;
                var later = function() {
                    timeout = null;
                    if (!immediate) {func.apply(context, args);}
                };
                var callNow = immediate && !timeout;
                clearTimeout(timeout);
                timeout = setTimeout(later, wait);
                if (callNow) {func.apply(context, args);}
            };
        }

        var makeWorker;

        var myWorker = new Worker('/src/workers/permissionsWEeBWorkerSource.js');


        makeWorker = function(functionName, functionParams) {
            //console.log('makeWorker instance for ', functionName);
            var deferred;
            deferred = $q.defer();

            myWorker.postMessage({
                'functionName': functionName,
                'functionArgs': Array.prototype.slice.call(functionParams)
            });

            myWorker.onmessage = function(oEvent) {

                if (oEvent.data) {
                    console.info('Worker responded TRUE', oEvent.data);
                    deferred.resolve(oEvent.data);
                } else {
                    console.info('Worker responded FALSE', oEvent.data);
                    deferred.reject('Action not allowed');
                }
            };

            return deferred.promise;
        };

        return {

            canI: function canI(permission){
                return makeWorker('canI', [permission]); // jshint ignore:line
            },
            setRole: function setRole(role){
                return makeWorker('setRole', [role]);
            },
            setRoleSettings: function setRoleSettings(roleSettings){
                return makeWorker('setRoleSettings', [roleSettings]);
            },
            setActions: function setActions(allActions){
                return makeWorker('setActions', [allActions]);
            }

            /*f: function f(functionName, functionParams) {

             if (arguments.length < 2) {
             throw new TypeError('Not enough arguments. ' +
             'The first param is a function name as string. ' +
             'The second is an array of data types');
             }

             if (typeof arguments[0] !== 'string') {
             throw new TypeError('First parameter must be a string. ' +
             'This is the name of the function');
             }

             if (!Array.isArray(arguments[1])) {
             throw new TypeError('Second parameter must be an array. ' +
             'This is an array of data to be processed');
             }

             return makeWorker(functionName, functionParams);

             }*/

        };

    }

工人本身看起來像這樣：

/*global onmessage:true */

'use strict';

/** Methods:
 * - canI > param string
 * - setRole > param string
 * - setRoleSettings > param object
 * - setActions > param object
 * */

var role, roles, roleSettings, actions;


var functionsObject = {

    canI: function canI(permission) {
        console.group('WebWorker - Ask for permission:');
        console.info(permission);
        console.groupEnd();
        //TODO: Logic here
        postMessage(true); // jshint ignore:line
    },

    setRole: function setRole(activeRole) {

        console.group('WebWorker - Role received');
        console.table(actions);
        console.groupEnd();

        role = activeRole;

        //TODO: Logic here
        postMessage(true); // jshint ignore:line
    },

    setRoleSettings: function setRoleSettings(settings) {
        console.group('WebWorker - Role Settings received');
        console.table(settings);
        console.groupEnd();
        //TODO: Logic here
        postMessage(true); // jshint ignore:line
    },

    setActions: function setActions(actions) {
        console.group('WebWorker - Configuration received');
        console.table(actions);
        console.groupEnd();
        //TODO: Logic here
        postMessage(true); // jshint ignore:line
    }
};



onmessage = function onmessage(oEvent) {
  if (oEvent.data instanceof Object &&
    oEvent.data.hasOwnProperty('functionName') &&
    oEvent.data.hasOwnProperty('functionArgs')) {

    functionsObject[oEvent.data.functionName].apply(self, oEvent.data.functionArgs);

  }

};

我知道工作人員本身大多用於單個實例-單個用例，但對我來說似乎工作了一半。 我輸入一些數據，然后查詢它的響應，我想知道我做錯了什么，也許是諾言。

我將繼續嘗試並完成這項工作，希望我也能從這里得到一些好的反饋。

謝謝！

Answer 1

似乎每次您呼叫工作人員時，您都在設置一個新的onmessage回調。 如果前一個呼叫尚未返回，那么當它返回時，它將嘗試解決/拒絕另一個呼叫的承諾，這可能會顯示消息已丟失，因為每個承諾只能被解決/拒絕一次。

進行此排序的一種方法是為工作人員以及對工作人員的每個請求提供一個永久的onmessage回調

• 創建一個唯一的ID
• 通過此ID存儲延遲的對象
• 將ID以及完成工作所需的實際數據傳遞給工作人員

然后，當工作程序完成時，它可以將ID傳遞回主線程，該主線程可以檢索與此ID關聯的延遲對象，並適當地解析/拒絕其諾言。