mirror of
https://github.com/ossrs/srs.git
synced 2025-02-13 20:01:56 +00:00
98 lines
2.4 KiB
HTML
98 lines
2.4 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="zh-cmn-Hans">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<br>local_media_player: <br>
|
||
|
|
<video id = "local_media_player" autoplay></video>
|
||
|
|
<br>rtc_media_player: <br>
|
||
|
|
<video id = "rtc_media_player" autoplay></video>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
|
||
|
|
var PeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
|
||
|
|
var SessionDescription = window.RTCSessionDescription || window.mozRTCSessionDescription || window.webkitRTCSessionDescription;
|
||
|
|
|
||
|
|
var url = "http://hw.com:1985/api/v1/sdp/";
|
||
|
|
|
||
|
|
var method = "POST";
|
||
|
|
var shouldBeAsync = true;
|
||
|
|
|
||
|
|
var request = new XMLHttpRequest();
|
||
|
|
|
||
|
|
request.open(method, url, shouldBeAsync);
|
||
|
|
request.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
|
||
|
|
|
||
|
|
var pc = new PeerConnection(null);
|
||
|
|
|
||
|
|
var sendSdpOffer = function(desc) {
|
||
|
|
console.log('sendSdpOffer:', desc);
|
||
|
|
|
||
|
|
pc.setLocalDescription(desc);
|
||
|
|
|
||
|
|
var sdp_json = {"sdp":desc.sdp, "app":"webrtc", "stream":"test"};
|
||
|
|
request.send(JSON.stringify(sdp_json));
|
||
|
|
};
|
||
|
|
|
||
|
|
pc.onaddstream = function(event) {
|
||
|
|
console.log('onaddstream');
|
||
|
|
document.getElementById('rtc_media_player').srcObject = event.stream;
|
||
|
|
rtc_media_player.load();
|
||
|
|
};
|
||
|
|
|
||
|
|
pc.onicecandidate = function(event) {
|
||
|
|
console.log('onicecandidate');
|
||
|
|
};
|
||
|
|
|
||
|
|
pc.onconnectionstatechange = function(event) {
|
||
|
|
console.log('onconnectionstatechange');
|
||
|
|
};
|
||
|
|
|
||
|
|
pc.onicegatheringstatechange = function(event) {
|
||
|
|
console.log('onicegatheringstatechange');
|
||
|
|
};
|
||
|
|
|
||
|
|
pc.onsignalingstatechange = function(event) {
|
||
|
|
console.log('onsignalingstatechange');
|
||
|
|
};
|
||
|
|
|
||
|
|
navigator.webkitGetUserMedia({
|
||
|
|
"audio": true,
|
||
|
|
"video": {
|
||
|
|
width: 800,
|
||
|
|
height:600,
|
||
|
|
frameRate:30,
|
||
|
|
bitRate:8000,
|
||
|
|
}
|
||
|
|
}, function(stream){
|
||
|
|
document.getElementById('local_media_player').srcObject = stream;
|
||
|
|
pc.addStream(stream);
|
||
|
|
pc.createOffer(sendSdpOffer, function (error) {
|
||
|
|
console.log('Failure callback: ' + error);
|
||
|
|
});
|
||
|
|
}, function(error){
|
||
|
|
//处理媒体流创建失败错误
|
||
|
|
console.log('getUserMedia error: ' + error);
|
||
|
|
});
|
||
|
|
|
||
|
|
request.onerror = function(event) {
|
||
|
|
console.log('http error');
|
||
|
|
};
|
||
|
|
|
||
|
|
request.onload = function () {
|
||
|
|
console.log('onload,' , request.responseText);
|
||
|
|
var json = JSON.parse(request.responseText);
|
||
|
|
console.log('onmessage viewerResponse:', json.sdp);
|
||
|
|
|
||
|
|
pc.setRemoteDescription(new SessionDescription({type:'answer', sdp:json.sdp}));
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|