Best IT Recipes

HTML5 web workers work in Firefox 4 but not in Chrome 12.0.742.122

When I tried to play with the Web Workers feature in HTML5, my firefox worked happily, but Chrome complains that:

Uncaught TypeError: Unable to call postMessage method from undefinedxstartWorkerworker.html: 7 (anonymous function) worker.html: 1 onclickworker.html: 2

worker.html

<button onclick="xstartWorker()">Start worker</button> <output id="result"></output> <script> function xstartWorker() { worker.postMessage({'cmd': 'startWorker', 'msg': 'Start now!'}); } var worker = new Worker('worker.js'); worker.addEventListener('message', function(e) { document.getElementById('result').textContent = e.data; } , false); </script>

worker.js

 self.addEventListener('message', function(e) { var data = e.data; switch (data.cmd) { case 'startWorker': self.postMessage('worker thread start now:' + data.msg); break; default: self.postMessage('default'); } } , false);

What can I do to make it work in chrome?

By the way, when I tried the sample at http://playground.html5rocks.com/#inline_workers and this time chrome works, but firefox complains that

Error: working undefined Source file: http://playground.html5rocks.com/ Line: 39

+9
javascript html5 firefox google-chrome
Jul 25 2018-11-11T00:
source share
2 answers

I assume that you are trying to run this on your local machine, and not on a web server. Workers are limited to Same Origin Policy , but as a link to a Wikipedia page

The behavior of checks with the same origin and related mechanisms are not clearly defined in some cases, for example, for protocols that do not have a clearly defined host name or port associated with their URL (file :, data :, etc. .).

Downloading a local file, even with a relative URL, is the same as downloading a file using the file: protocol. Therefore, I assume that the problem is that you are trying to download worker.js as a local file - Chrome doesn't like this (for some security reasons), although you can make the problem run Chrome as follows: chrome.exe --allow-file-access-from-files

Alternatively, try using your script on a local or remote web server and see if this fixes the problem. (If you have Python installed, you can go to the appropriate directory and run python -m SimpleHTTPServer 8000 , and then go to http: // localhost: 8000 / in your browser).

+7
Jul 25 '11 at 23:32
source share

Chrome can use the desktop locally without --allow-file-access-from-files . The worker must be loaded as a blob.

Example:

 <body> <button>Start</button> <div id="output"></div> <script id="worker_1" type="text/js-worker"> importScripts(base_url + '/worker_lib2.js'); function run(event) { var msg = event.data; this.postMessage({ answer: hello(event.data.name)}); } this.addEventListener('message', run, false); </script> <script> var base_url = window.location.href.replace(/\\/g,'/').replace(/\/[^\/]*$/, ''); var array = ['var base_url = "' + base_url + '";' + $('#worker_1').html()]; var blob = new Blob(array, {type: "text/javascript"}); $('button').click(function() { var url = window.URL.createObjectURL(blob); console.log(url); var worker = new Worker(url); worker.addEventListener('message', function(event) { $('#output').html(event.data.answer); }, false); worker.postMessage({ name: 'Yannis' }); }); </script> </body>

File worker_lib2.js:

 function hello(msg) { return 'Hello... ' + msg; }
+5
Aug 28 '13 at 14:16
source share


More articles:


All Articles