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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
|
---
title: Worker
slug: Web/API/Worker
translation_of: Web/API/Worker
---
<p>{{APIRef("Web Workers API")}}</p>
<p>Das <strong><code>Worker</code></strong> Interface der <a href="/en-US/docs/Web/API/Web_Workers_API">Web Workers API</a> beschreibt eine im Hintergrund ausgeführte Programmlogik, die leicht erstellt werden kann und Nachrichten mit dem Ersteller austauschen. Einen Worker erzeugen erfolgt einfach über den Aufruf des <code>Worker()</code> Konstruktors unter Angabe eines Scripts, welches in dem Worker Thread ausgeführt werden soll.</p>
<p>Worker selbst können zudem weitere (sog. "verschachtelte") Worker erzeugen, solange diese in demselben <a href="/en-US/docs/Web/Security/Same-origin_policy">origin</a> wie die übergeordnete Seite liegen (Achtung: verschachtelte Worker sind <a href="https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/5R3B4RN4GHU">aktuell nicht in Blink implementiert</a>). Zusätzlich können Worker das <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> nutzen, um auf Netzwerk I/O zuzugreifen, unter der Voraussetzung, dass die Attribute <code>responseXML</code> und <code>channel</code> des <code>XMLHttpRequest</code> immer den Wert <code>null </code>zurück liefern.</p>
<p><a href="/En/DOM/Worker/Functions_available_to_workers" title="En/DOM/Worker/Functions available to workers">Nicht alle Interfaces und Funktionen sind verfügbar</a> für das mit dem <code>Worker</code> assoziierte Script.</p>
<p>Zur Verwendung eines <code>Worker</code>s mit Zugriff auf <a href="/en/js-ctypes" title="en/js-ctypes">js-ctypes</a> in Browser-Erweiterungen (Extension) für den Firefox bitte das {{ domxref("ChromeWorker") }} Objekt nutzen.</p>
<h2 id="Constructors">Constructors</h2>
<dl>
<dt>{{domxref("Worker.Worker", "Worker()")}}</dt>
<dd>Erzeugt einen neuen Web Worker, der das über seine URL referenzierte Script ausführt. Worker können auch über <a href="/en-US/docs/Web/API/Blob">Blobs</a> erzeugt werden.</dd>
</dl>
<h2 id="Properties">Properties</h2>
<p><em>Erbt die Eigenschaften seines parents, {{domxref("EventTarget")}}, und implementiert die Eigenschaften von {{domxref("AbstractWorker")}}.</em></p>
<h3 id="Event_handlers">Event handlers</h3>
<dl>
<dt>{{domxref("AbstractWorker.onerror")}}</dt>
<dd>Ein {{ domxref("EventListener") }}, welcher jedesmal dann aufgerufen wird, wenn ein {{domxref("ErrorEvent")}} des Typs <code>error</code> den Worker erreicht. Dies ist geerbt von {{domxref("AbstractWorker")}}.</dd>
<dt>{{domxref("Worker.onmessage")}}</dt>
<dd>Ein {{ domxref("EventListener") }}, welcher jedesmal dann aufgerufen wird, wenn ein {{domxref("MessageEvent")}} des Typs <code>message</code> den Worker erreicht — d.h. der Worker erhält eine Nachricht von seinem übergeordneten document via {{domxref("DedicatedWorkerGlobalScope.postMessage")}}. Diese Nachricht wird innerhalb des Events in der {{domxref("MessageEvent.data", "data")}} Eigenschaft gespeichert.</dd>
<dt>{{domxref("Worker.onmessageerror")}}</dt>
<dd>Der {{event("Event_handlers", "event handler")}}, dessen Code aufgerufen werden soll, wenn es zu einem {{event("messageerror")}} Event kommt.</dd>
</dl>
<dl>
</dl>
<h2 id="Methods">Methods</h2>
<p><em>Erbt die Methoden seines parents, {{domxref("EventTarget")}}, und implementiert die Methoden von {{domxref("AbstractWorker")}}.</em></p>
<dl>
<dt>{{domxref("Worker.postMessage()")}}</dt>
<dd>Sendet eine Nachricht an den Worker. Diese kann dabei aus einem <code>beliebigen</code> JavaScript Objekt bestehen.</dd>
<dt>{{domxref("Worker.terminate()")}}</dt>
<dd>Beendet den Worker unmittelbar. Hierüber besteht dabei nicht die Möglichkeit, dem Worker die Gelegenheit für ein geordnetes Beenden von laufenden Operationen zu geben. Vielmehr wird der Worker sofort beendet. ServiceWorker Instanzen unterstützen diese Methode nicht.</dd>
</dl>
<h2 id="Example">Example</h2>
<p>Das nachfolgende Beispiel zeigt wie ein {{domxref("Worker")}} mittels des {{domxref("Worker.Worker", "Worker()")}} Konstruktors erzeugt und verwendet wird:</p>
<pre class="brush: js">var myWorker = new Worker('worker.js');
var first = document.querySelector('#number1');
var second = document.querySelector('#number2');
first.onchange = function() {
myWorker.postMessage([first.value,second.value]);
console.log('Message posted to worker');
}</pre>
<p>Ein vollständiges Beispiel findet sich hier: <a class="external external-icon" href="https://github.com/mdn/simple-web-worker">Basic dedicated worker example</a> (<a class="external external-icon" href="http://mdn.github.io/simple-web-worker/">run dedicated worker</a>).</p>
<h2 id="Specifications">Specifications</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('HTML WHATWG', "#worker", "Worker")}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>Die Unterstützung der einzelnen Worker ist abhängig vom Typ und variiert. Wie ein Worker konkret unterstützt wird, kann der Seite zu dem Worker Typ entnommen werden.</p>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Edge</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td>Basic support</td>
<td>4</td>
<td>{{CompatVersionUnknown}}</td>
<td>3.5</td>
<td>10.0</td>
<td>10.6</td>
<td>4</td>
</tr>
<tr>
<td>Constructor <code>name</code> option</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoDesktop(55)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td><code>onmessageerror</code></td>
<td>60</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoDesktop(57)}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Edge</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Phone</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
<th>Chrome for Android</th>
</tr>
<tr>
<td>Basic support</td>
<td>4.4</td>
<td>{{CompatVersionUnknown}}</td>
<td>3.5</td>
<td>10.0</td>
<td>11.5</td>
<td>5.1</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td>Constructor <code>name</code> option</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile(55)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
<tr>
<td><code>onmessageerror</code></td>
<td>60</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile(57)}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<h3 id="Cross-origin_worker_error_behaviour">Cross-origin worker error behaviour</h3>
<p>In früheren Browserversionen kam es zu einem <code>SecurityError</code> bei dem Versuch ein Script für einen cross-origin worker zu laden. In neueren Browsern wird, aufgrund einer Änderung der Spezifikation, stattdessen ein {{event("error")}} Event erzeugt.</p>
<h2 id="See_also">See also</h2>
<ul>
<li><a class="internal" href="/En/Using_web_workers" title="en/Using DOM workers">Using web workers</a></li>
<li><a href="/En/DOM/Worker/Functions_available_to_workers" title="https://developer.mozilla.org/En/DOM/Worker/Functions_available_to_workers">Functions available to workers</a></li>
<li>Andere Workers Typen {{ domxref("SharedWorker") }} und <a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker</a>.</li>
<li>Nicht Standard, die Gecko-spezifischen Workers {{ domxref("ChromeWorker") }}, für Browser-Erweiterungen.</li>
</ul>
|
