Javascript 有没有办法在同一页上使用react网络摄像头？一个用于前置摄像头，另一个用于后置摄像头？

我使用的是react网络摄像头版本^4.0.0。我有一个内置react的网页，我想使用第一个选项卡拍摄客户自拍，下一个选项卡使用他的后置摄像头拍摄照片。 对于前置摄像头，我使用以下代码：-

    const videoConstraints = {
         facingMode: 'user'
    };
              <Webcam
                id="Selfie"
                audio={false}
                style={webcamStyle}
                videoConstraints={videoConstraints}
                height="auto"
                // eslint-disable-next-line no-return-assign
                ref={webcam => (this.webcam = webcam)}
                screenshotFormat="image/jpeg"
              />

const-videoConstraints={
facingMode:'用户'
};
（this.webcam=webcam）}
screenshotFormat=“图像/jpeg”
/>

我使用以下代码来使用后置摄像头：-

const videoConstraints = {
  facingMode: 'environment'
};
                  <Webcam
                id="panCard"
                audio={false}
                style={webcamStyle}
                height="auto"
                videoConstraints={videoConstraints}
                // eslint-disable-next-line no-return-assign
                ref={webcam => (this.webcam = webcam)}
                screenshotFormat="image/jpeg"
              />

const-videoConstraints={
面向模式：“环境”
};
（this.webcam=webcam）}
screenshotFormat=“图像/jpeg”
/>

问题是，即使我将后摄像头设置为环境，它仍然会打开前摄像头。

---

我如何解决这个问题？任何帮助或建议都将不胜感激。谢谢。

我认为

作为一个更高阶的功能，已经在同一组件中分配了摄像头的实例。因此，默认情况下，下一次启动将打开前摄像头。如果您将包分叉并创建了

组件的副本，会发生什么情况。另外，在本机开发中，我认为这需要一些硬件加速。从我的Andro手机来看，这是不可能的：