从Mozilla到Chrome的webrtc视频通话仅适用于Chrome

时间:2015-10-06 21:30:15

标签: javascript webrtc

这是一个使用webrtc进行视频通话的脚本,但是从mozilla到chrome调用时它不起作用,它只能从chrome转换为mozilla, 我认为这是由于创建优惠的约束部分,但我无法找到如何处理它,我试过这个:

if (isFirefox) {
  console.log('firefox');
  constraints = {
    offerToReceiveAudio: true,
    offerToReceiveVideo: true
  };
}
if (isChrome) {
  console.log('chrome');
  constraints = {
    mandatory: {
      OfferToReceiveAudio: true,
      OfferToReceiveVideo: true
    }
  };
}

但没有结果。 感谢

 < html >
   < head >

   < script type = 'text/javascript'
 src = '/firebase.js' > < /script>
      <script type='text/javascript
 ' src=' / adapter.js '></script>

        <style>#video,#otherPeer { width: 300px;}</style>
    </head>
    <body>

    <video id="video" autoplay></video>
    <video id="otherPeer" autoplay></video>

    <script>
    // get a reference to our FireBase database. You should create your own
    // and replace the URL.
    var dbRef = new Firebase("https://video-calling.firebaseio.com/");
    var roomRef = dbRef.child("rooms");

    // shims!
    var PeerConnection = window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
    var SessionDescription = window.mozRTCSessionDescription || window.RTCSessionDescription;
    var IceCandidate = window.mozRTCIceCandidate || window.RTCIceCandidate;
    navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia;

    // generate a unique-ish string
    function id () {
        return (Math.random() * 10000 + 10000 | 0).toString();
    }

    // a nice wrapper to send data to FireBase
    function send (room, key, data) {
        roomRef.child(room).child(key).set(data);
    }

    // wrapper function to receive data from FireBase
    function recv (room, type, cb) {
        roomRef.child(room).child(type).on("value", function (snapshot, key) {
            var data = snapshot.val();
            if (data) { cb(data); }
        });
    }

    // generic error handler
    function errorHandler (err) {
        console.error(err);
    }

    // determine what type of peer we are,
    // offerer or answerer.
    var ROOM = location.hash.substr(1);
    var type = "answerer";
    var otherType = "offerer";

    // no room number specified, so create one
    // which makes us the offerer
    if (!ROOM) {
        ROOM = id();
        type = "offerer";
        otherType = "answerer";

        document.write("<a href='#
 "+ROOM+"
 '>Send link to other peer</a>");
    }

    // generate a unique-ish room number
    var ME = id();

    // options for the PeerConnection
    var server = {
        iceServers: [
            {urls: "stun:23.21.150.121"},
            {urls: "stun:stun.l.google.com:19302"},
            {urls: "turn:numb.viagenie.ca", credential: "webrtcdemo", username: "louis%40mozilla.com"}
        ]
    };

    var options = {
        optional: [
            {DtlsSrtpKeyAgreement: true}
        ]
    }

    // create the PeerConnection
    var pc = new PeerConnection(server, options);

    pc.onicecandidate = function (e) {
        // take the first candidate that isn'
 t null
 if (!e.candidate) {
   return;
 }
 pc.onicecandidate = null;

 // request the other peers ICE candidate
 recv(ROOM, "candidate:" + otherType, function(candidate) {
   pc.addIceCandidate(new IceCandidate(JSON.parse(candidate)));
 });

 // send our ICE candidate
 send(ROOM, "candidate:" + type, JSON.stringify(e.candidate));
 };

 // grab the video elements from the document
 var video = document.getElementById("video");
 var video2 = document.getElementById("otherPeer");

 // get the user's media, in this case just video
 navigator.getUserMedia({
   video: true
 }, function(stream) {
   // set one of the video src to the stream
   video.src = URL.createObjectURL(stream);

   // add the stream to the PeerConnection
   pc.addStream(stream);

   // now we can connect to the other peer
   connect();
 }, errorHandler);

 // when we get the other peer's stream, add it to the second
 // video element.
 pc.onaddstream = function(e) {
   video2.src = URL.createObjectURL(e.stream);
 };

 // constraints on the offer SDP. Easier to set these
 // to true unless you don't want to receive either audio
 // or video.
 var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
 // Opera 8.0+ (UA detection to detect Blink/v8-powered Opera)
 var isFirefox = typeof InstallTrigger !== 'undefined'; // Firefox 1.0+
 var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
 // At least Safari 3+: "[object HTMLElementConstructor]"
 var isChrome = !!window.chrome && !isOpera; // Chrome 1+
 var isIE = /*@cc_on!@*/ false || !!document.documentMode; // At least IE6
 /*var constraints;
    if(isFirefox){
      console.log('firefox');
     constraints = {
        offerToReceiveAudio: true,
        offerToReceiveVideo: true
    };
    }
    if(isChrome){
      console.log('chrome');
     constraints = {
        mandatory: {
            OfferToReceiveAudio: true,
            OfferToReceiveVideo: true
        }
    };
*/
 var constraints = {
   mandatory: {
     OfferToReceiveAudio: true,
     OfferToReceiveVideo: true
   }
 };

 // start the connection!
 function connect() {
     if (type === "offerer") {
       // create the offer SDP
       pc.createOffer(function(offer) {
         pc.setLocalDescription(offer);

         // send the offer SDP to FireBase
         send(ROOM, "offer", JSON.stringify(offer));

         // wait for an answer SDP from FireBase
         recv(ROOM, "answer", function(answer) {
           pc.setRemoteDescription(
             new SessionDescription(JSON.parse(answer))
           );
         });
       }, errorHandler, constraints);

     } else {
       // answerer needs to wait for an offer before
       // generating the answer SDP
       recv(ROOM, "offer", function(offer) {
         pc.setRemoteDescription(
           new SessionDescription(JSON.parse(offer))
         );

         // now we can generate our answer SDP
         pc.createAnswer(function(answer) {
           pc.setLocalDescription(answer);

           // send it to FireBase
           send(ROOM, "answer", JSON.stringify(answer));
         }, errorHandler, constraints);
       });
     }
   } < /script>

    </body >
   < /html>

1 个答案:

答案 0 :(得分:1)

offerToReceiveAudio小写&#34; o&#34;在开头,因为这是标准,并被两个浏览器接受。