वेब सॉकेट और WAMP प्रोटोकॉल का उपयोग करके ब्राउज़र में PubSub

एक ब्राउज़र में वास्तविक समय डेटा अपडेट को लागू करने के तरीकों का अध्ययन करते हुए, मैंने वेब सॉकेट्स के आधार पर मैसेजिंग के लिए एक एप्लीकेशन लेयर प्रोटोकॉल " WAMP " की खोज की।
प्रोटोकॉल डेटा एक्सचेंज के लिए दो सामान्य उच्च-स्तरीय टेम्पलेट्स लागू करता है: PubSub और RPC (दूरस्थ प्रक्रिया कॉल)।

ये टेम्प्लेट कई के लिए जाने जाते हैं और व्यापक रूप से प्रोग्रामिंग और इंटरप्रोसेस संचार के विभिन्न क्षेत्रों में उपयोग किए जाते हैं:

• आरपीसी - दूरस्थ प्रक्रिया कॉल। इस प्रक्रिया में क्लाइंट और सर्वर शामिल हैं। पहला सर्वर पर प्रक्रिया को कॉल करने के लिए अनुरोध भेजता है, और दूसरा उन्हें निष्पादित करता है और ग्राहक को परिणाम भेजता है। एक विशिष्ट वेब एप्लिकेशन में, यह हो सकता है, उदाहरण के लिए, एक टिप्पणी बनाने या अपने पसंदीदा में एक पोस्ट जोड़ने का अनुरोध
• पब्लिश / सब्सक्राइब (पबसब) एक मैसेजिंग मेथड है, जिसमें क्लाइंट अपने लिए ब्याज की घटनाओं की "सदस्यता लेते हैं" और खुद भी इसी तरह की घटनाओं को उत्पन्न कर सकते हैं। एक तृतीय पक्ष - एक "दलाल" ग्राहकों को जानकारी भेजने में लगा हुआ है। WAMP में, PubSub टेम्पलेट विषयों या चैनलों के आधार पर कार्यान्वित किया जाता है। उदाहरण के लिए, किसी साइट पर ऐसे चैनल "टिप्पणियां", "समाचार", "निजी संदेश" हो सकते हैं।

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

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

ऐसी साइट पर क्लाइंट-सर्वर इंटरैक्शन के तरीकों की योजना बनाते समय, याद रखें कि अभी भी ब्राउज़र हैं जो वेब सॉकेट का समर्थन नहीं करते हैं। और यद्यपि पॉलीफ़िल्स उनके साथ कुछ समस्याओं को हल कर सकते हैं, किसी भी वातावरण में 100% काम (उदाहरण के लिए, एंड्रॉइड पर) उनकी मदद से प्राप्त नहीं किया जा सकता है। इसलिए, यह उचित है, मेरी राय में, ग्राहक पर पबसब टेम्पलेट के उपयोग को सीमित करने के लिए केवल सदस्यता के लिए। ईवेंट को "पुराना स्कूल" प्राप्त करने वाले सर्वर द्वारा उत्पन्न किया जाएगा जो इसके लेखक की ओर से एक नई टिप्पणी बनाने का अनुरोध करता है। इस प्रकार, सभी ग्राहक टिप्पणियों को जोड़ने में सक्षम होंगे (या, सामान्य रूप से, घटनाओं को उत्पन्न करते हैं), लेकिन केवल जो वेबस्केट का समर्थन करते हैं वे वास्तविक समय में अपडेट प्राप्त कर सकते हैं।

साइट का क्लाइंट हिस्सा।

ऑटोबान पुस्तकालय वैश्विक दायरे में एब वस्तु का निर्यात करता है, जिसके तरीकों की पूरी सूची प्रलेखन में पाई जा सकती है। हम कनेक्ट विधि में रुचि रखते हैं:

