1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
|
---
title: URL.createObjectURL()
slug: Web/API/URL/createObjectURL
tags:
- API
- Method
- Reference
- URL
- URL API
translation_of: Web/API/URL/createObjectURL
---
<div>{{APIRef("URL API")}}</div>
<p><span class="seoSummary"><strong><code>URL.createObjectURL()</code></strong> 정적 메서드는 주어진 객체를 가리키는 URL을 {{domxref("DOMString")}}으로 반환합니다.</span> 해당 URL은 자신을 생성한 창의 {{domxref("document")}}가 사라지면 함께 무효화됩니다.</p>
<p>객체 URL을 해제하려면 {{domxref("URL.revokeObjectURL", "revokeObjectURL()")}}을 호출하세요.</p>
<p>{{AvailableInWorkers}}</p>
<div class="note">
<p><strong>참고:</strong> 이 기능은 메모리 누수의 가능성으로 인해 <a href="/ko/docs/Web/API/Service_Worker_API">Service Worker</a>에서 사용할 수 없습니다.</p>
</div>
<h2 id="구문">구문</h2>
<pre class="syntaxbox">const <em>objectURL</em> = URL.createObjectURL(<em>object</em>)</pre>
<h3 id="매개변수">매개변수</h3>
<dl>
<dt><code>object</code></dt>
<dd>객체 URL을 생성할 {{domxref("File")}}, {{domxref("Blob")}}, {{domxref("MediaSource")}} 객체.</dd>
</dl>
<h3 id="반환_값">반환 값</h3>
<p>지정한 <code>object</code>의 참조 URL을 담은 {{domxref("DOMString")}}</p>
<ul>
</ul>
<h2 id="예제">예제</h2>
<p><a href="/ko/docs/Web/API/File/Using_files_from_web_applications#예시_객체_URL을_사용하여_이미지_표시하기">객체 URL을 사용하여 이미지 표시하기</a>를 보세요.</p>
<h2 id="사용_일람">사용 일람</h2>
<h3 id="메모리_관리">메모리 관리</h3>
<p>같은 객체를 사용하더라도, <code>createObjectURL()</code>을 매번 호출할 때마다 새로운 객체 URL을 생성합니다. 각각의 URL을 더는 쓰지 않을 땐 {{domxref("URL.revokeObjectURL()")}}을 사용해 하나씩 해제해줘야 합니다.</p>
<p>브라우저는 불러온 문서를 해제할 때 객체 URL도 자동으로 해제합니다. 그러나 최적의 성능과 메모리 사용량을 위해서, 객체 URL을 해제해도 안전하다면 그렇게 해야 합니다.</p>
<h3 id="미디어_스트림_객체_URL">미디어 스트림 객체 URL</h3>
<p>구 Media Source 명세에서는 {{HTMLElement("video")}} 요소에 스트림을 부착하려면 {{domxref("MediaStream")}}의 객체 URL을 생성했어야 했습니다. 이제 이런 과정은 필수가 아니며, 브라우저도 지원을 중단하고 있습니다.</p>
<div class="warning">
<p><strong>중요:</strong> 아직 미디어 요소에 {{domxref("URL.createObjectURL", "createObjectURL()")}}을 사용해 스트림을 부착하고 있다면, {{domxref("HTMLMediaElement.srcObject", "srcObject")}}에 <code>MediaStream</code>을 직접 설정하도록 코드를 수정해야 합니다.</p>
</div>
<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('File API', '#dfn-createObjectURL', 'createObjectURL()')}}</td>
<td>{{Spec2('File API')}}</td>
<td>Initial definition.</td>
</tr>
<tr>
<td>{{SpecName('Media Source Extensions', '#dom-url-createobjecturl', 'URL')}}</td>
<td>{{Spec2('Media Source Extensions')}}</td>
<td>
<p>MediaSource extension.</p>
<p>Older versions of this specification used <code>createObjectURL()</code> for {{domxref("MediaStream")}} objects; this is no longer supported.</p>
</td>
</tr>
</tbody>
</table>
<h2 id="브라우저_호환성">브라우저 호환성</h2>
<p>{{Compat("api.URL.createObjectURL")}}</p>
<h2 id="같이_보기">같이 보기</h2>
<ul>
<li><a href="/ko/docs/Web/API/File/Using_files_from_web_applications" title="Using files from web applications">웹 애플리케이션에서 파일 사용하기</a></li>
<li>{{domxref("URL.revokeObjectURL()")}}</li>
<li>{{domxref("HTMLMediaElement.srcObject")}}</li>
<li>{{domxref("FileReader.readAsDataURL()")}}</li>
</ul>
|
