ASP.NET MVC पर सरल वीडियो चैट कार्यान्वयन

शुभ दिन, सज्जनों, हब्रायुजरी!
इस विषय में, मैं आपको ASP.NET MVC पर सरल वीडियो चैट बनाने का तरीका बताऊंगा।

लेकिन शुरुआत के लिए, पृष्ठभूमि। हम इंटरनेट के माध्यम से एक डॉक्टर के साथ एक वीडियो परामर्श सेवा शुरू कर रहे हैं। इसके बारे में निश्चित रूप से एक अलग लेख होगा, लेकिन अब हम यह पता लगाना चाहते हैं कि सर्वर और चैनल कितना भार झेल सकते हैं।
ऐसा करने के लिए, हमने एक छोटा सा वेब एप्लिकेशन, स्रोत कोड और विवरण लिखा, जिसके बारे में मुझे आपके साथ साझा करने में खुशी हो रही है।
मूल विचार चैट चैट से उधार लिया गया था: आप सामान्य चैट में जाते हैं, किसी भी व्यक्ति का चयन करें, जिससे आप बात कर रहे हैं और वीडियो के माध्यम से संवाद करते हैं।
परियोजना का स्रोत कोड एक नि: शुल्क लाइसेंस के तहत codeplex.com पर प्रकाशित हुआ है , मुझे टिप्पणियों / टिप्पणियों / सुझावों पर खुशी होगी।

So. प्रोटोकॉल के रूप में, मैंने RTMP को सबसे आम चुना। RTMFP क्यों नहीं? बस RTMFP का उपयोग करके ग्राहकों के बीच एक स्थिर कनेक्शन प्राप्त करना मुश्किल है, जो कि भुगतान किए गए वीडियो परामर्श प्रदान करने के लिए आवश्यक है, और आईडी वितरित करने का सर्वर कार्यान्वयन स्थिर उपयोग के लिए उपलब्ध नहीं है। सर्वर Wowza मीडिया सर्वर है , जैसा कि निशुल्क Red5 के विपरीत (मुझे उसके समर्थकों को माफ़ कर दें) इसके उदाहरणों के साथ स्पष्ट प्रलेखन है, और एफएमएस के विपरीत , परीक्षण अवधि 30 दिन और स्वीकार्य मूल्य नीति है। और हम व्यवहार में काम की गुणवत्ता की जांच करेंगे, जहां तक ​​मुझे लगता है कि प्रदर्शन में तीनों के बीच कोई मजबूत अंतर नहीं है। एक विकल्प के रूप में, हम एर्लीविडियो पर विचार करते हैं , लेकिन अभी तक इसे विस्तार से देखने और प्रयास करने की कोई संभावना नहीं है।

सब कुछ ASP.NET MVC 4 के तहत लिखा गया है। और ग्राहकों के बीच पाठ चैट और संचार के कार्यान्वयन के लिए, सिग्नलआर लाइब्रेरी का उपयोग किया जाता है ।

अंक पर आगे।

चैट का कार्यान्वयन।
यहां मुख्य बात दो चैटमेसेज और चैट क्लासेस हैं।
चाट क्लास को सिग्नलआर से मिला है। हब्सहब और ग्राहकों के साथ काम करने के बुनियादी तरीकों को लागू करता है:

//      . public void JoinRoom(string roomKey, string userName) { //          if (roomKey == C.MAIN_CHAT_GROUP) Store.Add(new User(Context.ConnectionId, userName)); //    id Clients[Context.ConnectionId].OnJoinRoom(Context.ConnectionId); //     Groups.Add(Context.ConnectionId, roomKey); //       UpdateUsers(); } //      public void Send(ChatMessage message) { // -       if (message.Content.Length > 0) { //   message.Date = DateTime.Now; //   message.SenderKey = Context.ConnectionId; //       message.Content = HttpUtility.HtmlEncode(message.Content); message.SenderName = HttpUtility.HtmlEncode(message.SenderName); //      Clients[message.RoomKey].OnSend(message); Store.SaveMessage(message); } } 

यहां स्टोर उपयोगकर्ताओं का एक स्थिर संग्रह है, जिसे यदि वांछित है, तो आसानी से अपने स्वयं के कार्यान्वयन से बदला जा सकता है।
हमारे डेमो में, इसे स्टैटिक वेरिएबल के बजाय डेटाबेस में स्टोर किया जाता है।

