SharedWorker: SharedWorker() constructor
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Warning:
This script passed to the url element is executed.
APIs like this are known as injection sinks, and are potentially a vector for cross-site scripting (XSS) attacks.
You can mitigate this risk by having a Content Security Policy (CSP) that restricts the locations from which scripts can be loaded, and by always assigning TrustedScriptURL objects instead of strings and enforcing trusted types.
See Security considerations in the Worker() constructor for more information.
The SharedWorker() constructor creates a SharedWorker object that executes the script at the specified URL.
Syntax
new SharedWorker(url)
new SharedWorker(url, name)
new SharedWorker(url, options)
Parameters
url-
A
TrustedScriptURLobject or a string representing the URL of the script or module that the worker will execute. This must be same-origin with the caller's document, or ablob:ordata:URL. The URL is resolved relative to the current HTML page's location. nameOptional-
A string specifying an identifying name for the
SharedWorkerGlobalScoperepresenting the scope of the worker, which is useful for creating new instances of the sameSharedWorkerand debugging. optionsOptional-
An object containing option properties that can set when creating the object instance. Available properties are as follows:
type-
A string specifying the type of worker to create. The value can be
classicormodule. The default used isclassic. credentials-
A string specifying whether the browser sends credentials when importing modules into a module worker. The allowed values are the same as can be passed to the
fetch()request:omit,same-origin, orinclude. The default issame-origin(only include credentials for same-origin requests).This is ignored for classic workers.
name-
A string specifying an identifying name for the
SharedWorkerGlobalScoperepresenting the scope of the worker, which is mainly useful for debugging purposes. -
A string indicating which
SameSitecookies should be available to the worker. Can have one of the following two values:- 'all'
-
SameSite=Strict,SameSite=Lax, andSameSite=Nonecookies will all be available to the worker. This option is only supported in first-party contexts, and is the default in first-party contexts. - 'none'
-
Only
SameSite=Nonecookies will be available to the worker. This option is supported in first-party and third-party contexts, and is the default in third-party contexts.
Exceptions
SecurityErrorDOMException-
Thrown if the document is not allowed to start workers, for example if the URL has an invalid syntax or if the same-origin policy is violated, or if the
sameSiteCookiesvalue is not supported in the given context. NetworkErrorDOMException-
Thrown if the MIME type of the worker script is incorrect. It should always be
text/javascript(for historical reasons other JavaScript MIME types may be accepted). SyntaxErrorDOMException-
Thrown if
urlcannot be parsed. TypeError-
Thrown if the
urlparameter is a string when Trusted Types are enforced by a CSP and no default policy is defined.
Description
The SharedWorker() constructor creates a SharedWorker object that executes the classic script or module at the specified URL.
The script must be same-origin with the associated document, but may itself import scripts or modules that are cross-origin (if permitted by CORS and other restrictions). If a cross-origin worker is required, users must load it from an intermediate same-origin worker or a blob.
For more information see Description in the Worker() constructor.
Examples
For brevity, the following examples don't use Trusted Types. In production your code should always use trusted types when passing data originating from users into injection sinks.
For an example, see Using Trusted Types in the Worker() constructor examples.
Basic usage
The following code snippet shows creation of a SharedWorker object using the SharedWorker() constructor and subsequent usage of the object:
const myWorker = new SharedWorker("worker.js");
myWorker.port.start();
[first, second].forEach((input) => {
input.onchange = () => {
myWorker.port.postMessage([first.value, second.value]);
console.log("Message posted to worker");
};
});
myWorker.port.onmessage = (e) => {
result1.textContent = e.data;
console.log("Message received from worker");
};
For a full example, see our Basic shared worker example (run shared worker.)
Specifications
| Specification |
|---|
| HTML> # dom-sharedworker-dev> |
Browser compatibility
See also
- The
SharedWorkerinterface it belongs to.