التطبيقات المشابهة

RTCPeerConnection هي الواجهة المركزية في WebRTC API. أُنشأها جون هنتر، الذي كان متخصصًا الاتصال بين الزملاء المحليين والبعيدين، ويوفر جميع والدالة والأحداث الضرورية لإنشاء الاتصال.

إنشاء اتصال أقران

عادةً ما تعتمد التطبيقات التي تنفّذ وظيفة WebRTC بشكل كبير على واجهة RTCPeerConnection. من جانب المتصل (أي النظير بدء اتصال)، وعادة ما تكون عملية إنشاء اتصال التالي:

1. إنشاء مثيل RTCPeerConnection جديد باستخدام ICE المناسب التكوين.
2. يمكنك إنشاء وصف محلي عبر بروتوكول SDP باستخدام RTCPeerConnection.createOffer().
3. ضبط وصف SDP المحلي باستخدام RTCPeerConnection.setLocalDescription()
4. نقل (باستخدام خدمة إرسال) وصف SDP المحلي إلى جهاز التحكّم عن بُعد زميل.
5. تسجيل أداة معالجة أحداث icecandidate على RTCPeerConnection
6. بالنسبة إلى كل حدث icecandidate، انقله (باستخدام خدمة إرسال إشارة) إلى النظير البعيد.
7. انتظار وصف وارد من بروتوكول SDP عن بُعد من خدمة الإشارة اضبطها باستخدام RTCPeerConnection.setRemoteDescription().
8. يُرجى انتظار وصول العناصر المحفّزة لعرض الإعلان عن بُعد في ICE من خدمة الإشارة وإضافتها باستخدام "RTCPeerConnection.addIceCandidate()"

وبالنسبة إلى جهة الاتصال، تختلف العملية قليلاً.

1. إنشاء مثيل RTCPeerConnection جديد باستخدام ICE المناسب التكوين.
2. انتظار وصف وارد من بروتوكول SDP عن بُعد من خدمة الإشارة اضبطها باستخدام RTCPeerConnection.setRemoteDescription().
3. يمكنك إنشاء إجابة لوصف بروتوكول SDP عن بُعد من خلال الاتصال RTCPeerConnection.createAnswer()
4. انقل الإجابة (باستخدام خدمة الإشارة) إلى الأقران البعيدين.
5. تسجيل أداة معالجة أحداث icecandidate على RTCPeerConnection
6. بالنسبة إلى كل حدث icecandidate، انقله (باستخدام خدمة إرسال إشارة) إلى النظير البعيد.
7. يُرجى انتظار وصول العناصر المحفّزة لعرض الإعلان عن بُعد في ICE من خدمة الإشارة وإضافتها باستخدام "RTCPeerConnection.addIceCandidate()"

يتمثّل التحدي الذي يواجه واجهة برمجة التطبيقات هذه في أنّ معظم هذه العمليات غير متزامنة، والتي غالبًا ما تجعل التنفيذ الفعلي لتطبيق WebRTC معقدًا. تعرض العديد من الدوال Promise الذي يجب حله قبل الخطوة التالية في العملية.

يوصى عند تنفيذ أحد التطبيقات باستخدام واجهة برمجة التطبيقات هذه، يستخدم المطوِّر async وawait بدلاً من تسجيل المستمعين (باستخدام Promise.then())، حيث يسهّل ذلك متابعة الرمز الخاص بك. ضع في اعتبارك في المثال التالي:

function createAndSendOffer(peerConnection, signallingService) {
    peerConnection.createOffer()
                  .then(offer => {
                      signallingService.send({
                          type: 'offer',
                          data: offer
                      });
                  });
}

عند كتابة الرمز أعلاه باستخدام async وawait، نحصل على ما يلي:

async function createAndSendOffer(peerConnection, signallingService) {
    const offer = await peerConnection.createOffer();
    signallingService.send({
        type: 'offer',
        data: offer
    });
}