हम क्लाइंट पर उपयुक्त तरीके बनाते हैं। संक्षिप्तता के लिए, मैंने एक विशिष्ट कार्यान्वयन छिपाया

 var CHAT = {}; var OPTIONS = {}; function Start(data) { //  ,  OPTIONS.SenderName = data.name; OPTIONS.RoomKey = 'MAIN'; CHAT = $.connection.chat; //   ,    CHAT.OnSend = OnSend; CHAT.OnJoinRoom = OnJoinRoom; } //       function OnJoinRoom(key) { OPTIONS.SenderKey = key; } //         function OnUpdateUsers(data) { /* ... ,  data  - User,     IUser */ } //    ,   Chat.Send function Send() { var messageInput = $("#msg"), //  ,      ChatMessage msg = { 'SenderName': OPTIONS.MyName, 'RoomKey': OPTIONS.RoomKey, 'Content': messageInput.val() }; CHAT.send(msg); //  :    -     messageInput.val(""); messageInput.focus(); } // ,       function OnSend(msg) { var chatContent = $(".chat_content"), msgClass = 'chat_message'; /* ...    ,  msg - ,     ChatMessage */ } 

अगला, आपको "कॉल" की कार्यक्षमता प्रदान करने की आवश्यकता है। ऐसा करने के लिए, हम चैट के तरीकों को जोड़ते हैं जो कॉल की शुरुआत, अस्वीकृति और कॉल की स्वीकृति को संभालते हैं।

 //   ( ) public void Call(string recieverKey, string senderKey, string senderName) { Clients[recieverKey].OnCall(senderKey, senderName); } //    public void RejectCall(string senderKey, string recieverKey, string recieverName) { Clients[senderKey].OnRejectCall(recieverKey, recieverName); } //   public void AcceptCall(string calleePulicKey, string calleeName, string myName) { string myKey = Guid.NewGuid().ToString().Replace("-", ""); string calleeKey = Guid.NewGuid().ToString().Replace("-", ""); string roomKey = Guid.NewGuid().ToString().Replace("-", ""); var model = new RoomModel { MyPublicKey = Context.ConnectionId, MyKey = myKey, MyName = myName, CalleePublicKey = calleePulicKey, CalleeKey = calleeKey, CalleeName = calleeName, RoomKey = roomKey }; //      Store.SaveRoomInfo(model); //   Clients[calleePulicKey].OnAcceptCall(false, roomKey); Clients[Context.ConnectionId].OnAcceptCall(true, roomKey); } 

कार्य की योजना इस प्रकार है: जब एक ग्राहक (उदाहरण के लिए, एंजेलीना) दूसरे को कॉल करना चाहता है (उदाहरण के लिए, पीट), एंजेलिना कॉल विधि को कॉल करता है और उसे पेटी की कुंजी, उसकी कुंजी और उसका नाम देता है। पीट, हम एक OnCall अधिसूचना भेजते हैं, क्लाइंट पर हम इसे प्रोसेस करते हैं और एंजेलीना से कॉल के बारे में एक संदेश प्रदर्शित करते हैं। यदि पेटीए कॉल को अस्वीकार करने का फैसला करता है, तो वह रिजेक्ट कॉल विधि को कॉल करता है और कॉलर की कुंजी, उसकी कुंजी और उसका नाम वापस करता है। हम एंजेलीना को एक OnRejectCall नोटिफिकेशन भेजते हैं, जिसमें हम एंजेलीना को कॉल रिजेक्शन नोटिफिकेशन दिखाते हैं।
अगर पेटिया को कॉल मिलती है, तो वह एक्सेकॉल विधि से कॉल करता है, जिसमें हम नए पहचानकर्ता और दोनों ग्राहकों के लिए व्यक्तिगत चैट रूम की कुंजी तैयार करते हैं। फिर हम दोनों OnAcceptCall नोटिफिकेशन भेजते हैं, उनके साथ आवश्यक कुंजियाँ पास करते हैं। अधिसूचना हैंडलर में क्लाइंट पर, हम पेटीएम और एंजेलिना दोनों को व्यक्तिगत चैट पेज पर पुनर्निर्देशित करते हैं:

 function OnAcceptCall(isMy, roomKey) { document.location = '@Url.Action("Room", "Home")' + '?isMy=' + isMy + '&roomKey=' + roomKey; } 

व्यक्तिगत चैट पेज पर, हस्तांतरित कुंजियों का उपयोग करके, USB फ्लैश ड्राइव और टेक्स्ट चैट को इनिशियलाइज़ करें। कक्ष पृष्ठ पर पाठ चैट के लिए, हम उसी चैट ऑब्जेक्ट का उपयोग करते हैं, बस क्लाइंट पर उपयोगकर्ताओं और कॉल की सूची को अपडेट करने की घटनाओं को संसाधित नहीं करते हैं।

अगला, फ्लैश ड्राइव पर जाएं।
संचार को व्यवस्थित करने के लिए, हमें एक स्ट्रीम बनानी होगी जिसे हम सर्वर पर "प्रकाशित" करेंगे और इंटरलॉकर द्वारा प्रकाशित स्ट्रीम की सदस्यता लेंगे। सर्वर पर धाराएँ प्रकाशन के प्रारंभ में सर्वर को प्रेषित कीज़ द्वारा पहचानी जाती हैं।
जब फ्लैश ड्राइव को इनिशियलाइज़ किया जाता है, तो हम पेज से चाबी प्राप्त करते हैं, उन्हें स्थानीय चरों में सहेजते हैं और टाइमर शुरू करते हैं, जो संचार सत्र की शुरुआत और प्रगति की निगरानी करेगा। सर्वर कनेक्शन बनाने, प्रकाशित करने और स्ट्रीम की सदस्यता लेने के लिए तीन विधियों का उपयोग किया जाता है:

 private function Connect():void { if (!isConnected && rtmpConnection == null) { //   rtmpConnection = new NetConnection(); rtmpConnection.connect(connectStr); //       rtmpConnection.addEventListener(NetStatusEvent.NET_STATUS, onNetStatus_rtmpConnection); } isConnected = true; } private function StartPublish():void { //     nsPublish = new NetStream(rtmpConnection); nsPublish.addEventListener(NetStatusEvent.NET_STATUS, onNetStatus_nsPublish); //     0 nsPublish.bufferTime = 0; //  nsPublish.publish(publishName); //     nsPublish.attachCamera(camera); nsPublish.attachAudio(microphone); isPublish = true; } private function StartSubscribe():void { // C       nsSubscribe = new NetStream(rtmpConnection); //     nsSubscribe.addEventListener(NetStatusEvent.NET_STATUS, onNetStatus_nsSubscribe); //     0 nsSubscribe.bufferTime = 0; //    var volume:Number = sldrVolume.value / 100; var st:SoundTransform = new SoundTransform(volume); nsSubscribe.soundTransform = st; //    nsSubscribe.play(subscribeName); //     videoRemote.attachNetStream(nsSubscribe); isSubscribe = true; } 

जब टाइमर चालू हो जाता है, तो हम जांचते हैं कि क्या हम सर्वर से जुड़े हैं और प्रकाशन और सदस्यता धाराओं की स्थिति। और सभी जांचों की सफलता के मामले में, हम टॉक टाइम पर विचार करते हैं

 private function onTick_Timer(event:TimerEvent):void { if(!isConnected)//   { lblEndTime.text = "..."; Connect(); startTime = new Date(); } else { if(!isPublish && needPublish)//   { lblEndTime.text = "..."; StartPublish(); } if(!isSubscribe)//    { lblEndTime.text = "..."; StartSubscribe(); } if(isPublish && isSubscribe)//   ,    { var now:Date = new Date(); var toStart:TimeSpan = new TimeSpan(now.getTime() - startTime.getTime()); lblEndTime.text = toStart.getTotalMinutes() + ':' + toStart.getSeconds(); } } } 

वह लगभग सभी।

अंतिम घटक मीडिया सर्वर है।
Wowza Media Server ने स्थापना और कॉन्फ़िगरेशन में कोई विशेष कठिनाइयों का कारण नहीं बनाया। आधिकारिक वेबसाइट से वितरण किट डाउनलोड करें, इंस्टॉल करें, मशीन पर 1935 वां पोर्ट खोलें और यूएसबी फ्लैश ड्राइव में सर्वर का पता लिखें। यदि आप चाहें, तो आप किसी अन्य सर्वर का उपयोग कर सकते हैं जो RTMP: Red5, Adobe FlashMediaServer, erlyvideo का समर्थन करता है। क्लाइंट कार्यान्वयन सर्वर पर निर्भर नहीं करता है।

इस परीक्षण के हमारे लक्ष्य:
1. पता लगाएँ कि हम एक साथ कितने उपयोगकर्ताओं को संप्रेषित कर सकते हैं जो गुणवत्ता खोए बिना सामना कर सकते हैं।
2. बेहतर कार्यान्वयन के लिए सुझाव प्राप्त करें
3. शायद सुरक्षा छेद मिल जाए

UPD: परीक्षण समाप्त हो गया है, ऑनलाइन डेमो के लिंक पोस्ट से हटा दिए गए हैं।
नतीजतन, मुझे यह कहना चाहिए कि हेब्राफ़ेक्ट पास हो गया। सर्वर ने अधिकतम आधे लोड पर काम किया।
कुछ नंबर:
1. समय की प्रति यूनिट वीडियो चैट में अधिकतम कितना था - 5 सत्र एक मिनट की सटीकता के साथ शुरू हुए, उनमें से 4 एक मिनट से अधिक समय तक चले
2. कुल कॉल प्रयास - 361
1) इन प्रयासों में, 30 सेकंड से अधिक समय तक चलने वाला - 174
2) 2 मिनट से अधिक समय तक चलना - 38
3) गलत तरीके से पूरा किया गया (पूरा समय निर्धारित किए बिना) - 62
3. चैट संदेशों की कुल संख्या - 12347
1) इनमें से, मुख्य में - 11256
2) व्यक्तिगत में - 1125

मैं लोड परीक्षण में भाग लेने वाले सभी को धन्यवाद देता हूं!