यह लेख लेखक की आगामी एडवांस्ड CableReady पुस्तक के एक अध्याय से आंशिक रूप से प्रेरित है, और AppSignal के लिए इस अतिथि पोस्ट में फिट होने के लिए अनुकूलित किया गया है।
नोटिफिकेशन कई वेब एप्लिकेशन द्वारा साझा की जाने वाली एक विशिष्ट क्रॉस-कटिंग चिंता है।
Noticed जेम आपके रूबी ऑन रेल्स एप्लिकेशन के लिए डेटाबेस-समर्थित मॉडल और प्लगेबल डिलीवरी मेथड्स प्रदान करके नोटिफिकेशन विकसित करना शानदार ढंग से आसान बनाता है। यह मेलर्स, वेबसॉकेट्स और कुछ अन्य डिलीवरी मेथड्स के लिए अंतर्निहित समर्थन के साथ आता है।
हम आपके रूबी ऑन रेल्स एप्लिकेशन में सिस्टम नोटिफिकेशन ट्रिगर करने के लिए CableReady जेम के गुणों की भी जांच करेंगे।
आइए इसमें गोता लगाएं!
पूर्वापेक्षाएँ और आवश्यकताएँ
हर बार, आपको अपने ऐप से सिस्टम नोटिफिकेशन ट्रिगर करने की आवश्यकता हो सकती है। आप इसे नोटिफिकेशन API के साथ प्राप्त कर सकते हैं।
उदाहरण के लिए, मान लें कि आपका एप्लिकेशन उपयोगकर्ताओं को बड़ी फ़ाइलें अपलोड करने की अनुमति देता है जिन्हें ट्रांसकोड होने में लंबा समय लगता है। आप उपयोगकर्ताओं को एक नोटिफिकेशन भेजना चाह सकते हैं जब उनका वीडियो अपलोड पूरा हो जाए। इसका मतलब है कि वे बीच में एक नए कार्य पर स्विच कर सकते हैं और कई मिनटों तक आपका एप्लिकेशन खुला नहीं रखना पड़ेगा।
सौभाग्य से, इन दो पूर्वापेक्षाओं के साथ सिस्टम नोटिफिकेशन को लागू करना और विकसित करना आसान है:
- Noticed में कस्टम डिलीवरी मेथड्स के लिए समर्थन है (Noticed किसी भी ट्रांसपोर्ट मैकेनिज्म को लागू करने के लिए एक सरल API उजागर करता है — उदाहरण के लिए, डिस्कॉर्ड सर्वर पर पोस्ट करना)।
- CableReady के तरकश में एक नोटिफिकेशन ऑपरेशन तीर है।
CableReady और Noticed के लिए आवश्यकताओं की सूची छोटी है — आपको बस निम्नलिखित की आवश्यकता है:
- एक चल रहा ActionCable सर्वर
- एक ActiveJob बैकएंड (आमतौर पर Noticed द्वारा उपयोग किया जाता है)
नोट: इस प्रोजेक्ट के लिए संपूर्ण नमूना कोड GitHub पर उपलब्ध है। आप नीचे भी अनुसरण कर सकते हैं — हम आपको चरण-दर-चरण मार्गदर्शन करेंगे।
आपके रूबी ऑन रेल्स एप्लिकेशन के लिए CableReady प्राइमर
आइए CableReady से खुद को परिचित करके शुरू करें। 2017 में जारी, इसे "मिसिंग ActionCable स्टैंडर्ड लाइब्रेरी" के रूप में सोचा जा सकता है।
Turbo के आगमन से पहले, रूबी ऑन रेल्स में रीयल-टाइम एप्लिकेशन बनाने का एकमात्र तरीका ActionCable के माध्यम से था। ActionCable वेबसॉकेट्स के चारों ओर रेल्स का नेटिव रैपर है, जो सर्वर-साइड और क्लाइंट-साइड दोनों API प्रदान करता है ताकि किसी भी समय दोनों दिशाओं में एक स्थायी कनेक्शन के माध्यम से संदेश भेजे जा सकें।
इस दृष्टिकोण का नकारात्मक पहलू (था और है) कि आपको इसे बनाने के लिए बहुत सारा बॉयलरप्लेट कोड लिखना पड़ता है।
यह वह जगह है जहां CableReady DOM ऑपरेशन्स की एक भीड़ के चारों ओर एक अब्स्ट्रैक्शन लेयर प्रदान करके मदद करता है जिसे सर्वर पर ट्रिगर किया जाना है। कुछ उदाहरणों में शामिल हैं:
- DOM म्यूटेशन्स (
inner_html,insert_adjacent_html,morph, आदि) - DOM एलिमेंट प्रॉपर्टी म्यूटेशन्स (
add_css_class,remove_css_class,set_dataset_property, आदि) - मनमाने DOM इवेंट्स डिस्पैच करना
- ब्राउज़र हिस्ट्री मैनिपुलेशन
- नोटिफिकेशन्स (जिनका हम उपयोग करेंगे)
CableReady सर्वर और क्लाइंट
CableReady अपना जादू कैसे चलाता है? संक्षेप में, इसमें सर्वर-साइड और क्लाइंट-साइड भाग होते हैं।
सर्वर साइड पर, मॉड्यूल CableReady::Broadcaster को आपके एप्लिकेशन के किसी भी हिस्से में शामिल किया जा सकता है जो इसके लिए कॉल करता है। यह एक जॉब, एक मॉडल कॉलबैक, या एक साधारण कंट्रोलर में हो सकता है। लेकिन पहले, एक ActionCable चैनल को जगह में होना चाहिए। CableReady के आधिकारिक दस्तावेज़ को उद्धृत करने के लिए:
ध्यान दें कि visitors को स्ट्रीम आइडेंटिफायर कहा जाता है। इसका उपयोग या तो व्यापक दर्शकों को लक्षित करने के लिए या केवल आपके चैनल की सदस्यता लेने वाले विशिष्ट क्लाइंट्स को लक्षित करने के लिए किया जा सकता है। उदाहरण को समाप्त करने के लिए, हम ब्रॉडकास्टर मॉड्यूल को एक मॉडल में शामिल कर सकते हैं और साइन-अप के बाद क्लाइंट को console.log भेज सकते हैं:
क्लाइंट साइड पर, तर्क सरल है। उपरोक्त चैनल की सदस्यता बनाएं। फिर, इसके प्राप्त हुक में, वायर पर पास किए गए सभी ऑपरेशन्स पर CableReady.perform कॉल करें:
रेल्स के लिए CableReady बनाम Turbo
संक्षेप में, आपको CableReady का उपयोग कब करना चाहिए, और कब इससे बचना चाहिए?
Turbo की शुरूआत के साथ, वेब डेवलपमेंट समुदाय को सर्वर-रेंडर्ड रिएक्टिव एप्लिकेशन बनाने के लिए एक शक्तिशाली टूलबॉक्स मिला। अनिवार्य रूप से रेल्स के लिए शक्तिशाली सर्वर-साइड बाइंडिंग के साथ एक फ्रंटएंड तकनीक, यह मानक मॉडल-व्यू-कंट्रोलर (MVC) स्टैक में अच्छी तरह से फिट बैठता है। इस प्रकार, यह आपके विशिष्ट ऐप की अधिकांश आवश्यकताओं को कवर कर सकता है।
दूसरी ओर, CableReady रीयल-टाइम रेल्स डेवलपमेंट का स्विस आर्मी नाइफ है और इसका उपयोग सावधानी से किया जाना चाहिए। यह एक शक्तिशाली अब्स्ट्रैक्शन है जो बहुत आकर्षक लग सकता है। लेकिन यदि आप कल्पना करते हैं कि आपके ऐप में DOM का हर हिस्सा आपके ऐप के किसी भी स्थान से म्यूटेट किया जा सकता है, तो आप समझेंगे कि इससे रेस कंडीशन और ट्रैक करने में कठिन बग्स हो सकते हैं।
हालांकि, हाथ में लिए गए मामले जैसे मामले हैं, जहां CableReady पूरी तरह से समझ में आता है क्योंकि यह DOM पर अधिक बारीक नियंत्रण की अनुमति देता है।
एक सरल TLDR के लिए पूछा गया, मैं जवाब दूंगा कि Turbo एप्लिकेशन डेवलपर्स के लिए है, जबकि CableReady लाइब्रेरी बिल्डर्स के लिए है। लेकिन जैसा कि हम देखेंगे, दोनों के बीच ग्रे क्षेत्र हैं।
Noticed — रूबी ऑन रेल्स एप्लिकेशन के लिए सरल नोटिफिकेशन
दूसरी लाइब्रेरी जिसे हम सिस्टम नोटिफिकेशन देने के लिए लागू करेंगे, वह है क्रिस ओलिवर का Noticed जेम। इसके दिल में, यह एक ActiveRecord मॉडल पर बनाया गया है जो एक प्राप्तकर्ता को एक नोटिफिकेशन मॉडल करता है। यह सामान्य मेटाडेटा रखता है, जैसे:
- नोटिफिकेशन किसे भेजा गया था (प्राप्तकर्ता)
- नोटिफिकेशन कब पढ़ा गया था
- नोटिफिकेशन से जुड़े कोई भी पैरामीटर्स (आमतौर पर किसी अन्य मॉडल का संदर्भ)
यदि आप इस बात से परिचित हैं कि ActiveStorage/ActionText मेटा-टेबल्स कैसे काम करते हैं, तो यह बहुत समान है।
इसके निकट, Noticed POROs (प्लेन ओल्ड रूबी ऑब्जेक्ट्स, यानी रेल्स या अन्य फ्रेमवर्क से बिना किसी कनेक्शन के ऑब्जेक्ट्स) का उपयोग करता है, जो वास्तविक नोटिफिकेशन के लिए ब्लूप्रिंट के रूप में कार्य करते हैं। ये, कुछ हद तक भ्रामक रूप से, नोटिफिकेशन भी कहलाते हैं और उन्हें कैसे रेंडर और वितरित करना है, इसके बारे में तर्क रखते हैं। README से एक उदाहरण यहां दिया गया है:
हम इसे शीघ्र ही काम करते हुए देखेंगे। विशेष रुचि के deliver_by इनवोकेशन हैं, क्योंकि वे निर्धारित करते हैं कि इस नोटिफिकेशन को किन डिलीवरी मेथड्स का उपयोग करना चाहिए:
deliver_by :databaseबाद में एक्सेस के लिए एक नोटिफिकेशन रिकॉर्ड (ऊपर उल्लिखित मॉडल का) स्टोर करता हैdeliver_by :action_cableइसे एक परिभाषित ActionCable चैनल और स्ट्रीम के माध्यम से भेजता है (डिफ़ॉल्टNoticed::NotificationChannel)deliver_by :emailनोटिफिकेशन भेजने के लिए उपयोग किए जाने वाले मेलर को निर्दिष्ट करता है। उदाहरण दिखाता है कि प्राप्तकर्ता(ओं) द्वारा सेट की गई किसी भी प्राथमिकता को कैसे ध्यान में रखा जाए।
इस लेख के शेष भाग के लिए हमारा लक्ष्य एक कस्टम डिलीवरी मेथड को लागू करना है जो हमारे सिस्टम नोटिफिकेशन भेजेगा।
एक कस्टम डिलीवरी मेथड: नोटिफिकेशन API के माध्यम से सिस्टम नोटिफिकेशन
इससे पहले कि हम इसे करने के लिए निकलें, आइए एक नया रेल्स एप्लिकेशन बनाकर जमीन साफ करें। क्योंकि CableReady के साथ एकीकरण इस तरह आसान है, मैंने importmaps पर esbuild जावास्क्रिप्ट विकल्प चुना:
नोट: लेखन के समय, वर्तमान रेल्स संस्करण 7.0.4 है। यदि आपके पास एक मौजूदा रेल्स एप्लिकेशन है, तो आप अगले चरण को छोड़ सकते हैं, लेकिन सुनिश्चित करें कि आपके पास एक User मॉडल या समान अवधारणा है जो नोटिफिकेशन प्राप्तकर्ता के रूप में कार्य करेगा।
1. प्राप्तकर्ता तैयार करें
Noticed को प्राप्तकर्ता के रूप में कार्य करने के लिए User मॉडल की आवश्यकता है, इसलिए संक्षिप्त होने के लिए, Devise को खींचें और एक User मॉडल जनरेट करें।
इसके बाद, रेल्स कंसोल खोलें और एक नमूना उपयोगकर्ता बनाएं:
2. Noticed जोड़ें
अब, आइए Noticed को अपने बंडल में जोड़ें और डेटाबेस मॉडल जनरेट करें।
हम वही करते हैं जो बताया गया है, db:migrate चलाते हैं और अपने User मॉडल में पॉलीमॉर्फिक has_many एसोसिएशन जोड़ते हैं:
इससे पहले कि हम इसे परीक्षण के लिए रख सकें, अंतिम टुकड़ा एक ब्लूप्रिंट PORO बनाना है:
हम इसे थोड़ा 조정 करते हैं ताकि यह अभी के लिए केवल डेटाबेस डिलीवरी मेथड और एक प्लेसहोल्डर संदेश का उपयोग करे। आप आमतौर पर यहां आवश्यक पैरामीटर्स जोड़ेंगे, जैसे संदेश और लिंक करने के लिए URL बनाने के लिए एक मॉडल आईडी — विवरण के लिए Noticed README देखें।
केवल रेल्स कंसोल का उपयोग करके, हम अब इस PORO के आधार पर नोटिफिकेशन डिलीवर करने का प्रदर्शन कर सकते हैं:
जैसा कि हम देख सकते हैं, Noticed एक डेटाबेस इन्सर्ट करता है, इसलिए अब हम एक निर्दिष्ट उपयोगकर्ता के लिए सभी Notifications ले सकते हैं:
यह हमारे लिए एक सरल इंडेक्स व्यू बनाने के लिए पर्याप्त है जो वर्तमान उपयोगकर्ता के लिए डिलीवर किए गए सभी नोटिफिकेशन को सूचीबद्ध करता है:
bin/dev के साथ ऐप को स्पिन करने के बाद, हम लॉग इन कर सकते हैं और https://localhost:3000/notifications पर ब्राउज़ कर सकते हैं:
3. CableReady इंस्टॉल करना
CableReady का उपयोग करने के लिए, हमें इसे इंस्टॉल करना होगा। सौभाग्य से, यह जल्दी हो जाता है:
आइए अपने संदेशों को डिलीवर करने के लिए एक NotificationChannel जनरेट करें:
यह सभी लापता ActionCable (जावास्क्रिप्ट) निर्भरताओं को जोड़ देगा और संबंधित चैनल फ़ाइलों को स्कैफोल्ड करेगा, विशेष रूप से app/channels/notification_channel.rb और app/javascript/channels/notification_channel.js।
सर्वर-साइड चैनल के लिए, हम Noticed::NotificationChannel से विरासत में लेते हैं:
इससे पहले कि हम जारी रखें, हमें Devise उपयोगकर्ताओं के लिए अपने ActionCable को प्रमाणित करने की आवश्यकता है। मैं यहां इसके बारे में विस्तार से नहीं जाऊंगा। आवश्यक बॉयलरप्लेट इस तरह दिखता है:
अन्य विकल्पों के लिए StimulusReflex डॉक्स देखें।
क्लाइंट साइड पर, हमें ऊपर उल्लिखित सेटअप कोड का छोटा सा हिस्सा जोड़ना होगा:
नोट: ActionCable के काम करने के लिए Redis आवश्यक है, इसलिए इस लेख का बाकी हिस्सा मानता है कि आपके पास एक स्थानीय सर्वर चल रहा है।
4. डिलीवरी मेथड कार्यान्वयन
सिस्टम नोटिफिकेशन प्रसारित करने के लिए, आइए एक नया डिलीवरी मेथड जनरेट करें:
स्कैफोल्डेड क्लास इस तरह दिखती है:
आइए आगे बढ़ें और ड्राफ्ट करें कि हम अपने deliver मेथड को कैसे काम करने की कल्पना करते हैं।
हमने अंतर्निहित ActionCable डिलीवरी मेथड से आंशिक रूप से channel मेथड उधार लिया है। यह हमें एक चैनल को क्लास मेथड विकल्प के माध्यम से पास करने की अनुमति देता है। अन्यथा, यह प्रदान किए गए Noticed::NotificationsChannel पर वापस आ जाता है।
फिर हम प्राप्तकर्ता को संबंधित इंस्टेंस प्रसारित करने के लिए CableReady की notification मेथड का उपयोग करते हैं।
इसे कार्रवाई में लाने के लिए, हमें इसे अपने नोटिफिकेशन PORO से जोड़ना होगा:
5. इसे काम पर लगाना
अब बस इसे आज़माना बाकी है। हम रेल्स कंसोल से फिर से इसे चला सकते हैं:
यह मानते हुए कि आप अभी भी लॉग इन हैं, ब्राउज़र पहले आपसे ऐप की ओर से नोटिफिकेशन प्राप्त करने की अनुमति मांगेगा:
एक बार जब आप इसकी पुष्टि कर लेते हैं, तो आपको अपने ब्राउज़र से यह सुंदर पॉप-अप नोटिफिकेशन मिलता है:
समापन
CableReady और Noticed के माध्यम से एक फास्ट लेन टूर लेते हुए, हमने दिखाया है कि अपने ऐप में नेटिव ब्राउज़र API को कैसे एकीकृत किया जाए। परिणाम आपके उपयोगकर्ताओं को सिस्टम नोटिफिकेशन डिलीवर करने का एक सरल, सुसंगत तरीका है।
यह उपयोग का मामला यह दिखाने के लिए भी है कि CableReady को अपने उपयोग के मामले में मिलाना कितना आसान है। यदि आप एक कदम आगे सोचते हैं, तो तैयार डिलीवरी मेथड को एक लाइब्रेरी में अलग करना कठिन नहीं है।
मुझे आशा है कि यह आपको अपने ऐप में वर्टिकल रिएक्टिव प्रॉब्लम डोमेन की अभिव्यक्तियों को खोजने और CableReady को आज़माने के लिए प्रेरित करता है।
मेरी नई पुस्तक Advanced CableReady को उठाकर और पढ़ें।
कूपन कोड APPSIGNAL-PROMO का उपयोग करें और $10 बचाएं!
हैप्पी कोडिंग!
P.S. यदि आप रूबी मैजिक पोस्ट को प्रेस से बाहर आते ही पढ़ना चाहते हैं, तो हमारे रूबी मैजिक न्यूज़लेटर की सदस्यता लें और कभी भी एक भी पोस्ट मिस न करें!