ab.connect( //  'ws://site.com:8080', //     . //    session, //          function (session) { //   .    - , //     . session.subscribe('comments', onNewComment); }, //     . //   ,    , //        . function onClose() { alert('   '); }, { //     'maxRetries': 100, 'retryDelay': 5000 } ); //     comments function onNewComment(topic, data) { //topic -  ,     // data  ,  . //       content  author. console.log(' ', data.author, data.content); } 

सादगी के लिए, लाइन 'टिप्पणियों' को चैनल के नाम के रूप में चुना गया था, हालांकि, प्रोटोकॉल विनिर्देश के अनुसार, ऐसा नामकरण सही नहीं है। चैनल को URI प्रारूप में प्रस्तुत किया जाना चाहिए, अर्थात हमारे मामले में चैनल को बुलाया जा सकता है site.com/comments site.com/comments । बदले में, चैनल URI को "कॉम्पैक्ट URI" के लिए छोटा किया जा सकता है - CURIE। इन विवरणों को विनिर्देश पृष्ठ पर अधिक विस्तार से वर्णित किया गया है।

यह तर्कसंगत है कि एक वास्तविक साइट पर उपयोगकर्ता को एक बार में सभी नई टिप्पणियों की आवश्यकता नहीं होती है, लेकिन केवल वे जो वर्तमान पृष्ठ पर दिखाई देते हैं, उनकी आवश्यकता होती है। इस मामले में, आप इस तरह के चैनल के लिए उदाहरण बना सकते हैं: site.com/comments/page/1 site.com/comments/page/1 । बेशक, यूआरआई के गठन पर कोई प्रतिबंध नहीं है: आप कार्यों के आधार पर गतिशील रूप से किसी भी पैरामीटर के साथ चैनल बना सकते हैं।

साइट का सर्वर साइड।

PHP के साथ उदाहरण में, ZMQ वेब सर्वर पर संदेश भेजने के लिए जिम्मेदार http सर्वर से संदेश भेजने के लिए जिम्मेदार है। जब एक नई टिप्पणी प्राप्त होती है, तो सर्वर इसे डेटाबेस में सहेजता है और ZMQ कतार को एक संदेश भेजता है, जिससे यह ऊपर बताए गए शाफ़्ट लाइब्रेरी का उपयोग करके डेमॉन द्वारा प्राप्त किया जाएगा।
यहाँ इस तरह के एक समारोह का कार्यान्वयन कैसा दिखता है:

 //  ,   ajax     $comment=array('author'=>'', 'content'=>', !'); //   ... $commentModel->save($comment); //       $loop = React\EventLoop\Factory::create(); $context = new React\ZMQ\Context($loop); $push = $context->getSocket(\ZMQ::SOCKET_PUSH); //   ZMQ   ,   ,    $push->connect('tcp://127.0.0.1:8081'); //     json $push->send(json_encode($comment)); //tick     . //     -  . $loop->tick(); 

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

इस तरह की प्रक्रिया शुरू करने का कोड कुछ इस तरह होगा:

 //websocket-   React $loop = React\EventLoop\Factory::create(); //processor -     WAMP,     . //    WampServerInterface. //       //        http-. $processor = new WampProcessor(); //    http-  ZMQ   8081... $context = new React\ZMQ\Context($loop); $pull = $context->getSocket(ZMQ::SOCKET_PULL); $pull->bind('tcp://127.0.0.1:8081'); //        'onComment'  'processor' $pull->on('message', array($processor, 'onComment')); //     -    8080   IP $app = new \components\SocketServer\App('site.com', 8080, '0.0.0.0', $loop); //          , //     (Ratchet    Symfony). //     ,    . //  ""     WampProcessor. $app->route('/', $processor, array('*')); //... $app->run(); 

रैम्पहेट प्रलेखन में देखा जा सकता है कि वैम्पप्रोसेसर वर्ग की सभी विधियाँ लगभग समान होंगी; उनमें से यह केवल घटना हैंडलर को उजागर करने के लायक है - " ऑनकममेंट " विधि:

 /** * @param string   JSON,   ZeroMQ */ public function onComment($json) { $comment = json_decode($json, true); //  ,         if (!array_key_exists('comments', $this->subscribedTopics)) { return; } $topic = $this->subscribedTopics['comments']; //     . $topic->broadcast($comment); } 

इस प्रकार, एक नई टिप्पणी बनाते समय, सभी जुड़े हुए ब्राउज़रों को लेखक और सामग्री क्षेत्रों के साथ एक वस्तु प्राप्त होगी, जिसे जावास्क्रिप्ट हैंडलर प्राप्त करने की उम्मीद करता है।

मैसेजिंग प्रक्रिया क्रोम कंसोल ("नेटवर्क" टैब में "वेबसोकेट" को फ़िल्टर करके या किसी अन्य ब्राउज़र में देखी जा सकती है। यह देखा जा सकता है कि सर्वर से कनेक्ट होने पर, ब्राउज़र एक स्वागत योग्य संदेश भेजता है, और फिर सदस्यता के लिए चैनलों की एक सूची।

निष्कर्ष।

तो, WebSockets प्रौद्योगिकी और WAMP प्रोटोकॉल का उपयोग करके, आप Pubbub विधि का उपयोग करके वेब पेज पर जानकारी के वास्तविक समय अद्यतन को लागू कर सकते हैं।
यह तर्क दिया जा सकता है कि नोडज और सॉकेट.आईओ लाइब्रेरी का उपयोग करना आसान होगा, लेकिन हमारी वास्तविकता में, जहां PHP प्रमुख सर्वर प्लेटफॉर्म है, वर्णित विकल्प काफी व्यवहार्य है और यहां तक ​​कि अन्य की तुलना में अधिक सुविधाजनक है, अधिक "स्टोक" तरीके (जैसे कि आवक का उपयोग कर आवधिक सर्वर मतदान)। मौजूदा साइट पर इसे लागू करना अपेक्षाकृत आसान हो सकता है: परिवर्तन केवल उन हिस्सों में किए जाने की आवश्यकता होगी जहां कुछ घटनाएं उत्पन्न होती हैं, और साइट से डेमन-हैंडलर पूरी तरह से स्वतंत्र हो सकते हैं।

मुख्य लिंक:

• वैम्प - वेबसोकेट एप्लिकेशन मैसेजिंग प्रोटोकॉल।
• ऑथोबान - जावास्क्रिप्ट में WAMP का कार्यान्वयन।
• शाफ़्ट - PHP में वेब सॉकेट और WAMP का कार्यान्वयन।