javascript - WebRTC:创建答案后无法设置本地描述

标签 javascript ajax google-chrome signals webrtc

我目前正在尝试使用 WebRTC 和 Ajax 作为信令方法来创建一个简单的视频聊天服务。

根据 the recommendation of another Stack Overflow user ,为了确保我正确理解标准 WebRTC 应用程序的流程,我首先创建了一个简单的 WebRTC 视频聊天服务,其中我将创建的报价或答案和 ICE 候选人打印到屏幕上,然后手动复制并粘贴信息到另一个客户端窗口的文本区域以处理所有内容。这样做后,我就能够成功地弹出这两个视频。

在让它正常工作后,我决定尝试使用 Ajax 作为信号方法。但是,我现在似乎无法让它工作。

在我当前的实现中,每次创建报价/答案或 ICE 候选信息时,我都会立即创建一个新的 Ajax 对象,用于将该信息(在对其执行 JSON.stringify 方法之后)添加到数据库表。两个客户端都在不断轮询该数据库表,从另一个客户端搜索新信息。

我一直在向控制台输出大量信息,据我所知,一个有效的报价总是从一个客户端发送到另一个客户端,但是在收到该报价后,成功地将其设置为远程描述,并创建一个答案,我为设置“回答者”的本地描述所做的任何尝试都失败了。

发生这种情况有什么特别的原因吗?这是我的代码片段:

var i,
  len;

for (i = 0, len = responseData.length; i < len; i += 1) {

  message = JSON.parse(responseData[i]);

  if (message.type === 'offer') {

    makeAnswer(message);

  }

  // Code omitted,

}

...

makeAnswer = function (offer) {

  pc.setRemoteDescription(new RTCSessionDescription(offer), function () {

    pc.createAnswer(function (desc) {

      // An answer is always properly generated here.

      pc.setLocalDescription(desc, function () {

        // This success callback function is never executed.

        setPayload(JSON.stringify(pc.localDescription));

      }, function () {

        // I always end up here.

      });

    });

  });

};

本质上,我循环遍历从数据库中检索到的任何数据(有时会同时收集报价和大量候选人信息),如果消息的类型属性是“报价”,我调用 makeAnswer函数,从那里,我将远程描述设置为收到的报价,创建一个答案,并尝试将答案设置为本地描述,但在最后一步总是失败。

如果有人可以就为什么会发生这种情况提供任何建议,我将不胜感激。
非常感谢。

最佳答案

好吧,我想出了问题。事实证明,在通过 Ajax 将 SDP 和 ICE 信息发送到 PHP 脚本之前,我没有对其进行编码。因此,SDP/ICE 信息中的任何加号 (+) 都被转换为空格,从而导致本地和远程客户端之间的字符串不同并且无法正常工作。

我一直对 Ajax 的 GET 请求使用 encodeURIComponent,但我从来不知道您也必须对 POST 请求使用该函数。很高兴知道这一点。

无论如何,在我开始对发布的数据使用 encodeURIComponent 函数,然后稍微修正我的逻辑,以便在设置本地和远程描述之前永远不会设置 ICE 候选者,它每次都开始像魅力一样工作.

这是个好消息。坏消息是在我的本地主机上一切正常,但是一旦我将完全相同的代码移植到我的网络托管服务器上,即使控制台报告提供/答案和 ICE 信息都正确接收并设置,远程视频不弹出。

叹息。在我完成这项工作之前还需要跨越一个障碍。

无论如何,只是让大家知道,关键是在将SDP/ICE信息发送到服务器端脚本之前使用encodeURIComponent,以便另一端接收到的字符串完全相同。

关于javascript - WebRTC:创建答案后无法设置本地描述,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17206680/

相关文章:

javascript - javascript中的同步代码?

javascript json为每个当前元素创建父元素

php - 为什么 google chrome 和 IE 会出现这种奇怪的行为?

html - 为什么在 <p> 元素之后的新行会添加一个空格?

google-chrome - 带有 CSS 转换的圆形缩放动画 Chrome 错误

javascript - 当 div 固定时保持尺寸

javascript - 如何使用JQuery显示相应的div并隐藏其他div?

javascript - 监听 ajax 调用触发事件

ajax - 预计为 : 100-Continue header with XmlHTTPRequest

php - 验证 Google 电子邮件是否在 ajax 请求中发送