HTML5 - Web RTC
Web RTC do World Wide Web Consortium (W3C) giới thiệu. Điều đó hỗ trợ các ứng dụng trình duyệt trình duyệt để gọi thoại, trò chuyện video và chia sẻ tệp P2P.
Nếu bạn muốn thử? web RTC có sẵn cho Chrome, Opera và Firefox. Một nơi tốt để bắt đầu là ứng dụng trò chuyện video đơn giản tại đây . Web RTC triển khai ba API như hình dưới đây:
MediaStream - có quyền truy cập vào máy ảnh và micrô của người dùng.
RTCPeerConnection - có quyền truy cập vào cơ sở gọi âm thanh hoặc video.
RTCDataChannel - có quyền truy cập vào giao tiếp ngang hàng.
MediaStream
MediaStream đại diện cho các luồng phương tiện được đồng bộ hóa, Ví dụ: Nhấp vào Trình phát video HTML5 trong phần demo HTML5 hoặc nếu không, hãy nhấp vào đây .
Ví dụ trên chứa stream.getAudioTracks () và stream.VideoTracks (). Nếu không có đoạn âm thanh, nó sẽ trả về một mảng trống và nó sẽ kiểm tra luồng video, nếu webcam được kết nối, stream.getVideoTracks () trả về một mảng gồm một MediaStreamTrack đại diện cho luồng từ webcam. Một ví dụ đơn giản là các ứng dụng trò chuyện, một ứng dụng trò chuyện được phát trực tiếp từ máy ảnh web, máy ảnh sau, micrô.
Mã mẫu của MediaStream
function gotStream(stream) {
window.AudioContext = window.AudioContext || window.webkitAudioContext;
var audioContext = new AudioContext();
// Create an AudioNode from the stream
var mediaStreamSource = audioContext.createMediaStreamSource(stream);
// Connect it to destination to hear yourself
// or any other node for processing!
mediaStreamSource.connect(audioContext.destination);
}
navigator.getUserMedia({audio:true}, gotStream);
Chụp màn hình
Nó cũng có thể trong trình duyệt Chrome với mediaStreamSource và nó yêu cầu HTTPS. Tính năng này chưa có trong opera. Bản demo mẫu có sẵn tại đây
Kiểm soát phiên, Thông tin mạng & phương tiện
Web RTC yêu cầu giao tiếp ngang hàng giữa các trình duyệt. Cơ chế này yêu cầu báo hiệu, thông tin mạng, điều khiển phiên và thông tin phương tiện. Các nhà phát triển web có thể chọn cơ chế khác nhau để giao tiếp giữa các trình duyệt như SIP hoặc XMPP hoặc bất kỳ giao tiếp hai chiều nào. Một ví dụ mẫu của XHR là ở đây .
Mã mẫu của createSignalingChannel ()
var signalingChannel = createSignalingChannel();
var pc;
var configuration = ...;
// run start(true) to initiate a call
function start(isCaller) {
pc = new RTCPeerConnection(configuration);
// send any ice candidates to the other peer
pc.onicecandidate = function (evt) {
signalingChannel.send(JSON.stringify({ "candidate": evt.candidate }));
};
// once remote stream arrives, show it in the remote video element
pc.onaddstream = function (evt) {
remoteView.src = URL.createObjectURL(evt.stream);
};
// get the local stream, show it in the local video element and send it
navigator.getUserMedia({ "audio": true, "video": true }, function (stream) {
selfView.src = URL.createObjectURL(stream);
pc.addStream(stream);
if (isCaller)
pc.createOffer(gotDescription);
else
pc.createAnswer(pc.remoteDescription, gotDescription);
function gotDescription(desc) {
pc.setLocalDescription(desc);
signalingChannel.send(JSON.stringify({ "sdp": desc }));
}
});
}
signalingChannel.onmessage = function (evt) {
if (!pc)
start(false);
var signal = JSON.parse(evt.data);
if (signal.sdp)
pc.setRemoteDescription(new RTCSessionDescription(signal.sdp));
else
pc.addIceCandidate(new RTCIceCandidate(signal.candidate));
};