blob: f4372c5d794d7a59c3c369bc79de5c076234f093 (
plain)
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
|
---
title: MediaStreamTrack.stop()
slug: Web/API/MediaStreamTrack/stop
tags:
- API
- Media
- WebRTC
- 停止
- 参考
- 方法
- 流
- 视频捕获和流API
- 视频流API
- 视频流跟踪
translation_of: Web/API/MediaStreamTrack/stop
---
<div>{{APIRef("Media Capture and Streams")}}</div>
<p><strong><code>MediaStreamTrack.stop()</code></strong>方法停止跟踪。</p>
<h2 id="语法">语法</h2>
<pre class="syntaxbox notranslate"><em>track</em>.stop()
</pre>
<h2 id="说明">说明</h2>
<p>调用<code>stop()</code>告诉{{glossary("user agent")}} ，{{domxref("MediaStreamTrack")}}不再需要轨道的来源，无论该来源是什么，包括文件，网络流，本地摄像机或麦克风。由于多个音轨可能使用同一音源（例如，如果两个选项卡使用设备的麦克风），则音源本身并不一定会立即停止。 而是从轨道取消关联，并且停止跟踪对象。 一旦没有媒体轨道正在使用源，则实际上可能会完全停止该源。</p>
<p>调用<code>stop()</code>之后，{{domxref("MediaStreamTrack.readyState", "readyState")}}属性立即设置为<code>ended</code>。</p>
<h2 id="示例">示例</h2>
<h3 id="停止视频流">停止视频流</h3>
<p>在此示例中，我们看到一个函数，该函数通过在给定{{HTMLElement("video")}}的每个轨道上调用<code>stop()</code>来停止流式视频。</p>
<pre class="brush: js notranslate">function stopStreamedVideo(videoElem) {
const stream = videoElem.srcObject;
const tracks = stream.getTracks();
tracks.forEach(function(track) {
track.stop();
});
videoElem.srcObject = null;
}</pre>
<p>这是通过从其{{domxref("HTMLMediaElement.srcObject", "srcObject")}} 属性获得视频元素的流来实现的。 然后，通过调用其{{domxref("MediaStream.getTracks", "getTracks()")}}方法来获取流的轨道列表。 从那里开始，剩下要做的就是使用{{jsxref("Array.forEach", "forEach()")}}遍历轨道列表并调用每个轨道的<code>stop()</code>方法。</p>
<p>最后，将<code>srcObject</code>设置为<code>null</code>以切断与{{domxref("MediaStream")}} 对象的链接，以便将其释放。</p>
<p>Finally, <code>srcObject</code> is set to <code>null</code> to sever the link to the {{domxref("MediaStream")}} object so it can be released.</p>
<h2 id="技术参数">技术参数</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ SpecName('Media Capture', '#dom-mediastreamtrack-stop', 'MediaStreamTrack.stop()') }}</td>
<td>{{ Spec2('Media Capture') }}</td>
<td>Initial specification.</td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<div class="hidden">此页面上的兼容性表是根据结构化数据生成的。 如果您想贡献数据，请查看https://github.com/mdn/browser-compat-data并向我们发送请求请求。</div>
<p>{{Compat("api.MediaStreamTrack.stop")}}</p>
<h2 id="看看别的">看看别的</h2>
<ul>
<li>{{domxref("MediaStreamTrack")}}，它所属的接口。</li>
<li>{{domxref("MediaStreamTrack.readyState")}}</li>
<li>{{event("ended")}}</li>
</ul>
|
