我正在尝试按照 PubNub 教程构建我的第一个 WebRTC 应用程序(https://www.pubnub.com/blog/2015-08-25-webrtc-video-chat-app-in-20-lines-of-javascript/);然而,它根本不起作用。我对编程相当陌生,因此我们将不胜感激。下面是我的代码。请注意,我已经创建了一个帐户并拥有自己的“pub”和“sub”,我已正确插入它们。
<!DOCTYPE html>
<html>
<div id="vid-box"></div>
<form name="loginForm" id="login" action="#" onsubmit="return login(this);">
<input type="text" name="username" id="username" placeholder="Pick a username!" />
<input type="submit" name="login_submit" value="Log In">
</form>
<form name="callForm" id="call" action="#" onsubmit="return makeCall(this);">
<input type="text" name="number" placeholder="Enter user to dial!" />
<input type="submit" value="Call"/>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdn.pubnub.com/pubnub.min.js"></script>
<script src="js/webrtc.js"></script>
<script type="text/javascript">
var video_out = document.getElementById("vid-box");
function login(form) {
var phone = window.phone = PHONE({
number : form.username.value || "Anonymous", // listen on username line else Anonymous
publish_key : 'MY OWN PUB KEY',
subscribe_key : 'MY OWN SUB KEY',
});
phone.ready(function(){ form.username.style.background="#55ff5b"; });
phone.receive(function(session){
session.connected(function(session) { video_out.appendChild(session.video); });
session.ended(function(session) { video_out.innerHTML=''; });
});
return false; // So the form does not submit.
}
function makeCall(form){
if (!window.phone) alert("Login First!");
else phone.dial(form.number.value);
return false;
}
</script>
</html>
在本地主机 HTTPS 上运行的 WebRTC
您希望使用 localhost 在笔记本电脑上本地运行 WebRTC 演示。您必须使用 HTTPS。这是使用本地安全网络服务器进行演示的 GIF 视频(包括!). 我们清理了您的视频 DOM/jQuery 代码,并纠正了一些错误。您可以找到 HTML 源代码GitHub 上的 WebRTC 源代码要点.
本地运行 WebRTC 演示
这些终端命令会将 html 文件下载到本地,为 TLS 加密创建 PEM 密钥,并使用 Python 运行本地 HTTPS 服务器。
curl https://gist.githubusercontent.com/stephenlb/edd4b0c218a72a34349baa004a80fd7a/raw/1b28c5e39db0d5eaabc10006cede0a8825b9afd4/webrtc-demo.html > webrtc-demo.html
python <(curl -L https://gist.githubusercontent.com/stephenlb/2e19d98039469b9d0134/raw/5afefc79647e0786097ca3406dbf93c5de919aed/https.py)
然后打开并接受本地 HTTPS 连接(同意未知根 CA 警告)。
open https://0.0.0.0:4443/webrtc-demo.html
运行上述命令来测试演示。
WebRTC 的参考链接
- GitHub 上的 WebRTC 源代码要点
- Python HTTPS 本地主机服务器位于 127.0.0.1/0
- WebRTC SDK 文档
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)