---
title: Worker
slug: Web/API/Worker
tags:
  - API
  - DOM
translation_of: Web/API/Worker
---
<p>{{APIRef("Web Workers API")}}</p>

<p>L'interfaccia <strong><code>Worker</code></strong> delle <a href="/en-US/docs/Web/API/Web_Workers_API">Web Workers API</a> rappresenta un processo in background che può essere facilmente generato e in grado di inviare messaggi al creatore. Per creare un worker basta specificare nel metodo costruttore <code>Worker()</code> lo script che sarà incaricato di eseguire.</p>

<p>I Workers saranno poi in grado di inizializzare ulteriori workers fintanto che questi workers hanno la stessa <a href="/en-US/docs/Web/Security/Same-origin_policy">origine</a> della pagina su cui sono ospitati (NB: l'annidamento di workers <a href="https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/5R3B4RN4GHU">non è ancora implementato in Blink</a>).  I workers possono tuttavia usare <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> per richiamare risorse esterne, a patto che gli attributi <code>responseXML</code> e <code>channel</code> di <code>XMLHttpRequest</code> restituiscano <code>null</code>.</p>

<p><a href="/En/DOM/Worker/Functions_available_to_workers" title="En/DOM/Worker/Functions available to workers">Non tutte le interfacce nè i metodi sono disponibili</a> nel contesto dello script interpretato da un <code>Worker</code>.</p>

<p>Se si vuole utilizzare i workers nelle estensioni per Firefox ed avere accesso a <a href="/en/js-ctypes" title="en/js-ctypes">js-ctypes</a>, bisogna utilizzare l'interfaccia {{ domxref("ChromeWorker") }}.</p>

<h2 id="Costruttori">Costruttori</h2>

<dl>
 <dt>{{domxref("Worker.Worker", "Worker()")}}</dt>
 <dd>Crea un  worker che eseguirà lo script specificato nella URL. I Workers possono essere anche invocati tramite <a href="/en-US/docs/Web/API/Blob">Blobs</a>.</dd>
</dl>

<h2 id="Proprietà">Proprietà</h2>

<p><em>Eredita proprietà dal suo parent, {{domxref("EventTarget")}}, e implementa quelle di {{domxref("AbstractWorker")}}.</em></p>

<h3 id="Eventi_gestiti">Eventi gestiti</h3>

<dl>
 <dt>{{domxref("AbstractWorker.onerror")}}</dt>
 <dd>Un {{ domxref("EventListener") }} invocato quando un {{domxref("ErrorEvent")}} di tipo <code>error</code> arriva al worker. Questo evento è ereditato da {{domxref("AbstractWorker")}}.</dd>
 <dt>{{domxref("Worker.onmessage")}}</dt>
 <dd>Un {{ domxref("EventListener") }} invocato quando  un {{domxref("MessageEvent")}} di tipo <code>message</code> arriva al worker — Per esempio quando un messaggio viene inviato al documento parent da un worker tramite {{domxref("DedicatedWorkerGlobalScope.postMessage")}}. Il messaggio viene salvato nella proprietà {{domxref("MessageEvent.data", "data")}} dell'evento.</dd>
 <dt>{{domxref("Worker.onmessageerror")}}</dt>
 <dd>Un {{domxref("EventHandler")}} che rappresenta il codice da invocare quando l'evento {{event("messageerror")}} è invocato.</dd>
</dl>

<dl>
</dl>

<h2 id="Metodi">Metodi</h2>

<p><em>Eredita i metodi del suo parent, {{domxref("EventTarget")}}, e quelli di {{domxref("AbstractWorker")}}.</em></p>

<dl>
 <dt>{{domxref("Worker.postMessage()")}}</dt>
 <dd>Invia un messaggio (<code>any</code> JavaScript object) al contesto interno del worker.</dd>
 <dt>{{domxref("Worker.terminate()")}}</dt>
 <dd>Termina immediatamente il worker troncando qualsiasi operazione in corso. Le istanze di ServiceWorker non supportano questo metodo.</dd>
</dl>

<h2 id="Esempio">Esempio</h2>

<p>Il codice che segue mostra la creazione di un oggetto {{domxref("Worker")}} usando il costruttore {{domxref("Worker.Worker", "Worker()")}} e l'invio di un messaggio:</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('Messaggio inviato al worker');
}</pre>

<p>Per un esempio completo: <a class="external external-icon" href="https://github.com/mdn/simple-web-worker">Esempio worker</a> (<a class="external external-icon" href="http://mdn.github.io/simple-web-worker/"> esegui worker</a>).</p>

<h2 id="Specifiche"><br>
 Specifiche</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="Compatibilità_Browser">Compatibilità Browser</h2>

<p>Il supporto dipende per ciascun tipo di worker. Controlla le pagine dei singoli worker per avere maggiori dettagli.</p>



<p>{{Compat("api.Worker")}}</p>

<h3 id="Cross-origin_worker_comportamento_in_caso_di_errore">Cross-origin worker, comportamento in caso di errore</h3>

<p>Nelle prime implementazioni browser caricare uno script cross-origin per un worker causava un errore <code>SecurityError</code>; nelle implementazioni piu' recenti invece viene generato un evento {{event("error")}} per rispettare le specifiche. Puoi trovare maggiori informazioni su come gestire queste situazioni qui: <a href="https://www.fxsitecompat.com/en-CA/docs/2016/loading-cross-origin-worker-now-fires-error-event-instead-of-throwing-worker-in-sandboxed-iframe-no-longer-allowed/">Loading cross-origin worker now fires error event instead of throwing; worker in sandboxed iframe no longer allowed</a>.</p>

<h2 id="Vedi_Anche">Vedi Anche</h2>

<ul>
 <li><a class="internal" href="/En/Using_web_workers" title="en/Using DOM workers">Usare workers web</a></li>
 <li><a href="/En/DOM/Worker/Functions_available_to_workers" title="https://developer.mozilla.org/En/DOM/Worker/Functions_available_to_workers">Funzioni disponibili nei workers</a></li>
 <li>Altri tipi di workers: { domxref("SharedWorker") }} e <a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker</a>.</li>
 <li>Non standard, Gecko-specific workers usati dalle estensioni: {{ domxref("ChromeWorker") }}</li>
</ul>