जावास्क्रिप्ट वेब वर्कर

Question

पर फ़ंक्शंस कैसे पास करें मैं एक वेब मैनेजर के लिए एक पोस्ट मैसेज() के माध्यम से फ़ंक्शन (या फ़ंक्शन) पास करना चाहता हूं, क्योंकि मैं नियमित फ़ाइलों का संदर्भ नहीं दे सकता।

वेब कार्यकर्ता को बंद करने के लिए, मैं एक ऑब्जेक्ट यूआरएल (ब्लॉब से बनाया गया) को वर्कर कन्स्ट्रक्टर में पास कर रहा हूं। तब मैं एक संदेश पास कर रहा हूं, लेकिन अब तक कोई भाग्य संदेश में कोई फंक्शन नहीं डाल रहा है। (JSON) संदेश में फ़ंक्शंस सीधे नहीं हो सकते हैं (जैसा कि here निर्धारित है), और हालांकि आयातक सैद्धांतिक रूप से अनुमति है, मुझे अब तक क्रोम या फ़ायरफ़ॉक्स में इसका उपयोग करने में कोई सफलता नहीं मिली है।

html फ़ाइल के शरीर:

<div id="divText">1234</div> 
<script> 
    var greeter = function greet(name) { 
     return "hello " + name; 
    }; 
    function webWorkerWorker() { 
     self.postMessage("started1"); 
     self.onmessage = function(event) { 
      importScripts(event.data.content); 
      self.postMessage("importScripts success"); 
      var result = greeter("john"); 
      self.postMessage(result); 
     }; 
    } 
    var functionBody = mylib.extractFunctionBody(webWorkerWorker); 
    var functionBlob = mylib.createBlob([functionBody]); 
    var functionUrl = mylib.createObjectURL(functionBlob); 

    var functionBody2 = mylib.extractFunctionBody(greeter); 
    var functionBlob2 = mylib.createBlob([greeter]); 
    var functionUrl2 = mylib.createObjectURL(functionBlob2); 

    var worker = new Worker(functionUrl); 
    worker.onmessage = function(event) { 
     document.getElementById("divText").innerHTML = event.data; 
    } 
    worker.postMessage({ 
       type: "init", 
       content: functionUrl2 
      }); 
</script> 

वर्तमान में यह divText मान "importScripts सफलता" सेटिंग का परिणाम है।

क्या मैं कुछ गलत कर रहा हूं? क्या कोई अन्य तरीका है कि वेब श्रमिकों को कार्य पारित किया जा सकता है? या यह संभव नहीं है?

Answer 1

बाहर कर देता है इस विधि ठीक काम करता है, वहाँ केवल मेरी कार्यकर्ता में एक बग था:

var result = greeter("john"); 

var result = greet("john"); 

जो समझ में आता है होना चाहिए - मैं कार्यकर्ता स्वागतकर्ता चर गुजर रहा हूँ , लेकिन जिस वस्तु को मैं गुजर रहा हूं उसका वैरिएबल नाम जानने के लिए कोई कारण नहीं है।

Answer 2

उन लोगों के लिए जो अधिक सामान्य उत्तर की तलाश में हैं: यहां एक प्लगइन है, जो आपको अपने जावास्क्रिप्ट कोड के किसी भी फ़ंक्शन को थ्रेड में निष्पादित करने की अनुमति देता है।

http://www.eslinstructor.net/vkthread/

के रूप में "समारोह आउटसोर्सिंग" यह विचार करें। आप किसी भी फ़ंक्शन को प्लगइन में तर्क के रूप में पास करते हैं और परिणाम कॉलबैक में प्राप्त करते हैं। आप ऑब्जेक्ट के तरीकों को "आउटसोर्स" कर सकते हैं, निर्भरताओं, अज्ञात फ़ंक्शन और लैम्ब्डा के साथ कार्य कर सकते हैं।

आनंद लें।

--Vadim

Answer 3

हाँ, निश्चित रूप से यह संभव है, मैं इसे लागू किया

यह एक वादा है कि सामान्य कार्यकर्ता

/* 
    @data.context, The context where the callback functions arguments are, ex: window 
    @data.callback, ["fn_name1", "fn_name2", function (fn1, fn2) {}] 
     The callback will be executed, and you can pass other functions to that cb 
    @worker_url string url of generic web worker 
*/ 
function genericWorker(worker_url, data) { 
    return new Promise(function (resolve, reject) { 

     if (!data.callback || !Array.isArray(data.callback)) 
      return reject("Invalid data") 

     var callback = data.callback.pop() 
     var functions = data.callback 
     var context = data.context 

     if (!worker_url) 
      return reject("Worker_url is undefined") 

     if (!callback) 
      return reject("A callback was expected") 

     if (functions.length>0 && !context) 
      return reject("context is undefined") 

     callback = fn_string(callback) //Callback to be executed 
     functions = functions.map((fn_name)=> { return fn_string(context[fn_name]) }) 

     var worker = new Worker(worker_url) 

     worker.postMessage({ callback: callback, functions: functions }) 

     worker.addEventListener('error', function(error){ 
      return reject(error.message) 
     }) 

     worker.addEventListener('message', function(e) { 
      resolve(e.data) 
      worker.terminate() 

     }, false) 


     //From function to string, with its name, arguments and its body 
     function fn_string (fn) { 
      var name = fn.name 
      fn = fn.toString() 

      return { 
       name: name, 
       args: fn.substring(fn.indexOf("(") + 1, fn.indexOf(")")), 
       body: fn.substring(fn.indexOf("{") + 1, fn.lastIndexOf("}")) 
      } 
     } 

    }) 
} 

सामान्य कार्यकर्ता फ़ाइल निष्पादित करेंगे है worker_for_anything.js

self.addEventListener('message', function(e) {  
    var worker_functions = {} //Functions used by callback 
    var args = [] //Arguments of the callback 

    for (fn of e.data.functions) { 
     worker_functions[fn.name] = new Function(fn.args, fn.body) 
     args.push(fn.name) 
    } 

    var callback = new Function(e.data.callback.args, e.data.callback.body) //Callback passed and ready to be executed  
    args = args.map((fn_name) => { return worker_functions[fn_name] }) //FUnctions loaded as arguments 
    var result = callback.apply(null, args) //executing callback with function arguments 
    self.postMessage(result) 

}, false) 

इसका इस्तेमाल करते हुए :)

var data = { 
    context: window, //the context of the functions passed, ex: window for blockCpu 
    callback: ["blockCpu", function (bla) { 
     bla(7000) //blocking for 7000 ms 
     return "bla" //This return is catched in the promise 
    }] 
} 

genericWorker("/worker_for_anything.js", data) 
    .then(function (result){ 
     console.log("result", result) 

    }).catch((error)=> { console.log(error) }) 

//random blocking function 
function blockCpu(ms) { 
    var now = new Date().getTime(); 
    var result = 0 
    while(true) { 
     result += Math.random() * Math.random(); 
     if (new Date().getTime() > now +ms) 
      return; 
    } 
}