Safari即将支持WebRTC

自从开始做WebRTC开发以来,经常被别人问到,safari浏览器能支持WebRTC吗?我也很希望safari能支持WebRTC,这样就不用写原生WebRTC应用或者Safari浏览器插件了。
很高兴的是,近期Apple公司宣布, WebRTC将会进入Safari和iOS 11。事实上,如果你是苹果的注册开发者,你就可以尝试使用支持WebRTC的测试版Safari浏览器。我提前试用了下测试版本的safari,写了一个最简单的WebRTC小程序在上面运行了一下。下面我把我遇到的几个总是和大家分享一下:
  1. safari和safari相连接很快就成功了,但是当safari和chrome,firefox相连接时,设置Offer sdp或者设置answer sdp时会发生以下异常:TypeError: Attempted to assign to readonly property.
  2. 与chrome相比,getStats 接口也有点不一样。如果在Chrome中如果没有传选择器参数,你还可以得到许多数据,但是在Safari中做同样的事情会抛出以下错误:Argument 1 (‘selector’) to RTCPeerConnection. getStats must be an instance of MediaStreamTrack
  3. 在chrome中,我们可以在一个PeerConnection中同时创建多个Datachannels,但是在Safari中是行不通的。当然这个问题我们是可以通过其它方式绕开的,但是我还是希望Safari的接口能和chrome保持一致。

这就是我暂时发现Safari测试版本中的几个小问题,如果你们也在试用Safari,有什么新的发现,可以和我交流一下。
WebRTC是一个支持网页浏览器进行实时语音对话或视频对话的API。在Safari浏览器中使用WebRTC替换摄像头获取到的流,通常需要以下几个步骤: 1. 获取用户媒体设备的权限,即获取摄像头的访问权限。这通常使用`navigator.mediaDevices.getUserMedia`方法实现。 2. 创建一个媒体流,并从中获取视频轨道。在这个步骤中,你可以通过`getUserMedia`获取到的流中选择特定的视频轨道。 3. 将获取到的视频轨道替换到已有的视频元素的srcObject中,或者使用MediaStream API来动态替换流中的视频轨道。 以下是一个简单的示例代码: ```javascript // 请求用户媒体权限,并获取视频流 navigator.mediaDevices.getUserMedia({ video: true }) .then(function(stream) { // 获取视频元素 var videoElement = document.querySelector('video'); // 将获取到的流赋值给视频元素的srcObject videoElement.srcObject = stream; }) .catch(function(error) { console.error("无法访问摄像头", error); }); // 假设我们有一个新的流newStream,我们想要替换当前视频元素中的流 function replaceStream(newStream) { var videoElement = document.querySelector('video'); // 检查视频元素是否有srcObject属性(在一些旧版浏览器中可能没有) if ("srcObject" in videoElement) { videoElement.srcObject = newStream; } else { // 旧版浏览器的兼容写法 videoElement.src = window.URL.createObjectURL(newStream); } // 确保视频元素重新开始播放 videoElement.play().catch(function(error) { console.error("视频播放失败", error); }); } ``` 在这个例子中,`replaceStream`函数可以用来替换视频元素的媒体流。你只需要提供一个新的`MediaStream`对象即可。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值