2016-03-27 7 views
0

たとえば、RTCPeerConnectionに似ています。これのためのAPIは、Firefox、Chromeで異なります。なぜapiはすべてのブラウザで異なる必要がありますか?

このコードスニペットは、そのAPIの相違点を修正するためのものです。それは、すべての主要な現代的なブラウザで動作するサイトを作成しようとする開発者の悩みをデモしています。 これを作成した人には本当に感謝しています。それは素晴らしい修正です。

var RTCPeerConnection = null; 
var getUserMedia = null; 
var attachMediaStream = null; 
var reattachMediaStream = null; 
var webrtcDetectedBrowser = null; 
function trace(text) { 
    if (text[text.length - 1] == '\\') { 
     text = text.substring(0, text.length - 1); 
    } 
    console.log((performance.now()/1000).toFixed(3) + ": " + text); 
} 

if (navigator.mozGetUserMedia) { 
    console.log("This appears to be Firefox"); 
    webrtcDetectedBrowser = "firefox"; 

    RTCPeerConnection = mozRTCPeerConnection; 
    RTCSessionDescription = mozRTCSessionDescription; 
    RTCIceCandidate = mozRTCIceCandidate; 
    getUserMedia = navigator.mozGetUserMedia.bind(navigator); 
    attachMediaStream = function (element, stream) { 
     console.log("Attaching media stream"); 
     element.mozSrcObject = stream; 
     element.play(); 
    }; 
    reattachMediaStream = function (to, from) { 
     console.log("Reattaching media stream"); 
     to.mozSrcObject = from.mozSrcObject; 
     to.play(); 
    }; 
    MediaStream.prototype.getVideoTracks = function() { 
     return []; 
    }; 
    MediaStream.prototype.getAudioTracks = function() { 
     return []; 
    }; 
} else if (navigator.webkitGetUserMedia) { 
    console.log("This appears to be Chrome"); 
    webrtcDetectedBrowser = "chrome"; 
    RTCPeerConnection = webkitRTCPeerConnection; 
    getUserMedia = navigator.webkitGetUserMedia.bind(navigator); 

    attachMediaStream = function (element, stream) { 
     if (typeof element.srcObject !== 'undefined') { 
      element.srcObject = stream; 
     } else 
     { 
      if (typeof element.mozSrcObject !== 'undefined') { 
       element.mozSrcObject = stream; 
      } else 
      { 
       if (typeof element.src !== 'undefined') { 
        element.src = URL.createObjectURL(stream); 
       } else { 
        console.log('Error attaching stream to element.'); 
       } 
      } 
     } 
    }; 
    reattachMediaStream = function (to, from) { 
     to.src = from.src; 
    }; 
    if (!webkitMediaStream.prototype.getVideoTracks) { 
     webkitMediaStream.prototype.getVideoTracks = function() { 
      return this.videoTracks; 
     }; 
     webkitMediaStream.prototype.getAudioTracks = function() { 
      return this.audioTracks; 
     }; 
    } 
    if (!webkitRTCPeerConnection.prototype.getLocalStreams) { 
     webkitRTCPeerConnection.prototype.getLocalStreams = function() { 
      return this.localStreams; 
     }; 
     webkitRTCPeerConnection.prototype.getRemoteStreams = function() { 
      return this.remoteStreams; 
     }; 
    } 
} else { 
    console.log("Browser does not appear to be WebRTC-capable"); 
} 

なぜこれらのウェブブラウザの作成者は非常に厄介でなければならないのですか?私は本当にそれが笑を理解できないのですか?

答えて

0

これは、この技術の仕様が安定していないのでこれは実験的な技術

あるMDN documentation

に要約され、さまざまなブラウザでの使用のための適合表をご確認ください。実験的技術の構文と動作は、仕様の変更に伴い、将来のバージョンのブラウザで変更される可能性があります。

またはthe specification:編集者草案として

公報は、W3C会員による承認を意味するものではありません。これはドラフトドキュメントであり、いつでも他のドキュメントによって更新、置き換え、または廃止される可能性があります。進行中の作業以外でこの文書を引用することは不適切です。

簡潔に言えば、あなたはまだ生き残っており、設計中の仕様を実装しています。完成した仕様では、ブラウザ間で安定した一貫した実装が得られる傾向があります。

+0

これは十分に良いです。私はwebsocketがほぼ安定していると思います。私はこれらすべての新しい仕様が好きです。彼らはチャットサイトのようなものに最適です! –

0

WebRTCの仕様は近年大きく変更されていますが、一部のブラウザではPeerConnectionまたはgetUserMedia APIのバージョンを前回のバージョンに戻すのに十分サポートされていません(最近Mozillaにあります)。

あなたが持っているスニペットは、adapter.jsというプロジェクトからのものです。あなたは古いバージョンの代わりにそのバージョンを使用したいかもしれません。

関連する問題