blocks|key|975643|text|TLDR:我已经测试了您的代码，并对其进行了一些更改：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|975644|https://codepen.io/puradawid/pen/PoqxzPQ|offset|length|975645|看起来问题就在这里：|975646|navigator.getUserMedia({
++++video:+{}
++},
++stream+=>+{+video.srcObject+=+stream+},
++err+=>+console.log(err)
);|code-block|syntax|javascript|975647|对于文档，navigator.getUserMedia是不推荐的，支持它的是navigator.mediaDevices.getUserMedia。但是，更改这个值并不能解决正确的问题，即回调函数。此方法返回由Promise控制的.then()，因此更改它使我能够以代码方式看到我的脸：|style|CODE|975648|navigator.mediaDevices.getUserMedia({
++++video:+true
}).then(
++stream+=>+(video.srcObject+=+stream),
++err+=>+console.log(err)
);|975649|entityMap|0|LINK|mutability|MUTABLE|url|1|https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia^0|0|0|14|0|0|0|0|5|M|12|Z|2X|7|37|7|2|2|1|0|0^^$0|@$1|2|3|4|5|6|7|11|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|12|8|@]|9|@$D|13|E|14|1|15]]|A|$]]|$1|F|3|G|5|6|7|16|8|@]|9|@]|A|$]]|$1|H|3|I|5|J|7|17|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|18|8|@$D|19|E|1A|O|P]|$D|1B|E|1C|O|P]|$D|1D|E|1E|O|P]|$D|1F|E|1G|O|P]]|9|@$D|1H|E|1I|1|1J]]|A|$]]|$1|Q|3|R|5|J|7|1K|8|@]|9|@]|A|$K|L]]|$1|S|3|-4|5|6|7|1L|8|@]|9|@]|A|$]]]|T|$U|$5|V|W|X|A|$Y|C]]|Z|$5|V|W|X|A|$Y|10]]]]

TLDR: I have tested your code and had to change it a bit:

<a href="https://codepen.io/puradawid/pen/PoqxzPQ" rel="noreferrer">https://codepen.io/puradawid/pen/PoqxzPQ</a>

It looks like the problem lays here:

<pre><code>navigator.getUserMedia({
 video: {}
 },
 stream =&gt; { video.srcObject = stream },
 err =&gt; console.log(err)
);
</code></pre>

Regarding to <a href="https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia" rel="noreferrer">docs</a> <code>navigator.getUserMedia</code> is deprecated and there is <code>navigator.mediaDevices.getUserMedia</code> that supports it. However, changing that up doesn't solve the correct problem which is your callback functions. This method returns <code>Promise</code> that is controlled by <code>.then()</code>, so changing it allows me to see my face in codepen:

<pre><code>navigator.mediaDevices.getUserMedia({
 video: true
}).then(
 stream =&gt; (video.srcObject = stream),
 err =&gt; console.log(err)
);
</code></pre>

blocks|key|975725|text|如果有其他人有这个问题，而其他没有任何帮助。确保您的相机没有被不同的软件/浏览器索取/使用。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|975726|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

If anyone else is having this problem and nothing else helps. Make sure that your camera is not already claimed/used by a different software/browser.

blocks|key|344484|text|在Windows+10中，进入设置->隐私->应用程序权限(左侧)->麦克风->启用‘允许应用程序访问您的麦克风’之后，重试您的JS+program....It将工作！！|type|unstyled|depth|inlineStyleRanges|entityRanges|data|344485|📷|atomic|offset|length|344486|​|344487|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://developer.qcloudimg.com/http-save/yehe-900000/3e94d61e0b1d62c94b54ba558e78c5c1.jpg|imageAlt^0|0|0|1|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|S|8|@]|9|@$E|T|F|U|1|V]]|A|$]]|$1|G|3|H|5|6|7|W|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|X|8|@]|9|@]|A|$]]]|J|$K|$5|L|M|N|A|$O|P|Q|-4]]]]

In Windows 10 go to settings-&gt;privacy-&gt;App permission(left side)-&gt;Microphone-&gt; enable 'Allow apps to access your microphone'
After that retry with your JS program....It will work!!<img src="https://i.stack.imgur.com/UDAsU.jpg" alt="Error solved!! DOM Exception Could not start video source" />

blocks|key|344609|text|如果有人有这样的错误，而你在笔记本电脑上工作。您可以尝试弯曲您的笔记本显示器的两个方向。有时电缆松了。这对我的案子有帮助。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|344610|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

If anyone have such an error and you are working on a laptop. You can try bending your laptop monitor in both directions. Sometimes the cable comes loose. This helped in my case.

