aboutsummaryrefslogtreecommitdiff
path: root/files/ko/web/api/worker/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/ko/web/api/worker/index.html')
-rw-r--r--files/ko/web/api/worker/index.html129
1 files changed, 129 insertions, 0 deletions
diff --git a/files/ko/web/api/worker/index.html b/files/ko/web/api/worker/index.html
new file mode 100644
index 0000000000..7eb924f469
--- /dev/null
+++ b/files/ko/web/api/worker/index.html
@@ -0,0 +1,129 @@
+---
+title: Worker
+slug: Web/API/Worker
+tags:
+ - API
+ - DOM
+ - Interface
+ - JavaScript
+ - Reference
+ - Web Workers
+ - Worker
+ - 워커
+ - 웹 워커
+translation_of: Web/API/Worker
+---
+<div>{{APIRef("Web Workers API")}}</div>
+
+<p><span class="seoSummary"><a href="/ko/docs/Web/API/Web_Workers_API">Web Workers API</a>의<strong> <code>Worker</code></strong> 인터페이스는 스크립트로 생성하고, 생성자와 메시지로 통신하는 백그라운드 작업을 나타냅니다.</span> 워커의 생성은 <code>Worker("path/to/worker/script")</code> 생성자를 통해 할 수 있습니다.</p>
+
+<p>워커는 부모 페이지와 같은 {{glossary("origin", "출처")}}에 호스팅 된 다른 워커를 생성할 수 있습니다. (참고: <a href="https://bugs.webkit.org/show_bug.cgi?id=22723">WebKit은 아직 중첩 워커를 구현하지 않았습니다.</a>)</p>
+
+<p><a href="/ko/docs/Web/API/Web_Workers_API/Functions_and_classes_available_to_workers"><code>Worker</code> 내에서 사용할 수 있는 인터페이스와 함수</a>는 제한돼있습니다. 워커는 {{domxref("XMLHttpRequest")}}를 사용해 네트워크 통신을 할 수 있지만, 응답의 <code>responseXML</code>과 <code>channel</code> 특성은 항상 {{jsxref("null")}}입니다. (<code><a href="/ko/docs/Web/API/Fetch_API">fetch</a></code>는 이러한 제한 없이 사용할 수 있습니다.)</p>
+
+<h2 id="생성자">생성자</h2>
+
+<dl>
+ <dt>{{domxref("Worker.Worker", "Worker()")}}</dt>
+ <dd>주어진 URL의 스크립트를 실행하는 전용 웹 워커를 생성합니다. <a href="/ko/docs/Web/API/Blob">Blob URL</a>도 사용할 수 있습니다.</dd>
+</dl>
+
+<h2 id="속성">속성</h2>
+
+<p>부모 {{domxref("EventTarget")}}에서 속성을 상속하고, {{domxref("AbstractWorker")}}의 속성을 구현합니다.</p>
+
+<h3 id="이벤트_처리기">이벤트 처리기</h3>
+
+<dl>
+ <dt>{{domxref("AbstractWorker.onerror")}}</dt>
+ <dd><code>error</code> 유형의 {{domxref("ErrorEvent")}}가 워커로 확산되면 호출할 {{domxref("EventListener")}}입니다. {{domxref("AbstractWorker")}}에서 상속합니다.</dd>
+ <dt>{{domxref("Worker.onmessage")}}</dt>
+ <dd><code>message</code> 유형의 {{domxref("MessageEvent")}}가 워커로 확산되면, 즉 {{domxref("DedicatedWorkerGlobalScope.postMessage")}}를 통해 워커에서 부모 문서로 메시지를 전송하면 호출할 {{domxref("EventListener")}}입니다. 메시지는 {{domxref("MessageEvent.data", "data")}} 속성에 들어있습니다.</dd>
+ <dt>{{domxref("Worker.onmessageerror")}}</dt>
+ <dd>{{event("messageerror")}} 이벤트가 발생하면 호출할 {{domxref("EventHandler")}}입니다.</dd>
+</dl>
+
+<dl>
+</dl>
+
+<h2 id="메서드">메서드</h2>
+
+<p>부모 {{domxref("EventTarget")}}에서 메서드를 상속하고, {{domxref("AbstractWorker")}}의 메서드를 구현합니다.</p>
+
+<dl>
+ <dt>{{domxref("Worker.postMessage()")}}</dt>
+ <dd>워커의 내부 범위로 메시지를 전송합니다. 메시지는 임의의 JavaScript 객체입니다.</dd>
+ <dt>{{domxref("Worker.terminate()")}}</dt>
+ <dd>워커를 즉시 종료합니다. 현재 워커가 연산을 진행 중이더라도 완료를 기다리지 않습니다. {{domxref("ServiceWorker")}} 인스턴스는 이 메서드를 지원하지 않습니다.</dd>
+</dl>
+
+<h2 id="이벤트">이벤트</h2>
+
+<dl>
+ <dt><code><a href="/ko/docs/Web/API/Worker/message_event">message</a></code></dt>
+ <dd>워커의 부모가 워커로부터 메시지를 수신했을 대 발생합니다.<br>
+ <code><a href="/ko/docs/Web/API/Worker/onmessage">onmessage</a></code> 속성에서도 사용 가능합니다.</dd>
+ <dt><code><a href="/ko/docs/Web/API/Worker/messageerror_event">messageerror</a></code></dt>
+ <dd><code>Worker</code> 객체가 <a href="/ko/docs/Web/API/Web_Workers_API/Structured_clone_algorithm">역직렬화</a> 할 수 없는 객체를 메시지로 받았을 대 발생합니다.<br>
+ <code><a href="/ko/docs/Web/API/Worker/onmessageerror">onmessageerror</a></code> 속성에서도 사용 가능합니다.</dd>
+</dl>
+
+<dl>
+ <dt><code><a href="/ko/docs/Web/API/Window/rejectionhandled_event">rejectionhandled</a></code></dt>
+ <dd>{{jsxref("Promise")}}가 거부될 때마다 발생합니다. 거부를 처리할 처리기의 존재 유무는 고려하지 않습니다.<br>
+ <code><a href="/ko/docs/Web/API/WindowEventHandlers/onrejectionhandled">onrejectionhandled</a></code> 속성에서도 사용 가능합니다.</dd>
+ <dt><code><a href="/ko/docs/Web/API/Window/unhandledrejection_event">unhandledrejection</a></code></dt>
+ <dd>{{jsxref("Promise")}}가 거부됐는데, 처리할 처리기가 없을 때 발생합니다.<br>
+ <code><a href="/ko/docs/Web/API/WindowEventHandlers/onunhandledrejection">onunhandledrejection</a></code> 속성에서도 사용 가능합니다.</dd>
+</dl>
+
+<h2 id="예제">예제</h2>
+
+<p>다음 코드 조각은 {{domxref("Worker.Worker", "Worker()")}} 생성자를 사용해 <code>Worker</code> 객체를 생성한 후, 그 <code>Worker</code>를 사용합니다.</p>
+
+<pre class="brush: js notranslate">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');
+}</pre>
+
+<p>전체 예제를 보시려면 저희의 <a class="external external-icon" href="https://github.com/mdn/simple-web-worker">simple-web-worker 예제</a> (<a class="external external-icon" href="http://mdn.github.io/simple-web-worker/">라이브</a>)를 참고하세요.</p>
+
+<h2 id="명세">명세</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="브라우저_호환성">브라우저 호환성</h2>
+
+<p>워커의 종류마다 지원 상황이 다릅니다. 각각의 페이지를 방문해 더 자세히 알아보세요.</p>
+
+
+
+<p>{{Compat("api.Worker")}}</p>
+
+<h3 id="교차_출처에서의_워커_오류_동작">교차 출처에서의 워커 오류 동작</h3>
+
+<p>초기 명세에서는 교차 출처 워커 스크립트를 불러오려 시도하면 <code>SecurityError</code>가 발생했습니다. 요즘은 오류 대신 {{event("error")}} 이벤트가 발생합니다. <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/">이 글</a>에서 교차 출처 처리 방법을 알아보세요.</p>
+
+<h2 id="같이_보기">같이 보기</h2>
+
+<ul>
+ <li><a class="internal" href="/ko/docs/Web/API/Web_Workers_API/Using_web_workers" title="en/Using DOM workers">웹 워커 사용하기</a></li>
+ <li><a href="/ko/docs/Web/API/Web_Workers_API/Functions_and_classes_available_to_workers" title="https://developer.mozilla.org/En/DOM/Worker/Functions_available_to_workers">워커에서 사용할 수 있는 함수와 클래스</a></li>
+ <li>다른 종류의 워커: {{domxref("SharedWorker")}}와 <a href="/ko/docs/Web/API/Service_Worker_API">서비스 워커</a>.</li>
+</ul>