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

时间:2013-06-20 06:28:19

标签: javascript ajax google-chrome signals webrtc

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

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

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

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

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

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

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.

      });

    });

  });

};

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

如果有人可以提出任何关于为什么会发生这种情况的建议,我将非常感激 非常感谢你。

1 个答案:

答案 0 :(得分:1)

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

我总是在使用Ajax的GET请求上使用encodeURIComponent,但我从来不知道你也必须将这个函数用于POST请求。很高兴知道。

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

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

叹息。在我完成这项任务之前还有一个跨越障碍。

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