Javascript 如何在react.js中的web应用程序上添加摄像头？

我来找你是因为我有个无法解决的问题

我目前正在react.js中构建一个web应用程序，并尝试实现摄像头功能。在我的计算机上的localhost中，一切正常，但我无法在手机上启动照相机模式

我有一个错误：

“摄像头错误：用户代理或平台在当前上下文中不允许该请求，可能是因为用户拒绝了权限。”

我知道有了“react-html5-camera-photo”库，带有“getusermedia”的摄像头在带有chrome或firebox的iPhone上是不受支持的，所以我在Safari下工作，但尽管做了很多尝试，我还是找不到解决方案。 我还研究了如何在iPhone上授予Safari的权利，但我找不到解决方案

因此，如果你知道如何在react.js中获得手机上的摄像头功能，我就是其中一员

提前感谢您的回答

我的代码：

onTakePhoto (dataUri) {
  // Do stuff with the dataUri photo...
  //console.log('takePhoto');
  console.log(dataUri);
  this.setState(() => ({dataUri}));
  storage.ref('images').putString(dataUri, 'base64', {contentType:'image/jpg'}).then(function(snapshot) {
    console.log('takePhoto')
  });

}

render() {

    return (
            <div style={style}>
            <Link to='/'>
                <button>Back</button>
            </Link>
            <br/>
            <br/>
            <progress value={this.state.progress} max="100"/>
            <br/>
            <Camera
              onTakePhoto = { (dataUri) => { this.onTakePhoto(dataUri); } }
            />
                <button onClick={this.screenshot.bind(this)}>Capture</button>
                <br/>
                <br/>
                { this.state.url ? <img src={this.state.url} /> : null }
            </div>

onTakePhoto（dataUri）{
//用dataUri照片做一些事情。。。
//console.log（'takePhoto'）；
log（dataUri）；
this.setState（（）=>（{dataUri}））；
storage.ref（'images'）.putString（dataUri，'base64'，{contentType:'image/jpg'}）{
console.log（'takePhoto'）
});
}
render（）{
返回(
返回






{this.onTakePhoto（dataUri）；}
/>
俘获




{this.state.url？：null}

你试过这个吗=>

navigator.getMedia = ( navigator.getUserMedia ||
                         navigator.webkitGetUserMedia ||
                         navigator.mozGetUserMedia ||
                         navigator.msGetUserMedia);

来源=>