🍓 🧙🏾 👨‍🌾 WebRTC और Plivo सेवा का उपयोग कर एक ब्राउज़र में एक फोन बनाना 👏🏻 🧡 🚉

WebRTC मानक हाल ही में ब्राउज़रों के बीच डेटा स्ट्रीम करने के लिए विकसित किया गया है। Chrome 17, ओपेरा 12, फ़ायरफ़ॉक्स 18 (साथ ही ऊपर दिए गए संस्करण) पहले से ही एक या दूसरे स्तर पर इस मानक का समर्थन करते हैं। इसमें webrtc4all एक्सटेंशन भी है, जो अन्य ब्राउज़रों को WebRTC के साथ काम करने की अनुमति देता है। मैं यहां प्रौद्योगिकी के फायदे, नुकसान और संभावनाओं का वर्णन नहीं करूंगा, मैं तुरंत व्यावहारिक उपयोग के लिए आगे बढ़ूंगा।

एक प्लिवो सेवा भी है जो आपको एपीआई का उपयोग करके वास्तविक समय कॉल का प्रबंधन करने की अनुमति देती है। कॉल करने के लिए, ग्राहक एक एसआईपी खाता बना सकता है या एक नंबर किराए पर ले सकता है। फिलहाल, चालीस से अधिक देशों में नंबर उपलब्ध हैं, जिनमें से, दुर्भाग्य से, रूस नहीं है। इसके अलावा, एपीआई के माध्यम से, आप संख्याओं और खातों को बना, संशोधित और हटा सकते हैं। एक और महत्वपूर्ण बात यह है कि प्लिवो में अनुप्रयोग हैं। एप्लिकेशन आपको संख्याओं और एसआईपी खातों को संयोजित करने की अनुमति देते हैं। एप्लिकेशन सेटिंग्स में एक अनिवार्य विकल्प है - उत्तर URL, और दो वैकल्पिक - फ़ॉलबैक URL और हंगअप URL। वास्तव में इन यूआरएल से प्लावो कॉल के प्रबंधन के लिए आदेश प्राप्त करता है।

आप यहां एपीआई के बारे में अधिक पढ़ सकते हैं। मैं केवल उन हिस्सों का वर्णन करूंगा जिनका उपयोग फोन बनाने के लिए किया गया था। कॉल का प्रबंधन करने के लिए, आपको उत्तर URL का अनुरोध करते समय कमांड के साथ XML को वापस करना होगा। इस प्रकार, आप किसी भी नंबर पर कॉल को रीडायरेक्ट कर सकते हैं, कॉल को अस्वीकार कर सकते हैं, संगीत चला सकते हैं, पाठ पढ़ सकते हैं। प्लावो हमेशा इनकमिंग और आउटगोइंग कॉल डेटा को उत्तर URL पर भेजता है। संख्याओं, खातों और अनुप्रयोगों के प्रबंधन के लिए एपीआई - विशिष्ट मापदंडों के साथ विशिष्ट यूआरएल के लिए सरल HTTP अनुरोध। एपीआई https://github.com/plivo के साथ काम करने को सरल बनाने के लिए प्लिवो पुस्तकालय प्रदान करता है। मैंने प्लावो-पीएचपी का इस्तेमाल किया। इस लाइब्रेरी के लिए निर्भरताएँ स्थापित करना न भूलें - php-curl, php-opensl, pear package HTTP_Request2। जावास्क्रिप्ट एपीआई का उपयोग सीधे फोन के क्लाइंट भाग के लिए भी किया जाता था। यह API आपको SIP खाते का उपयोग करके लॉग इन करने, बनाने, प्राप्त करने, सीधे आपके ब्राउज़र में कॉल को अस्वीकार करने की अनुमति देता है।
मुझे उस साइट के लिए एक फोन बनाने की जरूरत है जहां कंपनियां समूहों के रूप में पंजीकृत हैं, जिनके सदस्य कंपनी के कर्मचारी हैं। प्रत्येक कर्मचारी या विभाग का अपना नंबर होता है, इसलिए नंबर और SIP खाते को लिंक करना आवश्यक था। आप बिना किराए के नंबर से कर सकते हैं, लेकिन फिर एक नियमित फोन से ब्राउज़र पर कॉल करना समस्याग्रस्त होगा।

