我正在尝试在 temasys 的帮助下使用 getUserMedia
函数IE 11 中的插件。getUserMedia
返回 IE 不支持的 MediaStream 实例。
这是我的示例代码:
import React from 'react'
import { render } from 'react-dom'
class App extends React.Component {
state = {
toggle: false,
}
componentDidMount() {
AdapterJS.webRTCReady(isUsingPlugin => {
console.log('isUsingPlugin....', isUsingPlugin)
navigator.getUserMedia({
video: {
mandatory: {
maxWidth: 640,
},
optional: [
{ maxFrameRate: 120 },
{ minFrameRate: 120 },
],
},
}, (st) => {
try {
this.videoRef.srcObject = st
}
catch (eee) {
console.error(eee)
}
this.setState({ toggle: !this.state.toggle })
}, (error) => {
console.log('error....', error)
})
})
}
setRef = ref => {
this.videoRef = ref
}
render() {
return (
<div>
<video ref={this.setRef} autoPlay={true} />
</div>
)
}
}
render(
<App />,
document.getElementById('root'),
)
st 是 MediaStream 的一个实例,IE 不支持它。问题在线:
this.videoRef.srcObject = st
我也试过
this.videoRef.src = window.URL.createObjectURL(st)
这在 IE 中也不起作用。
这是 fiddle .
如何让它在 IE 上运行?任何帮助将不胜感激。
最佳答案
我希望您使用的是 WebRTC 适配器,它有助于标准化执行这些任务的 API。
Temasys 拥有自己的适配器,该适配器构建在 WebRTC 适配器之上,并在保持相似界面的同时为其插件添加支持。
因此,IE 也将支持 MediaStream 和其他东西,因为它是由该适配器库定义的。
WebRTC 适配器JS:https://github.com/webrtc/adapter
Temasys AdapterJS:https://github.com/Temasys/AdapterJS
希望这能解决您的问题。
检查此示例代码以进行实现:https://github.com/Temasys/Google-WebRTC-Samples/blob/master/src/content/getusermedia/canvas-video/js/main.js
关于javascript - IE 11 中的 getUserMedia 或 IE 11 中的 MediaStream,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48094481/