blocks|key|1187644|text|当我试图在移动浏览器上切换相机时，我在某些安卓设备(索尼XA2)上遇到了这个问题，因为我在每个摄像头上反复调用navigator.mediaDevices.getUserMedia。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1187645|我找到的解决方案是确保停止您创建的先前流中的所有轨道。|1187646|+this.stream.getTracks().forEach(t+=>+{
++++t.stop();
++++this.stream.removeTrack(t);
+});|code-block|syntax|javascript|1187647|如果没有前面的代码，您就无法在某些Android设备上切换摄像机：(演示)，(代码)显示的错误是DOMException:+Requested+device+not+found|1187648|通过停止先前的轨道:您可以启动一个新的流：(演示)+代码|1187649|注意:由于安全限制，下面的代码段似乎不会在堆栈溢出时执行，所以请使用jsfiddle链接。|1187650|​|1187651|class+Camera+{
++constructor({+video+})+{
++++this.facingMode+=+"environment";
++++this.video+=+video;
++++video.onloadedmetadata+=+()+=>+{
++++++video.play();
++++};
++}
++async+toggleCamera()+{
++++if+(this.facingMode+===+"environment")+{
++++++this.facingMode+=+"user";
++++}+else+{
++++++this.facingMode+=+"environment";
++++}
++++try+{
++++++++if+(this.stream){
++++++++++++/*+On+some+android+devices,+it+is+necessary+to+stop+the+previous+track*/
++++++++this.stream.getTracks().forEach(t+=>+t.stop());
++++++}
++++++this.stream+=+await+navigator.mediaDevices.getUserMedia({
++++++++++++video:+{
++++++++++facingMode:++this.facingMode,
++++++++}
++++++});
++++}+catch+(e)+{
++++++console.error(e);
++++}
++++this.video.srcObject+=+this.stream;
++}
}

const+camera+=+new+Camera({
+++++video:+document.querySelector("video"),
});
const+button+=+document.querySelector("button");
button.addEventListener('click',+()+=>+{
++++camera.toggleCamera();
});|1187652|<button>
++Toggle+Camera
</button>
<video></video>|1187653|1187654|entityMap|0|LINK|mutability|MUTABLE|url|https://jsfiddle.net/3pbgm9ua/33/show|1|https://jsfiddle.net/3pbgm9ua/33/|2|https://jsfiddle.net/3pbgm9ua/35/show|3|https://jsfiddle.net/3pbgm9ua/35/^0|1J|Z|0|0|0|1C|14|X|4|0|12|4|1|0|L|4|2|Q|2|3|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|1D|8|@$9|1E|A|1F|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1G|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|1H|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|1I|8|@$9|1J|A|1K|B|C]]|D|@$9|1L|A|1M|1|1N]|$9|1O|A|1P|1|1Q]]|E|$]]|$1|O|3|P|5|6|7|1R|8|@]|D|@$9|1S|A|1T|1|1U]|$9|1V|A|1W|1|1X]]|E|$]]|$1|Q|3|R|5|6|7|1Y|8|@]|D|@]|E|$]]|$1|S|3|T|5|6|7|1Z|8|@]|D|@]|E|$]]|$1|U|3|V|5|J|7|20|8|@]|D|@]|E|$K|L]]|$1|W|3|X|5|J|7|21|8|@]|D|@]|E|$K|L]]|$1|Y|3|T|5|6|7|22|8|@]|D|@]|E|$]]|$1|Z|3|-4|5|6|7|23|8|@]|D|@]|E|$]]]|10|$11|$5|12|13|14|E|$15|16]]|17|$5|12|13|14|E|$15|18]]|19|$5|12|13|14|E|$15|1A]]|1B|$5|12|13|14|E|$15|1C]]]]

I ran into this problem on certain android devices (Sony XA2) when trying to toggle the camera on a mobile browser because I am calling <code>navigator.mediaDevices.getUserMedia</code> repeatedly on each camera toggle.
The solution that I found was to make sure to stop all the tracks in previous streams that you created.
<pre><code> this.stream.getTracks().forEach(t =&gt; {
 t.stop();
 this.stream.removeTrack(t);
 });