मैं संक्षेप में बताऊंगा कि यह सब कैसे काम करेगा। साइट पर प्रत्येक उपयोगकर्ता का अपना एसआईपी खाता और एक किराए की संख्या है। सभी SIP खातों को एक अनुप्रयोग से जोड़ा जाना चाहिए (चलो इसे DirectDial अनुप्रयोग कहते हैं), सभी संख्याओं को दूसरे अनुप्रयोग से जोड़ा जाना चाहिए (चलो इसे नंबर अनुप्रयोग कहते हैं)। विभिन्न संख्याओं को विभिन्न अनुप्रयोगों से जोड़ा जा सकता है, जैसा कि मैंने किया था, क्योंकि साइट पर अलग-अलग उपयोगकर्ता समूह हैं। हालाँकि, उत्तर URL उनके लिए समान हो सकता है। जब उपयोगकर्ता पृष्ठ लोड करता है, तो js API का उपयोग करके हम उपयुक्त SIP खाते का उपयोग करके लॉग इन करेंगे। इसके बाद, उपयोगकर्ता ब्राउज़र से कॉल कर सकता है। ऐसी कॉल पर डेटा डायरेक्टली एप्लिकेशन के उत्तर URL पर भेजा जाएगा। उत्तर URL को हमेशा किसी प्रकार की XML प्रतिक्रिया देनी चाहिए, क्योंकि जब तक संबंधित कमांड नहीं भेजा जाता है तब तक Plivo उपयोगकर्ता द्वारा डायल किए गए नंबर को कॉल नहीं करेगा। इनकमिंग कॉल डेटा को उत्तर URL नंबर एप्लिकेशन पर भेजा जाता है। स्थिति यहाँ भी वही है - जवाब वैसे भी भेजा जाना चाहिए। मेरे मामले में, मैंने डायल किए गए नंबर के अनुरूप खाते के लिए एसआईपी डेटाबेस में देखा और कॉल को इस खाते पर पुनर्निर्देशित किया, फिर ब्राउज़र में उपयोगकर्ता ने एक इनकमिंग कॉल देखा।

सबसे पहले आपको DirectDial Application बनाना होगा। हम https://www.plivo.com/app/create/ के पते पर जाते हैं और एप्लिकेशन बनाते हैं। एप्लिकेशन नाम में हम DirectDial Application (कोई भी अन्य नाम हो सकता है) लिखते हैं, उत्तर URL में संबंधित URL (इसे site.com/dda_answer होने दें)। चेकबॉक्स डिफ़ॉल्ट समापन बिंदु एप्लिकेशन की जाँच करें, फिर बनाएँ पर क्लिक करें। समापन बिंदु SIP खाते के समान है। मैं SIP प्रोटोकॉल का विशेषज्ञ नहीं हूं, और मैं यह नहीं कह सकता कि कौन सा नाम अधिक सही है। जब SIP खाते से site.com/dda_answer पर एक आउटगोइंग कॉल किया जाता है, तो निम्नलिखित पैरामीटरों के साथ एक POST अनुरोध आएगा:

[Direction] => inbound [From] => sip:sipname8905@phone.plivo.com [CallerName] => sipname8905 [BillRate] => 0.00400 [To] => called_number [CallUUID] => 138caf72-615d-11e2-8f6e-659f0688e76c [CallStatus] => ringing [Event] => StartApp

लगभग हमेशा दिशा इनबाउंड होगी। इसलिए, कॉल का प्रकार From और To पैरामीटर के आधार पर सर्वोत्तम रूप से निर्धारित किया जाता है। इस प्रश्न का सबसे सरल उत्तर है:

 <?xml version="1.0" encoding="utf-8"?> <Response> <Dial callerId="rented_number"> <Number>called_number</Number> </Dial> </Response>

परिणाम में, बुलाया_नंबर नंबर कहा जाएगा, जिसके लिए आने वाले नंबर के रूप में rent_number प्रदर्शित किया जाएगा। मेरे मामले में, यह sipname8905 खाते से संबंधित किराए की संख्या थी। XML को plivo-php का उपयोग करके बनाया जा सकता है। Called_number को 795023423434 के रूप में प्रेषित किया जाना चाहिए, अर्थात्, संख्या के सामने "+" चिह्न के बिना और देश, शहर और मोबाइल ऑपरेटर का कोड होना चाहिए।
जब कॉल पूरा हो जाता है, तो उत्तर URL के लिए एक अनुरोध भी भेजा जाएगा (यदि आप एप्लिकेशन बनाते समय Hangup URL निर्दिष्ट करते हैं, तो अनुरोध इसे भेजा जाएगा)। क्वेरी पैरामीटर कुछ इस तरह दिखते हैं:

 [Direction] => inbound [BillDuration] => 0 [From] => sip:sipname8905@phone.plivo.com [CallerName] => sipname8905 [HangupCause] => USER_BUSY [BillRate] => 0.00400 [To] => called_number [Duration] => 0 [CallUUID] => 138caf72-615d-11e2-8f6e-659f0688e76c [CallStatus] => busy [Event] => Hangup

CallStatus और HangupCause अलग हो सकते हैं। यह मामला तब है जब संख्या व्यस्त थी।
यहाँ DirectDial Application के Answer URL के लिए एक नमूना स्क्रिप्ट है। मैंने इस उदाहरण का उपयोग किया, इसमें आउटगोइंग कॉल के इतिहास को बचाने के लिए तरीकों को जोड़ा गया। सबसे सरल उत्तर इस तरह दिखता है:

 <?xml version="1.0" encoding="utf-8"?> <Response> <Hangup/> </Response>

