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