Worker

Web Workers APIWorker 인터페이스는 스크립트로 생성하고, 생성자와 메시지로 통신하는 백그라운드 작업을 나타냅니다. 워커의 생성은 Worker("path/to/worker/script") 생성자를 통해 할 수 있습니다.

워커는 부모 페이지와 같은 출처에 호스팅 된 다른 워커를 생성할 수 있습니다. (참고: WebKit은 아직 중첩 워커를 구현하지 않았습니다.)

Worker 내에서 사용할 수 있는 인터페이스와 함수는 제한돼있습니다. 워커는 XMLHttpRequest를 사용해 네트워크 통신을 할 수 있지만, 응답의 responseXMLchannel 특성은 항상 null입니다. (fetch는 이러한 제한 없이 사용할 수 있습니다.)

생성자

Worker()

주어진 URL의 스크립트를 실행하는 전용 웹 워커를 생성합니다. Blob URL도 사용할 수 있습니다.

속성

부모 EventTarget에서 속성을 상속하고, AbstractWorker의 속성을 구현합니다.

이벤트 처리기

AbstractWorker.onerror

error 유형의 ErrorEvent가 워커로 확산되면 호출할 EventListener입니다. AbstractWorker에서 상속합니다.

Worker.onmessage

message 유형의 MessageEvent가 워커로 확산되면, 즉 DedicatedWorkerGlobalScope.postMessage를 통해 워커에서 부모 문서로 메시지를 전송하면 호출할 EventListener입니다. 메시지는 data 속성에 들어있습니다.

Worker.onmessageerror

messageerror 이벤트가 발생하면 호출할 이벤트 처리기입니다.

메서드

부모 EventTarget에서 메서드를 상속하고, AbstractWorker의 메서드를 구현합니다.

Worker.postMessage()

워커의 내부 범위로 메시지를 전송합니다. 메시지는 임의의 JavaScript 객체입니다.

Worker.terminate()

워커를 즉시 종료합니다. 현재 워커가 연산을 진행 중이더라도 완료를 기다리지 않습니다. ServiceWorker 인스턴스는 이 메서드를 지원하지 않습니다.

이벤트

message

워커의 부모가 워커로부터 메시지를 수신했을 대 발생합니다. onmessage 속성에서도 사용 가능합니다.

messageerror

Worker 객체가 역직렬화 할 수 없는 객체를 메시지로 받았을 대 발생합니다. onmessageerror 속성에서도 사용 가능합니다.

rejectionhandled

Promise가 거부될 때마다 발생합니다. 거부를 처리할 처리기의 존재 유무는 고려하지 않습니다. onrejectionhandled 속성에서도 사용 가능합니다.

unhandledrejection

Promise가 거부됐는데, 처리할 처리기가 없을 때 발생합니다. onunhandledrejection 속성에서도 사용 가능합니다.

예제

다음 코드 조각은 Worker() 생성자를 사용해 Worker 객체를 생성한 후, 그 Worker를 사용합니다.

js
var myWorker = new Worker("worker.js");
var first = document.querySelector("#number1");

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

전체 예제를 보시려면 저희의 simple-web-worker 예제 (라이브)를 참고하세요.

명세

Specification
HTML
# dedicated-workers-and-the-worker-interface

브라우저 호환성

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
Worker
Worker() constructor
Support for ECMAScript modules
Strict MIME type checks for worker scripts
options.name parameter
options.type parameter
error event
message event
messageerror event
postMessage
options.includeUserActivation parameter
Non-standard
terminate
Available in workers

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Partial support
Partial support
No support
No support
Non-standard. Check cross-browser support before using.
See implementation notes.
Has more compatibility info.

워커의 종류마다 지원 상황이 다릅니다. 각각의 페이지를 방문해 더 자세히 알아보세요.

교차 출처에서의 워커 오류 동작

초기 명세에서는 교차 출처 워커 스크립트를 불러오려 시도하면 SecurityError가 발생했습니다. 요즘은 오류 대신 error 이벤트가 발생합니다.

같이 보기