电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛

标题: 深入 HTML5 Web Worker 应用实践：多线程编程（2）工作线程（Web Worker）API 接口 [打印本页]

作者: look_w 时间: 2018-10-18 16:49 标题: 深入 HTML5 Web Worker 应用实践：多线程编程（2）工作线程（Web Worker）API 接口

工作线程（Web Worker）API 接口类库和脚本的访问和引入对于类库和脚本的访问和引入，规范中规定可以使用 WorkerGlobalScope 对象的 importScripts(urls) 方法来引入网络中的脚本资源。当用户调用这个方法引入资源的时候会执行下面的步骤来完成这个操作：

如果没有给 importScripts 方法任何参数，那么立即返回，终止下面的步骤。
解析 importScripts 方法的每一个参数。
如果有任何失败或者错误，抛出 SYNTAX_ERR 异常。
尝试从用户提供的 URL 资源位置处获取脚本资源。
对于 importScripts 方法的每一个参数，按照用户的提供顺序，获取脚本资源后继续进行其它操作。

清单 6. 外部资源脚本引入和访问示例代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

/**
* 使用 importScripts 方法引入外部资源脚本，在这里我们使用了数学公式计算工具库 math_utilities.js
* 当 JavaScript 引擎对这个资源文件加载完毕后，继续执行下面的代码。同时，下面的的代码可以访问和调用
* 在资源文件中定义的变量和方法。
**/
importScripts('math_utilities.js');

/**
* This worker is used to calculate
* the least common multiple
* and the greatest common divisor
*/
onmessage = function (event)
{
var first=event.data.first;
var second=event.data.second;
calculate(first,second);
};

/*
* calculate the least common multiple
* and the greatest common divisor
*/
function calculate(first,second) {
//do the calculation work
var common_divisor=divisor(first,second);
var common_multiple=multiple(first,second);
postMessage("Work done! " +
"The least common multiple is "+common_divisor
+" and the greatest common divisor is "+common_multiple);
}

工作导航器对象（WorkerNavigator）在 HTML5 中， WorkerUtils 接口的 navigator 属性会返回一个工作导航器对象（WorkerNavigator），这个对象定义并且代表了用户代理（即 Web 客户端）的标识和状态。因此，用户和 Web 脚本开发人员可以在多线程开发过程中通过这个对象来取得或者确定用户的状态。

工作导航器对象（WorkerNavigator） WorkerUtils 抽象接口的 navigator 属性会返回一个 WorkerNavigator 用户接口，用于用户代理的识别的状态标识。我们来看下 WorkerNavigator 接口的定义。
WorkerNavigator 接口定义清单 7. WorkerNavigator 接口定义代码
1
2
3
interface WorkerNavigator {};
WorkerNavigator implements NavigatorID;
WorkerNavigator implements NavigatorOnLine;

其中，有一点需要注意：如果接口的相对命名空间对象为 Window 对象的时候，WorkerNavigator 对象一定不可以存在，即无法再使用这个对象。

创建与终止线程在讲解创建新的工作线程之前，我们先看下 W3C 规范对工作线程的定义。工作线程规范中定义了线程的抽象接口类 AbstractWorker ，专用线程以及共享线程都继承自该抽象接口。专用线程以及共享线程的创建方法读者可以参考第一小节中的示例代码。下面是此抽象接口的定义。

AbstractWorker 抽象接口清单 8. AbstractWorker 抽象接口代码
1
2
3
4
5
6
[Supplemental, NoInterfaceObject]
interface AbstractWorker {
attribute Function onerror;

};
AbstractWorker implements EventTarget;

此外，该接口还定义了错误处理的事件处理器 onerror，当工作线程在通信过程中遇到错误时便会触发这个事件处理器。

专用线程及其定义清单 9. 专用线程定义代码

1
2
3
4
5
6
7

[Constructor(in DOMString scriptURL)]
interface Worker : AbstractWorker {
void terminate();

void postMessage(in any message, in optional MessagePortArray ports);
attribute Function onmessage;
};

当创建完线程以后，我们可以调用 terminate() 方法去终止一个线程。每个专用线程都拥有一个隐式的 MessagePort 对象与之相关联。这个端口随着线程的创建而被创建出来，但并没有暴露给用户。所有的基于这个端口的消息接收都以线程本身为目标。

共享线程及其定义清单 10. 共享线程定义代码
1
2
3
4
[Constructor(DOMString scriptURL, optional DOMString name)]
interface SharedWorker : AbstractWorker {
readonly attribute MessagePort port;
};

共享线程同专用线程一样，当创建完线程以后，我们可以调用 terminate() 方法去终止一个共享线程。

工作线程位置属性工作线程被创建出来以后，需要记录它的状态以及位置信息，在工作线程规范中定义了 WorkerLocation 来表示它们的位置。接口定义如下：
清单 11. 共享线程定义代码

1
2
3
4
5
6
7
8
9
10
11

interface WorkerLocation {
// URL decomposition IDL attributes
stringifier readonly attribute DOMString href;
readonly attribute DOMString protocol;
readonly attribute DOMString host;
readonly attribute DOMString hostname;
readonly attribute DOMString port;
readonly attribute DOMString pathname;
readonly attribute DOMString search;
readonly attribute DOMString hash;
};

WorkerLocation 对象表示了工作线程脚本资源的绝对 URL 信息。我们可以使用它的 href 属性取得这个对象的绝对 URL。WorkerLocation 接口还定义了与位置信息有关的其它属性，例如：用于信息传输的协议（protocol），主机名称（hostname），端口（port），路径名称（pathname）等。

欢迎光临电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛 (http://bbs.eccn.com/)