HTML5 worker Learning

Source: Internet
Author: User


<!DOCTYPE HTML><HTML><Head>    <MetaCharSet= "Utf-8" />    <title>HTML5 Thread Interaction Examples</title>    <Scripttype= "Text/javascript"src= "Mainthread.js"> </Script></Head><Body>    <inputtype= "text"ID= "Inputedinteger" />    <inputtype= "button"value= "Click let the main thread send this value to background thread 1"onclick="Html5worker()" /> <PID= "Result"></P> </Body> </HTML>

Mainthread. Js

functionHtml5worker () {//determine if the browser supports    if(typeof(Worker) = = "Undefined") {Console.log ("Sorry your browser does not support worker"); return; }    //Create a Web worker instance    varWorker1 =NewWorker ("Thread1.js"); varIntegerinput = document.getElementById ("Inputedinteger"). Value; varnum = parseint (integerinput, 10); //Cross document messages are transmitted across documents Messaging.     //PostMessage send a message to Thread1Worker1.postmessage (num + "I am the main thread value I will send to Thread1"); //OnMessage Event Listener    //when a web worker passes a message, the code in the event listener is executed. Data from is stored in the Worker1.onmessage =function(event) {//get information from background thread 1 (thread1)        vardata; varWorker2 =NewWorker ("Thread2.js"); Worker2.postmessage (Data+ "I am the main thread value I will send to Thread2"); Worker2.onmessage=function(event) {document.getElementById ("Result"). InnerHTML; }    };}


function (event) {    var result = + "I am the value received by Thread1 I will return";    Console.log ("Thread1");     //    


function (event) {              //  get data from the mainline Cheng    var result = + "I am the value thread2 receive I will return" ;    Console.log ("thread2");     //      postMessage (result);           

Operation Result:

Note that you have to publish to the server to run or otherwise appear:

Uncaught securityerror:failed to construct ' Worker ': Script at ' xxxxthread1.js ' cannot is accessed from Origin ' null '.


1: Create worker instance and pass the corresponding JS file

2: Send Message postMessage ()

3: Listening Message onmessage

4: Stop Terminate () method

5:onerror Error exception

You can also listen to messages in the following ways.

        // Google or IE Register events        if (typeof Window.addeventlistener! = ' undefined ') {            Window.addeventlistener (false  );         Else if (typeof window.attachevent! = ' undefined ') {            window.attachevent (' onmessage ', Messagechange);        }

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.