</code></pre>
Without the previous code you can't seem to toggle camera on certain Android devices: <a href="https://jsfiddle.net/3pbgm9ua/33/show" rel="nofollow noreferrer">(Demo)</a>,
<a href="https://jsfiddle.net/3pbgm9ua/33/" rel="nofollow noreferrer">(Code)</a>
The error shown was <code>DOMException: Requested device not found</code>
By stopping previous tracks: you are able to start a new stream:
<a href="https://jsfiddle.net/3pbgm9ua/35/show" rel="nofollow noreferrer">(Demo)</a>
<a href="https://jsfiddle.net/3pbgm9ua/35/" rel="nofollow noreferrer">Code</a>
Note: The following code snippet doesn't seem to execute in stack overflow due to security restrictions, so please use the jsfiddle links.
<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>class Camera {
 constructor({ video }) {
 this.facingMode = "environment";
 this.video = video;
 video.onloadedmetadata = () =&gt; {
 video.play();
 };
 }
 async toggleCamera() {
 if (this.facingMode === "environment") {
 this.facingMode = "user";
 } else {
 this.facingMode = "environment";
 }
 try {
 if (this.stream){
 /* On some android devices, it is necessary to stop the previous track*/
 this.stream.getTracks().forEach(t =&gt; t.stop());
 }
 this.stream = await navigator.mediaDevices.getUserMedia({
 video: {
 facingMode: this.facingMode,
 }
 });
 } catch (e) {
 console.error(e);
 }
 this.video.srcObject = this.stream;
 }
}

const camera = new Camera({
 video: document.querySelector("video"),
});
const button = document.querySelector("button");
button.addEventListener('click', () =&gt; {
 camera.toggleCamera();
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;button&gt;
 Toggle Camera
&lt;/button&gt;
&lt;video&gt;&lt;/video&gt;</code></pre>
</div>
</div>

blocks|key|975753|text|还查看报头，无论是在网站上还是在主机web服务器配置上，并确保允许相机访问。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|975754|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Also look into Feature-Policy HTTP header, both on the website and on the host web server config, and make sure camera access is allowed.

blocks|key|975834|text|我试过了所有其他的解决办法，但没有什么是可行的。最后，我需要卸载我的相机驱动程序在Device+Manager，然后扫描硬件的变化。试着再次运行这个应用程序，它就可以工作了。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|975835|我正在windows+10中构建电子桌面应用程序。|975836|electron:+15.3.0|975837|帮助我的视频来源：https://www.youtube.com/watch?v=XE2ULFlzkxw|975838|entityMap|0|LINK|mutability|MUTABLE|url|https://www.youtube.com/watch?v=XE2ULFlzkxw^0|15|E|0|0|0|G|0|9|17|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@$9|U|A|V|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|W|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|X|8|@$9|Y|A|Z|B|C]]|D|@]|E|$]]|$1|J|3|K|5|6|7|10|8|@]|D|@$9|11|A|12|1|13]]|E|$]]|$1|L|3|-4|5|6|7|14|8|@]|D|@]|E|$]]]|M|$N|$5|O|P|Q|E|$R|S]]]]

I have tried all the other solution but nothing is work. Then finally i need to uninstall my camera driver in <code>Device Manager</code> and then scan for hardware changes. Try to run the app again and it's working.
I'm building electron desktop app in windows 10. 
<code>electron: 15.3.0</code>
Source video that helped me: <a href="https://www.youtube.com/watch?v=XE2ULFlzkxw" rel="nofollow noreferrer">https://www.youtube.com/watch?v=XE2ULFlzkxw</a>

blocks|key|975892|text|我去了浏览器设置相机，并注意到，默认的相机显示为“跳跃运动”，这不是一个标准的相机设备。我换了一个真正的摄像头，问题解决了。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|975893|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

I went to the browser settings for camera and noticed that the default camera was showing as &quot;Leap Motion&quot; which is not a standard camera device. I changed to an actual webcam and the problem was solved.

blocks|key|975904|text|有时，当您尝试建立对等呼叫系统并在同一设备上进行测试时，也会出现这种错误。相机已经被发起者使用，并且接收器不能再激活相机。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|975905|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Sometimes this type of error also appears when you try to make a peer-to-peer call system and your tests are done on the same device. The camera is already used by the initiator and the receiver can no longer activate the camera.

I want to get a video from the webcam using JS but no footage.

MESSAGE:

<blockquote>
 DOMException: Could not start video source
</blockquote>

App.js

<pre><code>const video = document.getElementById("video");

function startVideo() {
 navigator.getUserMedia(
 {
 video: {}
 },
 stream =&gt; (video.srcObject = stream),
 err =&gt; console.log(err)
 );
}

startVideo();
</code></pre>

index.html

<pre><code>...
&lt;body&gt;
 &lt;video id="video" width="720" height="540" autoplay muted&gt;&lt;/video&gt;
&lt;/body&gt;
...
</code></pre>

thanks for your help

JS VIDEO | DOMException: Could not start video source

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋 

腾讯云代码助手

CODING DevOps

Cloud Studio

SDK中心

API中心

命令行工具

我想用JS从摄像头上得到一段视频，但没有镜头。消息：DOMException:无法启动视频源App.jsconst video = document.getElementById("video");function startVideo() {  navigator.getUserMedia(    {      video: {}    },    stream => (video.srcObj

问DOMException:无法启动视频源
EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问DOMException:无法启动视频源EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问DOMException:无法启动视频源
EN