अब चलिए Number Application पर चलते है। आपको एक अलग उत्तर URL निर्दिष्ट करके एक नया एप्लिकेशन बनाने की आवश्यकता है, आपको डिफ़ॉल्ट समापन बिंदु एप्लिकेशन चेकबॉक्स की जांच करने की आवश्यकता नहीं है। यदि आपके पास किराए के कमरों के लिए यह एकमात्र आवेदन है, तो डिफ़ॉल्ट संख्या के आवेदन को नोट किया जा सकता है। अब, जब कोई किराए के नंबर पर कॉल करता है, जो नंबर एप्लिकेशन से जुड़ा होता है, तो प्लिवो इस एप्लिकेशन के उत्तर URL के लिए एक अनुरोध भेजेगा। क्वेरी पैरामीटर कुछ इस तरह दिखाई देंगे:

 [Direction] => inbound [From] => calling_number [CallerName] => +calling_number [BillRate] => 0.00900 [To] => rented_number [CallUUID] => 4f26b9b5-4468-4d95-8f52-e24b084b8a76 [CallStatus] => ringing [Event] => StartApp

इस अनुरोध की प्रतिक्रिया भी भेजी जानी चाहिए। मेरे मामले में, मैं खाते के लिए SIP डेटाबेस में देख रहा हूं, जो rent_number के अनुरूप है और SIP खाते को कॉल पुनर्निर्देशित करता है। जवाब इस तरह दिखता है:

 <?xml version="1.0" encoding="utf-8"?> <Response> <Dial callerId="calling_number"> <User>related_endpoint</User> </Dial> </Response>

SIP खाते और नंबर के बीच का कनेक्शन मेरे डेटाबेस में संग्रहीत है, इसलिए यह देखने की कोशिश न करें कि एपीआई के माध्यम से या प्लिवो पर सेटिंग्स में यह कैसे करें। DirectDial Application के उत्तर URL के लिए प्रयुक्त स्क्रिप्ट के समान है। इस बिंदु पर, आप केवल आवश्यक आदेशों के साथ उत्तर भेजकर एक आंसरिंग मशीन बना सकते हैं। इसके अलावा, यदि आपने नंबर एप्लिकेशन बनाते समय Hangup URL को निर्दिष्ट नहीं किया है, तो कॉल के अंत में आपको DirectDial Application के उत्तर URL के लिए एक ही अनुरोध प्राप्त होगा। और यहाँ उत्तर समान हो सकता है।
अब हम सबसे दिलचस्प - फोन करने के लिए पारित करेंगे। एक उदाहरण यहाँ देखा जा सकता है । आरंभ करने के लिए, प्लेवो द्वारा प्रदान किए गए कनेक्ट जे.एस.

 <script type="text/javascript" src="https://s3.amazonaws.com/plivoweb-sdk/plivo.min.js"></script>

अब हम Plivo ऑब्जेक्ट को इनिशियलाइज़ कर सकते हैं

 Plivo.onWebrtcNotSupported = webrtcNotSupportedAlert; Plivo.onReady = onReady; Plivo.init();

webrtcNotSupportedAlert एक उपयोगकर्ता-परिभाषित फ़ंक्शन है जिसे प्रारंभ के बाद कहा जाएगा यदि ब्राउज़र webRTC तकनीक का समर्थन नहीं करता है। यदि ब्राउज़र webRTC का समर्थन करता है तो onReady को बुलाया जाएगा। ऑनरेड विधि में, लॉगिन और पासवर्ड पूर्वनिर्धारित होने पर उपयोगकर्ता के लिए लॉग इन करना सुविधाजनक है, और प्लिवो घटनाओं के लिए तरीकों को बांधें। मैं न्यूनतम आवश्यक कोड का एक उदाहरण दूंगा।

 onIncomingCall = function (acc_name) { //     $('#answer-button').click(function(){Plivo.conn.answer();}); } onReady = function () { Plivo.conn.login(username, pass); Plivo.onIncommingCall = onIncommingCall; $('#button-call').click(function(){ var numb = $('#number-textfield').val().replace(/[\D,\s]/g, ''); Plivo.conn.call(numb); }); $('#button-hangup').click(function(){ Plivo.conn.hangup(); }); }

सभी घटनाओं की एक सूची यहाँ उपलब्ध है । आप बीप्स के बजाय अपनी खुद की रिंगटोन और कुछ और भी सेट कर सकते हैं।

यह सेवा हॉटलाइन बनाने के लिए उपयोग करने के लिए सुविधाजनक है, या किसी अन्य देश के ग्राहकों को आसानी से और सस्ते में उस देश में एक कमरा किराए पर लेकर आपसे संपर्क करने में सक्षम है।

लेकिन मरहम में एक मक्खी के बिना नहीं। यह केवल अब तक क्रोम में काम करता है। इसके अलावा, 24 और 25 के संस्करणों में ध्वनि के साथ समस्याएं हैं। क्रोम 23 में, सब कुछ ठीक काम किया।

WebRTC और Plivo सेवा का उपयोग कर एक ब्राउज़र में एक फोन बनाना

More articles: