---
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>