From da78a9e329e272dedb2400b79a3bdeebff387d47 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:17 -0500 Subject: initial commit --- files/ko/web/api/abortsignal/aborted/index.html | 64 ++++++++++++++ files/ko/web/api/abortsignal/index.html | 107 ++++++++++++++++++++++++ 2 files changed, 171 insertions(+) create mode 100644 files/ko/web/api/abortsignal/aborted/index.html create mode 100644 files/ko/web/api/abortsignal/index.html (limited to 'files/ko/web/api/abortsignal') diff --git a/files/ko/web/api/abortsignal/aborted/index.html b/files/ko/web/api/abortsignal/aborted/index.html new file mode 100644 index 0000000000..edced40d38 --- /dev/null +++ b/files/ko/web/api/abortsignal/aborted/index.html @@ -0,0 +1,64 @@ +--- +title: AbortSignal.aborted +slug: Web/API/AbortSignal/aborted +tags: + - API + - AbortSignal + - aborted + - 레퍼런스 + - 실험적 + - 프로퍼티 +translation_of: Web/API/AbortSignal/aborted +--- +
{{APIRef("DOM")}}{{SeeCompatTable}}
+ +

aborted 읽기 전용 프로퍼티는 신호가 통신하는 DOM 요청이 취소되었는지(true) 그렇지 않은지(false)를 나타내는 {{domxref("Boolean")}}을 반환한다.

+ +

구문

+ +
var isAborted = abortSignal.aborted;
+ +

값

+ +

{{domxref("Boolean")}}

+ +

예제

+ +

다음 스니펫에서는 새로운 AbortController 객체를 생성하고 {{domxref("AbortSignal")}}를 얻는다(signal 프로퍼티에서 가능). 그 다음 aborted 프로퍼티를 사용해 신호가 취소되었는지 확인하고 콘솔로 적절한 로그를 전송한다.

+ +
var controller = new AbortController();
+var signal = controller.signal;
+
+// ...
+
+signal.aborted ? console.log('Request has been aborted') : console.log('Request not aborted');
+
+ +

명세

+ + + + + + + + + + + + + + +
명세상태코멘트
{{SpecName('DOM WHATWG', '#dom-abortsignal-onabort', 'onabort')}}{{Spec2('DOM WHATWG')}}초기 정의
+ +

브라우저 호환성

+ + + +

{{Compat("api.AbortSignal.aborted")}}

+ +

See also

+ + diff --git a/files/ko/web/api/abortsignal/index.html b/files/ko/web/api/abortsignal/index.html new file mode 100644 index 0000000000..70d4dff9c1 --- /dev/null +++ b/files/ko/web/api/abortsignal/index.html @@ -0,0 +1,107 @@ +--- +title: AbortSignal +slug: Web/API/AbortSignal +tags: + - API + - AbortSignal + - DOM + - 레퍼런스 + - 실험적 + - 인터페이스 +translation_of: Web/API/AbortSignal +--- +
{{APIRef("DOM")}}{{SeeCompatTable}}
+ +

AbortSignal 인터페이스는 DOM 요청(Fetch와 같은)과 통신하고 필요한 경우 {{domxref("AbortController")}} 객체를 통해 취소할 수 있게 해주는 신호 객체를 나타낸다.

+ +

프로퍼티

+ +

AbortSignal 인터페이스는 또한 부모 인터페이스 {{domxref("EventTarget")}}으로부터 프로퍼티를 상속받는다.

+ +
+
{{domxref("AbortSignal.aborted")}} {{readonlyInline}}
+
신호가 통신하는 요청이 취소되었는지(true) 그렇지 않은지(false)를 나타내는 {{domxref("Boolean")}}.
+
+ +

이벤트

+ +

addEventListener()를 사용하거나 이 인터페이스의 oneventname 프로퍼티로 이벤트 리스너를 할당하여 이벤트를 리슨한다.

+ +
+
abort
+
신호가 통신하는 요청이 취소되었을 때 호출된다. onabort 프로퍼티를 통해서도 사용이 가능하다.
+
+ +

메소드

+ +

AbortSignal 인터페이스는 부모인 {{domxref("EventTarget")}}로부터 메소드를 상속받는다.

+ +

예제

+ +

다음 스니펫에서는 Fetch API를 사용해 비디오를 다운로드하는 것을 목표로 한다.

+ +

먼저 {{domxref("AbortController.AbortController","AbortController()")}} 생성자를 사용해 컨트롤러를 {{domxref("AbortController.signal")}} 프로퍼티를 사용해 {{domxref("AbortSignal")}} 객체와 관계된 참조를 얻는다.

+ +

Fetch 요청을 시작할 때, 요청의 옵션 객체 내부에 AbortSignal 옵션을 전달한다(아래의 {signal} 참고). 이것은 신호와 컨트롤러를 fetch 요청과 관계짓고, 아래의 두 번째 이벤트 리스너에서 보여주듯이 {{domxref("AbortController.abort()")}}를 호출하여 이를 취소할 수 있게한다.

+ +
var controller = new AbortController();
+var signal = controller.signal;
+
+var downloadBtn = document.querySelector('.download');
+var abortBtn = document.querySelector('.abort');
+
+downloadBtn.addEventListener('click', fetchVideo);
+
+abortBtn.addEventListener('click', function() {
+  controller.abort();
+  console.log('Download aborted');
+});
+
+function fetchVideo() {
+  ...
+  fetch(url, {signal}).then(function(response) {
+    ...
+  }).catch(function(e) {
+    reports.textContent = 'Download error: ' + e.message;
+  })
+}
+ +
+

노트: abort()가 호출되면, fetch() promise는 AbortError과 함께 reject된다.

+
+ +
+

현재 버전의 Firefox는 DOMException으로 promise를 reject한다.

+
+ +

동작하는 완전한 예제는 GitHub에서 확인 할 수 있다 — abort-api 참고(라이브 실행도 확인할 수 있다).

+ +

명세

+ + + + + + + + + + + + + + +
명세상태코멘트
{{SpecName('DOM WHATWG', '#interface-AbortSignal', 'AbortSignal')}}{{Spec2('DOM WHATWG')}}초기 정의
+ +

브라우저 호환성

+ + + +

{{Compat("api.AbortSignal")}}

+ +

함께 보기

+ + -- cgit v1.2.3-54-g00ecf