--- title: SharedWorker slug: Web/API/SharedWorker tags: - API - Interface - NeedsTranslation - Reference - SharedWorker - TopicStub - Web Workers - Workers translation_of: Web/API/SharedWorker ---
{{APIRef("Web Workers API")}}

The SharedWorker interface represents a specific kind of worker that can be accessed from several browsing contexts, such as several windows, iframes or even workers. They implement an interface different than dedicated workers and have a different global scope, {{domxref("SharedWorkerGlobalScope")}}.

Note: If SharedWorker can be accessed from several browsing contexts, all those browsing contexts must share the exact same origin (same protocol, host and port).

Note: In Firefox, shared workers cannot be shared between private (i.e. browsing in a private window) and non-private documents (see {{bug(1177621)}}.)

Constructors

{{domxref("SharedWorker.SharedWorker", "SharedWorker()")}}
Creates a shared web worker that executes the script at the specified URL.

Properties

Inherits properties from its parent, {{domxref("EventTarget")}}, and implements properties from {{domxref("AbstractWorker")}}.

{{domxref("AbstractWorker.onerror")}}
Is an {{domxref("EventListener")}} that is called whenever an {{domxref("ErrorEvent")}} of type error bubbles through the worker.
{{domxref("SharedWorker.port")}} {{readonlyInline}}
Returns a {{domxref("MessagePort")}} object used to communicate and control the shared worker.

Methods

Inherits methods from its parent, {{domxref("EventTarget")}}, and implements methods from {{domxref("AbstractWorker")}}.

Example

In our Basic shared worker example (run shared worker), we have two HTML pages, each of which uses some JavaScript to perform a simple calculation. The different scripts are using the same worker file to perform the calculation — they can both access it, even if their pages are running inside different windows.

The following code snippet shows creation of a SharedWorker object using the {{domxref("SharedWorker.SharedWorker", "SharedWorker()")}} constructor. Both scripts contain this:

var myWorker = new SharedWorker('worker.js');

Both scripts then access the worker through a {{domxref("MessagePort")}} object created using the {{domxref("SharedWorker.port")}} property. If the onmessage event is attached using addEventListener, the port is manually started using its start() method:

myWorker.port.start();

When the port is started, both scripts post messages to the worker and handle messages sent from it using port.postMessage() and port.onmessage, respectively:

first.onchange = function() {
  myWorker.port.postMessage([first.value,second.value]);
  console.log('Message posted to worker');
}

second.onchange = function() {
  myWorker.port.postMessage([first.value,second.value]);
  console.log('Message posted to worker');
}

myWorker.port.onmessage = function(e) {
  result1.textContent = e.data;
  console.log('Message received from worker');
}

Inside the worker we use the {{domxref("SharedWorkerGlobalScope.onconnect")}} handler to connect to the same port discussed above. The ports associated with that worker are accessible in the {{event("connect")}} event's ports property — we then use {{domxref("MessagePort")}} start() method to start the port, and the onmessage handler to deal with messages sent from the main threads.

onconnect = function(e) {
  var port = e.ports[0];

  port.addEventListener('message', function(e) {
    var workerResult = 'Result: ' + (e.data[0] * e.data[1]);
    port.postMessage(workerResult);
  });

  port.start(); // Required when using addEventListener. Otherwise called implicitly by onmessage setter.
}

Specifications

Specification Status Comment
{{SpecName('HTML WHATWG', "#sharedworker", "SharedWorker")}} {{Spec2('HTML WHATWG')}} No change from {{SpecName("Web Workers")}}.

Compatibilidade com navegadores

{{CompatibilityTable}}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Support {{CompatChrome(4)}} {{CompatGeckoDesktop(29.0)}} {{CompatNo}} {{CompatOpera(10.60)}} 5
{{CompatNo}} 6.1
Constructor name option {{CompatVersionUnknown}} {{CompatGeckoDesktop(55)}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}}
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support {{CompatNo}} {{CompatNo}} {{CompatGeckoMobile("33.0")}} {{CompatNo}} 11.5 5.1
{{CompatNo}} 7.1
Constructor name option {{CompatUnknown}} {{CompatVersionUnknown}} {{CompatGeckoMobile(55)}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}}

See also