1 परिचय
लक्ष्य
इस कोडलैब में, आप फायरबेस एक्सटेंशन की मदद से एक ऑनलाइन मार्केटप्लेस ऐप में कार्यक्षमता जोड़ेंगे। इस कोडलैब के माध्यम से, आप समझेंगे कि कैसे एक्सटेंशन आपको ऐप विकास और प्रबंधन कार्यों पर कम समय खर्च करने में मदद कर सकते हैं।
आप क्या बनाएंगे
इस कोडलैब में, आप ऑनलाइन मार्केटप्लेस वेब ऐप में निम्नलिखित सुविधाएँ जोड़ेंगे:
- उपयोगकर्ता प्रतिधारण बढ़ाने के लिए छवियों को तेज़ी से लोड करें
- प्रदर्शन में सुधार और अपना बिल कम करने के लिए अपने डेटाबेस में प्रविष्टियाँ सीमित करें
- उपयोगकर्ता डेटा सुरक्षा बढ़ाने के लिए पुराने उपयोगकर्ता डेटा का स्वचालित विलोपन लागू करें
आप क्या सीखेंगे
- सामान्य उपयोग के मामलों के लिए एक्सटेंशन कैसे खोजें
- अपने प्रोजेक्ट में एक्सटेंशन कैसे इंस्टॉल और कॉन्फ़िगर करें
- अपने प्रोजेक्ट में एक्सटेंशन कैसे बनाए रखें (मॉनिटर करें, अपडेट करें और अनइंस्टॉल करें)।
यह कोडलैब फायरबेस एक्सटेंशन पर केंद्रित है। इस कोडलैब में उल्लिखित अन्य फायरबेस उत्पादों के बारे में विस्तृत जानकारी के लिए, फायरबेस दस्तावेज़ और अन्य कोडलैब देखें।
आपको किस चीज़ की ज़रूरत पड़ेगी
- आधुनिक वेब ब्राउज़र वाला कंप्यूटर स्थापित (Chrome अनुशंसित है)
- एक गूगल खाता
2. एक फायरबेस प्रोजेक्ट बनाएं और सेट करें
एक फायरबेस प्रोजेक्ट बनाएं
- फ़ायरबेस कंसोल में, प्रोजेक्ट जोड़ें पर क्लिक करें, और फ़ायरबेस प्रोजेक्ट को FriendlyMarket नाम दें।
- प्रोजेक्ट निर्माण विकल्पों पर क्लिक करें। फ़ायरबेस शर्तें स्वीकार करें. Google Analytics सेट करना छोड़ें, क्योंकि आप इस ऐप में Analytics का उपयोग नहीं करेंगे।
- प्रोजेक्ट के प्रावधानित होने तक प्रतीक्षा करें और फिर जारी रखें पर क्लिक करें।
आप जो एप्लिकेशन बनाएंगे वह वेब ऐप्स के लिए उपलब्ध कुछ फायरबेस उत्पादों का उपयोग करता है:
- अपने उपयोगकर्ताओं को आसानी से पहचानने के लिए फायरबेस प्रमाणीकरण
- क्लाउड में संरचित डेटा को सहेजने और डेटा अपडेट होने पर तुरंत सूचना प्राप्त करने के लिए फायरबेस रीयलटाइम डेटाबेस
- क्लाउड में छवियों को सहेजने के लिए फायरबेस के लिए क्लाउड स्टोरेज
अब आप फ़ायरबेस कंसोल का उपयोग करके उन फ़ायरबेस उत्पादों को सक्षम और कॉन्फ़िगर करेंगे।
ईमेल लॉगिन सक्षम करें
हालाँकि प्रमाणीकरण इस कोडलैब का फोकस नहीं है, लेकिन इसका उपयोग करने वाले प्रत्येक व्यक्ति की विशिष्ट पहचान करने के लिए आपके ऐप में किसी प्रकार का प्रमाणीकरण होना महत्वपूर्ण है। आप ईमेल लॉगिन का उपयोग करेंगे.
- फायरबेस कंसोल में, बाएं पैनल में डेवलप पर क्लिक करें।
- प्रमाणीकरण पर क्लिक करें, और फिर साइन-इन विधि टैब पर क्लिक करें (या सीधे साइन-इन विधि टैब पर जाने के लिए यहां क्लिक करें )।
- साइन-इन प्रदाताओं की सूची में ईमेल/पासवर्ड पर क्लिक करें, सक्षम स्विच को चालू स्थिति पर सेट करें और फिर सहेजें पर क्लिक करें।
रीयलटाइम डेटाबेस सक्षम करें
ऐप बिक्री के लिए आइटम सहेजने के लिए फायरबेस रीयलटाइम डेटाबेस का उपयोग करता है।
- फायरबेस कंसोल के बाएं पैनल में डेवलप अनुभाग में, डेटाबेस पर क्लिक करें।
- क्लाउड फायरस्टोर फलक के बाद पृष्ठ को नीचे स्क्रॉल करें, और रीयलटाइम डेटाबेस फलक में डेटाबेस बनाएं पर क्लिक करें।
- लॉक मोड में प्रारंभ करें का चयन करें और फिर सक्षम करें पर क्लिक करें।
सुरक्षा नियम निर्धारित करें
अब, आप इस ऐप के लिए आवश्यक सुरक्षा नियम निर्धारित करेंगे। आपके ऐप को सुरक्षित रखने में मदद के लिए ये कुछ बुनियादी उदाहरण नियम हैं। ये नियम किसी को भी बिक्री के लिए आइटम देखने की अनुमति देते हैं, लेकिन ये नियम केवल साइन-इन किए गए उपयोगकर्ताओं को अन्य पढ़ने और लिखने की अनुमति देते हैं। इन नियमों की विशिष्टताओं के बारे में चिंता न करें; आप बस अपने ऐप को चालू करने और चलाने के लिए उन्हें कॉपी और पेस्ट करने जा रहे हैं।
- रीयलटाइम डेटाबेस डैशबोर्ड के शीर्ष पर, नियम टैब पर क्लिक करें।
- निम्नलिखित नियम सेट को नियम टैब में नियम फ़ील्ड में कॉपी और पेस्ट करें:
{
"rules": {
".read": false,
".write": false,
"drafts": {
".indexOn": "seller",
".read": "auth.uid !== null",
".write": "auth.uid !== null"
},
"sellers": {
".read": "auth.uid !== null",
".write": "auth.uid !== null"
},
"forsale": {
".read": true,
".write": "auth.uid !== null"
}
}
}
- प्रकाशित करें पर क्लिक करें.
क्लाउड स्टोरेज सक्षम करें
ऐप बिक्री के लिए वस्तुओं की छवियों को सहेजने के लिए फायरबेस के लिए क्लाउड स्टोरेज का उपयोग करता है।
- फायरबेस कंसोल के बाएं पैनल में डेवलप अनुभाग में, स्टोरेज पर क्लिक करें।
- आरंभ करें पर क्लिक करें.
- अपनी डिफ़ॉल्ट स्टोरेज बकेट बनाने के लिए डिफ़ॉल्ट स्वीकार करें ( अगला पर क्लिक करें, डिफ़ॉल्ट स्थान रखें और संपन्न पर क्लिक करें)।
अब, आप इस ऐप के लिए आवश्यक सुरक्षा नियम निर्धारित करेंगे। ये नियम केवल प्रमाणित उपयोगकर्ताओं को नई छवियां पोस्ट करने की अनुमति देते हैं, लेकिन वे किसी को भी सूचीबद्ध आइटम के लिए छवि देखने की अनुमति देते हैं।
- स्टोरेज डैशबोर्ड के शीर्ष पर, नियम टैब पर क्लिक करें।
- निम्नलिखित नियम सेट को नियम टैब में नियम फ़ील्ड में कॉपी और पेस्ट करें:
rules_version = '2';
service firebase.storage {
match /b/{bucket}/o {
match /{allPaths=**} {
allow read, write: if request.auth != null;
}
match /friendlymarket/{ImageId} {
allow read;
allow write: if request.auth != null;
}
}
}
- प्रकाशित करें पर क्लिक करें.
3. नमूना ऐप चलाएँ
स्टैकब्लिट्ज़ प्रोजेक्ट को फोर्क करें
इस कोडलैब में, आप StackBlitz का उपयोग करके एक ऐप बनाते और तैनात करते हैं, जो एक ऑनलाइन संपादक है जिसमें कई फायरबेस वर्कफ़्लो एकीकृत हैं। स्टैकब्लिट्ज़ को किसी सॉफ़्टवेयर इंस्टॉलेशन या विशेष स्टैकब्लिट्ज़ खाते की आवश्यकता नहीं है।
StackBlitz आपको दूसरों के साथ प्रोजेक्ट साझा करने देता है। अन्य लोग जिनके पास आपका StackBlitz प्रोजेक्ट URL है, वे आपका कोड देख सकते हैं और आपके प्रोजेक्ट को फोर्क कर सकते हैं, लेकिन वे आपके StackBlitz प्रोजेक्ट को संपादित नहीं कर सकते हैं।
- आरंभिक कोड के लिए इस URL पर जाएँ: https://stackblitz.com/edit/friendlymarket-codelab ।
- StackBlitz पृष्ठ के शीर्ष पर, Fork पर क्लिक करें।
अब आपके पास अपने StackBlitz प्रोजेक्ट के रूप में शुरुआती कोड की एक प्रति है। क्योंकि आपने साइन इन नहीं किया है, आपके "खाते" को @anonymous कहा जाता है, लेकिन यह ठीक है। प्रोजेक्ट का एक अद्वितीय नाम और एक अद्वितीय URL है। आपकी सभी फ़ाइलें और परिवर्तन इस StackBlitz प्रोजेक्ट में सहेजे गए हैं।
प्रोजेक्ट में फ़ायरबेस वेब ऐप जोड़ें
- StackBlitz में, अपनी
src/firebase-config.jsफ़ाइल देखें। यह वह जगह है जहां आप फायरबेस कॉन्फ़िगरेशन ऑब्जेक्ट जोड़ेंगे। - फ़ायरबेस कंसोल में वापस, ऊपर बाईं ओर प्रोजेक्ट अवलोकन पर क्लिक करके अपने प्रोजेक्ट के अवलोकन पृष्ठ पर जाएँ।
- अपने प्रोजेक्ट के अवलोकन पृष्ठ के मध्य में, वेब आइकन पर क्लिक करें
एक नया फायरबेस वेब ऐप बनाने के लिए। 
- ऐप को FriendlyMarket Codelab उपनाम से पंजीकृत करें।
- इस कोडलैब के लिए, इस ऐप के लिए फायरबेस होस्टिंग भी सेट करें के आगे वाले बॉक्स को चेक न करें । आप इसके बजाय StackBlitz पूर्वावलोकन फलक का उपयोग करने जा रहे हैं।
- ऐप रजिस्टर करें पर क्लिक करें.
- अपने ऐप के फायरबेस कॉन्फ़िगरेशन ऑब्जेक्ट को अपने क्लिपबोर्ड पर कॉपी करें।
<script>टैग कॉपी न करें. नोट: यदि आपको बाद में कॉन्फ़िगरेशन ढूंढने की आवश्यकता है, तो यहां दिए गए निर्देशों का पालन करें।
- कंसोल करने के लिए जारी रखें पर क्लिक करें।
अपने प्रोजेक्ट का कॉन्फ़िगरेशन अपने ऐप में जोड़ें:
- StackBlitz में वापस,
src/firebase-config.jsफ़ाइल पर जाएँ। - फ़ाइल में अपना कॉन्फ़िगरेशन स्निपेट चिपकाएँ। आपके ऐसा करने के बाद, इसे इस तरह दिखना चाहिए (लेकिन कॉन्फ़िगरेशन ऑब्जेक्ट में आपके अपने प्रोजेक्ट के मानों के साथ):
इस ऐप का शुरुआती बिंदु क्या है?
स्टैकब्लिट्ज़ स्क्रीन के दाईं ओर इंटरैक्टिव पूर्वावलोकन पर एक नज़र डालें:
यह कोडलैब आपको एक बुनियादी मार्केटप्लेस ऐप के कोड से शुरू करता है। कोई भी उपयोगकर्ता बिक्री के लिए वस्तुओं की सूची देख सकता है और किसी आइटम का विवरण पृष्ठ देखने के लिए लिंक पर क्लिक कर सकता है। यदि कोई उपयोगकर्ता साइन इन है, तो उन्हें विक्रेता की संपर्क जानकारी दिखाई देगी ताकि वे कीमत पर बातचीत कर सकें और आइटम खरीद सकें।
ऐप आज़माएं:
- होम स्क्रीन के शीर्ष पर स्थित बटन से साइन इन करें। आप नकली ईमेल पता, नाम और पासवर्ड का उपयोग कर सकते हैं।
- सूची बनाने के लिए निचले दाएं कोने में कुछ बेचें बटन पर क्लिक करें।
- शीर्षक के लिए,
Xylophoneदर्ज करें । - मूल्य पूछने के लिए,
50दर्ज करें । - आइटम विवरण के लिए, निम्नलिखित दर्ज करें:
This high quality xylophone can be used to play music. - ज़ाइलोफोन की इस छवि को अपने कंप्यूटर पर डाउनलोड करें, और इसे अपने आइटम बटन के चित्र के साथ अपलोड करें।
- सभी फ़ील्ड भरने और एक छवि अपलोड करने के बाद, पोस्ट पर क्लिक करें।
- अपनी नई सूची ढूंढें. अपने आइटम की विवरण स्क्रीन देखने के लिए उस पर क्लिक करें और फिर विक्रेता संपर्क जानकारी पैनल का विस्तार करें।
- फायरबेस कंसोल पर वापस जाएं। डेटाबेस डैशबोर्ड में, अब आपको
forsaleनोड के अंतर्गत आपके द्वारा पोस्ट किए गए आइटम के लिए एक प्रविष्टि दिखाई देगी। स्टोरेज डैशबोर्ड में, आपको वह छवि भी मिलेगी जिसे आपनेfriendlymarketपथ में अपलोड किया था।
4. एक एक्सटेंशन ढूंढें और इंस्टॉल करें
समस्या
अपने ऐप के लिए कुछ उपयोगकर्ता शोध करने के बाद, आपको पता चला कि अधिकांश उपयोगकर्ता आपकी साइट पर अपने डेस्कटॉप से नहीं, बल्कि अपने स्मार्टफोन से आते हैं। हालाँकि, आपके आँकड़े यह भी दर्शाते हैं कि मोबाइल उपयोगकर्ता कुछ ही सेकंड के बाद आपकी साइट ("मंथन") छोड़ देते हैं।
जिज्ञासु, आप मोबाइल कनेक्शन गति के साथ अपनी साइट का परीक्षण करें। ( यहां जानें कि ऐसा कैसे करें।) आप पाते हैं कि छवियों को लोड होने में बहुत लंबा समय लगता है और वे ब्राउज़र में बिल्कुल भी कैश नहीं होती हैं। प्रत्येक पृष्ठ दृश्य पर इतना लंबा लोड समय लगता है!
समाधान
छवियों को अनुकूलित करने के तरीके के बारे में पढ़ने के बाद, आप छवि लोडिंग प्रदर्शन को बेहतर बनाने के लिए दो कदम उठाने का निर्णय लेते हैं:
- छवियों को संपीड़ित करें. यहां तक कि मोबाइल फ़ोन भी इस ऐप की ज़रूरतों के लिए आवश्यक से कहीं अधिक उच्च रिज़ॉल्यूशन वाली छवियां लेते हैं। फ़ाइल का आकार कम करने से ऐप में रिज़ॉल्यूशन में उल्लेखनीय गिरावट के बिना लोड समय में तेजी आएगी।
- कैशिंग । डिफ़ॉल्ट रूप से, क्लाउड स्टोरेज ऑब्जेक्ट में हेडर होते हैं जो ब्राउज़र को छवियों को कैश न करने के लिए कहते हैं, जिसका अर्थ है कि उपयोगकर्ता का ब्राउज़र एक ही छवि को बार-बार डाउनलोड करेगा! सौभाग्य से, आप कैशिंग की अनुमति देने के लिए इन हेडर को बदल सकते हैं। क्लाइंट-साइड क्लाउड स्टोरेज एसडीके और फायरबेस एडमिन एसडीके दोनों आपको इन हेडर को सेट करने की अनुमति देते हैं।
छवियों को संपीड़ित करने के लिए, आपको या तो अपलोड गुणवत्ता को सीमित करना होगा या सर्वर-साइड प्रक्रिया की आवश्यकता होगी जो छवियों का आकार बदलती है। आइए ट्रेडऑफ़ पर विचार करें:
- ग्राहक की ओर । क्लाइंट-साइड प्रक्रिया के लिए, आप अपलोड की गई छवियों के लिए फ़ाइल आकार को सीमित कर सकते हैं। इसका मतलब यह है कि आपको कोई नया सर्वर लॉजिक लिखने या बनाए रखने की आवश्यकता नहीं है। हालाँकि, इसका मतलब यह भी है कि आपके विक्रेताओं को यह पता लगाना होगा कि अपनी छवियों का आकार कैसे बदला जाए, जो एक नई सूची बनाने में एक दर्दनाक और अकल्पनीय बाधा है।
- सर्वर साइड । यदि आप फायरबेस के लिए क्लाउड फ़ंक्शंस का उपयोग करते हैं, तो आप एक फ़ंक्शन को ट्रिगर कर सकते हैं जो अपलोड पर स्वचालित रूप से एक छवि का आकार बदल देता है। इसका मतलब यह है कि विक्रेता अपनी पसंद के किसी भी आकार की छवि अपलोड कर सकते हैं (उनके लिए कोई अतिरिक्त काम नहीं), और आपका बैकएंड फ़ंक्शन छवि का आकार आसानी से बदल सकता है। इस फ़ंक्शन के लिए एक नमूना भी उपलब्ध है!
ऐसा लगता है कि सर्वर-साइड ही रास्ता है। लेकिन इस विचार में अभी भी नमूने की क्लोनिंग करना, उसके सेटअप निर्देशों का पालन करना और फिर फायरबेस सीएलआई के साथ फ़ंक्शन को तैनात करना शामिल है। छवियों का आकार बदलना एक सामान्य उपयोग का मामला लगता है। क्या कोई आसान उपाय नहीं है?
एक आसान उपाय
तुम्हारी किस्मत अच्छी है। एक आसान समाधान है: फायरबेस एक्सटेंशन! आइए फायरबेस वेबसाइट पर उपलब्ध एक्सटेंशन की सूची देखें।
उस ओर देखो! "छवियों का आकार बदलें" नामक एक एक्सटेंशन है। यह आशाजनक लग रहा है.
आइए इस एक्सटेंशन का उपयोग अपने ऐप में करें!
एक एक्सटेंशन इंस्टॉल करें
- इस एक्सटेंशन के बारे में अधिक जानकारी देखने के लिए विवरण देखें पर क्लिक करें। आप क्या कॉन्फ़िगर कर सकते हैं के अंतर्गत, एक्सटेंशन आपको उन आयामों को सेट करने देता है जिनका आप आकार बदलना चाहते हैं, और आप कैश हेडर भी सेट कर सकते हैं। उत्तम!
- एक्सटेंशन के विवरण पृष्ठ पर इंस्टॉल इन कंसोल बटन पर क्लिक करें। आपको फायरबेस कंसोल पेज पर ले जाया जाएगा जिसमें आपके सभी प्रोजेक्ट सूचीबद्ध होंगे।
- इस कोडलैब के लिए आपके द्वारा बनाया गया फ्रेंडलीमार्केट प्रोजेक्ट चुनें।
- जब तक आप कॉन्फिगर एक्सटेंशन चरण तक नहीं पहुंच जाते, तब तक ऑन-स्क्रीन निर्देशों का पालन करें। निर्देश एक्सटेंशन का एक बुनियादी सारांश दिखाएंगे, साथ ही इसके द्वारा बनाए जाने वाले किसी भी संसाधन और उसके लिए आवश्यक भूमिकाओं तक पहुंच भी दिखाई जाएगी।
- आकार बदलने वाली छवियों के लिए **
Cache-Control**हेडर फ़ील्ड में, निम्नलिखित दर्ज करें:
public, max-age=31536000
- अन्य पैरामीटरों को उनके डिफ़ॉल्ट मानों पर छोड़ दें।
- एक्सटेंशन इंस्टॉल करें पर क्लिक करें.
जब आप इंस्टालेशन पूरा होने की प्रतीक्षा कर रहे हों...
फायरबेस कमांड-लाइन इंटरफ़ेस के साथ इंस्टॉल करना
यदि आप कमांड-लाइन टूल के साथ अधिक सहज हैं, तो फायरबेस सीएलआई का उपयोग करके भी एक्सटेंशन इंस्टॉल और प्रबंधित किए जा सकते हैं! बस सीएलआई के नवीनतम संस्करण में उपलब्ध firebase ext कमांड का उपयोग करें। अधिक जानकारी यहां पाई जा सकती है ।
(वैकल्पिक) कैश-कंट्रोल हेडर के बारे में और जानें
कैश-कंट्रोल हेडर मान public, max-age=31536000 अर्थ है कि छवि 1 वर्ष तक कैश्ड रहेगी। कैश-कंट्रोल हेडर के बारे में अधिक जानने के लिए, इस दस्तावेज़ को देखें।
क्लाइंट कोड अपडेट करें
आपके द्वारा इंस्टॉल किया गया एक्सटेंशन एक बदली हुई छवि को मूल छवि के समान बकेट में लिखता है। आकार बदलने वाली छवि में इसके फ़ाइल नाम के साथ कॉन्फ़िगर किए गए आयाम जुड़े हुए हैं। इसलिए, यदि मूल फ़ाइल पथ friendlymarket/user1234-car.png जैसा दिखता है, तो संशोधित छवि का फ़ाइल पथ friendlymarket/user1234-car_200x200.png जैसा दिखेगा।
आइए ऐप को अपडेट करें ताकि यह पूर्ण आकार की छवियों के बजाय संशोधित छवियों को प्राप्त कर सके।
- StackBlitz में,
src/firebase-refs.jsफ़ाइल खोलें। - परिवर्तित छवि के लिए रेफरी बनाने के लिए मौजूदा
getImageRefफ़ंक्शन को निम्नलिखित कोड से बदलें:
export function getImageRef(storage, imagePath) {
const xDimension = 200;
const yDimension = 200;
// find the '.' in 'file.jpg', 'file.png', etc
const fileExtensionIndex = imagePath.lastIndexOf('.');
const pathNameWithoutExtension = imagePath.substring(0, fileExtensionIndex);
const dimensions = `${xDimension}x${yDimension}`;
const fileExtension = imagePath.substring(fileExtensionIndex);
return {
resized: storage().ref(
`${pathNameWithoutExtension}_${dimensions}${fileExtension}`
),
original: storage().ref(imagePath)
};
}
इसका परीक्षण करें
चूँकि यह एक्सटेंशन नई छवि अपलोड पर नज़र रखता है, इसलिए आपकी मौजूदा छवि का आकार नहीं बदला जाएगा।
एक्सटेंशन को क्रियाशील देखने के लिए एक नई पोस्ट बनाएं:
- होम स्क्रीन पर नेविगेट करने के लिए अपने ऐप के शीर्ष बार में फ्रेंडली मार्केट पर क्लिक करें।
- लिस्टिंग बनाने के लिए ऐप के निचले दाएं कोने में कुछ बेचें बटन पर क्लिक करें।
- शीर्षक के लिए,
Coffeeदर्ज करें - मूल्य पूछने के लिए,
1दर्ज करें - आइटम विवरण के लिए, निम्नलिखित दर्ज करें:
Selling one cafe latte. It has foam art in the shape of a bear। - एक कप कॉफ़ी की इस छवि को अपने कंप्यूटर पर डाउनलोड करें, और इसे अपने आइटम बटन के चित्र के साथ अपलोड करें।
- सभी फ़ील्ड भरने और एक छवि अपलोड करने के बाद, पोस्ट पर क्लिक करें। आप जाइलोफोन के नीचे कॉफी सूची देखेंगे!
- फ़ायरबेस कंसोल में फ़ंक्शंस डैशबोर्ड में, लॉग्स टैब पर क्लिक करें। आपको फ़ंक्शन के लॉग देखने चाहिए जो दर्शाते हैं कि इसे निष्पादित किया गया है।
-
friendlymarketपथ में मूल कॉफी छवि और संशोधित संस्करण दोनों को देखने के लिए स्टोरेज डैशबोर्ड पर जाएं। - स्टैकब्लिट्ज़ पूर्वावलोकन फलक में, अपने ऐप की होम स्क्रीन को कुछ बार पुनः लोड करें। आपको कॉफी छवि को जाइलोफोन छवि की तुलना में काफी तेजी से लोड होते हुए देखना चाहिए।
छवि पहले पेज लोड पर तेजी से लोड होती है क्योंकि यह छोटी होती है, और बाद के पेज रीफ्रेश पर यह नेटवर्क अनुरोध को ट्रिगर करने के बजाय ब्राउज़र कैश से लोड होती है।
5. किसी एक्सटेंशन को पुन: कॉन्फ़िगर करें
समस्या
आपका ऐप विक्रेता की सूची के ड्राफ्ट संस्करणों को स्वतः सहेजता है। आपके उपयोगकर्ताओं को यह सुविधा पसंद है, लेकिन आपके आँकड़े थोड़े चिंताजनक हैं। आपकी रिपोर्ट कहती है कि केवल लगभग 10% ड्राफ्ट ही वास्तव में पोस्ट किए गए हैं, और अन्य 90% आपके डेटाबेस में जगह ले रहे हैं।
समाधान
लिफ़ाफ़े के पीछे की कुछ गणनाओं के बाद, आपको एहसास होता है कि आपको किसी भी समय केवल लगभग पाँच ड्राफ्ट सहेजने की आवश्यकता है।
क्या आपको फायरबेस एक्सटेंशन का वह कैटलॉग याद है? हो सकता है कि इस स्थिति के लिए पहले से ही कोई समाधान तैयार किया गया हो। आइए सहेजे गए ड्राफ्ट की संख्या को स्वचालित रूप से पांच या उससे कम रखने के लिए लिमिट चाइल्ड नोड्स एक्सटेंशन इंस्टॉल करें। जब भी कोई नया ड्राफ्ट जोड़ा जाएगा तो एक्सटेंशन सबसे पुराने ड्राफ्ट को हटा देगा।
- एक्सटेंशन के विवरण पृष्ठ पर इंस्टॉल बटन पर क्लिक करें।
- वह फायरबेस प्रोजेक्ट चुनें जिसका उपयोग आप अपने मार्केटप्लेस वेब ऐप के लिए कर रहे हैं।
- जब तक आप कॉन्फिगर एक्सटेंशन चरण तक नहीं पहुंच जाते, तब तक ऑन-स्क्रीन निर्देशों का पालन करें।
- रीयलटाइम डेटाबेस पथ के लिए,
draftsदर्ज करें। यह डेटाबेस में वह पथ है जहां ड्राफ्ट सहेजे जाते हैं। - नोड्स की अधिकतम संख्या रखने के लिए,
5दर्ज करें। इसका मतलब यह है कि प्रत्येक आइटम की सूची के लिए पांच ड्राफ्ट सहेजे जाएंगे, और यदि कोई अन्य जोड़ा जाता है, तो सबसे पुराना ड्राफ्ट स्वचालित रूप से हटा दिया जाएगा। - एक्सटेंशन इंस्टॉल करें पर क्लिक करें.
जब आप इंस्टालेशन पूरा होने की प्रतीक्षा कर रहे हों...
मॉनिटरिंग एक्सटेंशन
जब आप कोई एक्सटेंशन इंस्टॉल करते हैं, तो प्रक्रिया कई फ़ंक्शन बनाती है। आप यह जांचना चाह सकते हैं कि ये फ़ंक्शन कितनी बार चल रहे हैं या लॉग और त्रुटि दर देखना चाहते हैं। अपने एक्सटेंशन की निगरानी करने के तरीके के बारे में विस्तृत जानकारी के लिए, इंस्टॉल किए गए एक्सटेंशन प्रबंधित करें देखें। पिछले चरण में रिसाइज़ इमेज एक्सटेंशन द्वारा बनाए गए फ़ंक्शन को देखने के लिए दस्तावेज़ में दिए गए निर्देशों का पालन करें।
एक्सटेंशन अनइंस्टॉल करना
अपने प्रोजेक्ट से किसी एक्सटेंशन को हटाने के लिए, आपको एक्सटेंशन द्वारा बनाए गए व्यक्तिगत फ़ंक्शंस को हटाने का प्रलोभन हो सकता है, लेकिन इससे अप्रत्याशित व्यवहार हो सकता है, क्योंकि एक एक्सटेंशन कई फ़ंक्शंस बना सकता है। दस्तावेज़ में किसी एक्सटेंशन को अनइंस्टॉल करने का तरीका जानें।
अनइंस्टॉल करने से सभी संसाधन (जैसे एक्सटेंशन के लिए फ़ंक्शन) और एक्सटेंशन के उस उदाहरण के लिए बनाया गया सेवा खाता नष्ट हो जाता है। हालाँकि, एक्सटेंशन द्वारा बनाई गई कोई भी कलाकृतियाँ (जैसे कि बदली हुई छवियां) एक्सटेंशन को अनइंस्टॉल करने के बाद भी आपके प्रोजेक्ट में बनी रहेंगी।
एक ही प्रोजेक्ट में एक एक्सटेंशन की एकाधिक प्रतियां स्थापित करना
आप किसी प्रोजेक्ट में दिए गए एक्सटेंशन का एक उदाहरण स्थापित करने तक ही सीमित नहीं हैं। यदि आप किसी अन्य पथ में प्रविष्टियों को सीमित करना चाहते हैं, तो आप इस एक्सटेंशन का एक और उदाहरण स्थापित कर सकते हैं। हालाँकि, इस कोडलैब के प्रयोजनों के लिए, आप एक्सटेंशन को केवल एक बार इंस्टॉल करेंगे।
इसे क्रियान्वित करके देखें
- सुनिश्चित करें कि आप उसी खाते से लॉग इन हैं जिसका उपयोग आपने जाइलोफोन या लैटे पोस्ट करने के लिए किया था
- कुछ ड्राफ्ट जनरेट करें:
- ऐप के निचले दाएं कोने में कुछ बेचें बटन पर क्लिक करें
- "ड्राफ्ट 1" कहने के लिए शीर्षक संपादित करें।
- ड्राफ्ट अनुभाग तक नीचे स्क्रॉल करें और ड्राफ्ट की संख्या देखें। कम से कम दो तो होने ही चाहिए.
- शीर्ष ऐप बार में फ्रेंडली मार्केट बटन पर क्लिक करें। इस तरह, आपके पास एक सहेजा हुआ ड्राफ्ट होगा लेकिन इसे पोस्ट करने की आवश्यकता नहीं है।
- "ड्राफ्ट 2", "ड्राफ्ट 3" और इसी तरह "ड्राफ्ट 6" के लिए दोहराएँ।
- जब आप "ड्राफ्ट 6" बनाते हैं, तो ध्यान दें कि "ड्राफ्ट 1 आपके ड्राफ्ट अनुभाग से गायब हो जाता है।
- जैसा कि आपने इमेज का आकार बदलें एक्सटेंशन के साथ किया था, आप यह देखने के लिए फ़ंक्शन लॉग की जांच कर सकते हैं कि कौन से फ़ंक्शन ट्रिगर हुए।
उफ़, ड्राफ्ट रखने की सीमा बहुत छोटी है
आपकी ग्राहक सहायता टीम आपसे संपर्क करती है और आपको बताती है कि आपके कुछ सबसे बड़े विक्रेता शिकायत कर रहे हैं कि उनके ड्राफ्ट पोस्ट करने से पहले ही हटा दिए जा रहे हैं। आप अपने साथी के साथ अपना गणित जांचते हैं, और आपको पता चलता है कि आपका गणित 10,000 गुना कम था!
आप इसे कैसे ठीक कर सकते हैं? आइए स्थापित एक्सटेंशन को पुन: कॉन्फ़िगर करें!
- फायरबेस कंसोल के बाएँ फलक में, एक्सटेंशन पर क्लिक करें।
- इंस्टॉल किए गए एक्सटेंशन के कार्ड पर, प्रबंधित करें पर क्लिक करें।
- ऊपरी-दाएँ कोने में, एक्सटेंशन पुन: कॉन्फ़िगर करें पर क्लिक करें।
- नोड्स की अधिकतम संख्या को बदलकर
50000रखें। - सहेजें पर क्लिक करें.
और आपको बस इतना ही करना है! एक्सटेंशन को अपडेट होने में जितना समय लगेगा, आप अपनी सहायता टीम से बात कर सकते हैं और उन्हें बता सकते हैं कि एक समाधान पहले से ही तैनात किया जा रहा है।
6. उपयोगकर्ता डेटा को स्वचालित रूप से हटाएं
समस्या
आपकी ग्राहक सहायता टीम ने आपसे दोबारा संपर्क किया है. जिन विक्रेताओं ने अपने खाते हटा दिए हैं उन्हें अभी भी अन्य उपयोगकर्ताओं से ईमेल मिल रहे हैं, और वे नाराज़ हैं! इन विक्रेताओं को उम्मीद थी कि जब वे अपने खाते हटाएंगे तो उनके ईमेल पते आपके सिस्टम से हटा दिए जाएंगे।
अभी के लिए, समर्थन प्रत्येक उपयोगकर्ता के डेटा को मैन्युअल रूप से हटा रहा है, लेकिन एक बेहतर तरीका होना चाहिए! आप इसके बारे में सोचते हैं, और आप अपना स्वयं का बैच कार्य लिखने पर विचार करते हैं जो समय-समय पर चलता है और हटाए गए खातों से ईमेल पते साफ़ करता है। लेकिन उपयोगकर्ता डेटा हटाना एक बहुत ही सामान्य समस्या लगती है। शायद फायरबेस एक्सटेंशन भी इस समस्या को हल करने में मदद कर सकते हैं।
समाधान
जब कोई उपयोगकर्ता अपना खाता हटाता है तो आप डेटाबेस में users/uid नोड को स्वचालित रूप से हटाने के लिए उपयोगकर्ता डेटा हटाएं एक्सटेंशन को कॉन्फ़िगर करेंगे।
- एक्सटेंशन के विवरण पृष्ठ पर इंस्टॉल बटन पर क्लिक करें।
- वह फायरबेस प्रोजेक्ट चुनें जिसका उपयोग आप अपने मार्केटप्लेस वेब ऐप के लिए कर रहे हैं।
- जब तक आप कॉन्फिगर एक्सटेंशन चरण तक नहीं पहुंच जाते, तब तक ऑन-स्क्रीन निर्देशों का पालन करें।
- रीयलटाइम डेटाबेस पथों के लिए,
sellers/{UID}दर्ज करें।sellersभाग वह नोड है जिसके बच्चों में उपयोगकर्ता ईमेल पते होते हैं, और{UID}एक वाइल्डकार्ड है। इस कॉन्फ़िगरेशन के साथ, एक्सटेंशन को पता चल जाएगा कि जब 1234 के यूआईडी वाला उपयोगकर्ता अपना खाता हटाता है, तो एक्सटेंशन को डेटाबेस सेsellers/1234हटा देना चाहिए। - एक्सटेंशन इंस्टॉल करें पर क्लिक करें.
जब आप इंस्टालेशन पूरा होने की प्रतीक्षा कर रहे हों...
चलिए अनुकूलन क्षमता के बारे में बात करते हैं
इस कोडलैब में, आपने देखा है कि फायरबेस एक्सटेंशन सामान्य उपयोग के मामलों को हल करने में मदद कर सकते हैं और एक्सटेंशन आपके ऐप की आवश्यकताओं को पूरा करने के लिए कॉन्फ़िगर करने योग्य हैं।
हालाँकि, एक्सटेंशन हर समस्या का समाधान नहीं कर सकते हैं और उपयोगकर्ता डेटा हटाने का मुद्दा इसका एक अच्छा उदाहरण है। हालाँकि उपयोगकर्ता डेटा हटाएँ एक्सटेंशन वर्तमान शिकायत को संबोधित करता है कि उपयोगकर्ता द्वारा अपना खाता हटाने के बाद भी ईमेल उजागर होते हैं, एक्सटेंशन सब कुछ नहीं हटाएगा। उदाहरण के लिए, आइटम सूची अभी भी उपलब्ध है, और क्लाउड स्टोरेज में कोई भी छवि आसपास भी चिपकी रहेगी। उपयोगकर्ता डेटा हटाएं एक्सटेंशन हमें हटाने के लिए क्लाउड स्टोरेज पथ को कॉन्फ़िगर करने की अनुमति देता है, लेकिन चूंकि उपयोगकर्ता कई अलग-अलग नामों के साथ कई अलग-अलग फ़ाइलें अपलोड कर सकते हैं, इसलिए आप इन कलाकृतियों को स्वचालित रूप से हटाने के लिए इस एक्सटेंशन को कॉन्फ़िगर नहीं कर पाएंगे। इस तरह की स्थितियों के लिए, फायरबेस के लिए क्लाउड फ़ंक्शंस बेहतर फिट हो सकता है ताकि आप वह कोड लिख सकें जो आपके ऐप के डेटा मॉडल के लिए विशिष्ट है।
एक्सटेंशन और बिलिंग
फ़ायरबेस एक्सटेंशन स्वयं उपयोग करने के लिए कोई लागत नहीं है (आपसे केवल आपके द्वारा उपयोग किए जाने वाले अंतर्निहित संसाधनों के लिए शुल्क लिया जाता है), लेकिन एक्सटेंशन के लिए आवश्यक कुछ अंतर्निहित संसाधनों के लिए बिलिंग की आवश्यकता हो सकती है। इस कोडलैब को बिलिंग खाते के बिना पूरा करने के लिए डिज़ाइन किया गया था। हालाँकि, फ्लेम या ब्लेज़ योजना स्थापित करने से बहुत सारे दिलचस्प फायरबेस एक्सटेंशन अनलॉक हो जाते हैं।
उदाहरण के लिए, आप URL को छोटा कर सकते हैं, ईमेल ट्रिगर कर सकते हैं , संग्रह को BigQuery में निर्यात कर सकते हैं , और भी बहुत कुछ कर सकते हैं! एक्सटेंशन की पूरी सूची यहां देखें।
यदि कोई एक्सटेंशन है जिसे आप रखना चाहते हैं, लेकिन वह अभी उपलब्ध नहीं है, तो हमें इसके बारे में सुनना अच्छा लगेगा! नए एक्सटेंशन का सुझाव देने के लिए फायरबेस सपोर्ट के साथ एक फीचर अनुरोध दर्ज करें।
इसे क्रियान्वित करके देखें
आपके एक्सटेंशन की स्थापना पूर्ण होने के बाद, एक उपयोगकर्ता को हटा दें और देखें कि क्या होता है:
- फायरबेस कंसोल में, अपने रीयलटाइम डेटाबेस डैशबोर्ड पर जाएं।
-
sellersनोड का विस्तार करें. - प्रत्येक विक्रेता की जानकारी उनके उपयोगकर्ता यूआईडी पर अंकित होती है। उपयोगकर्ता का UID चुनें.
- फायरबेस कंसोल में, अपने प्रमाणीकरण डैशबोर्ड पर जाएं, और उस उपयोगकर्ता यूआईडी को ढूंढें।
- यूआईडी के दाईं ओर मेनू का विस्तार करें, और खाता हटाएं चुनें।
- अपने रीयलटाइम डेटाबेस डैशबोर्ड पर वापस जाएं। विक्रेता की जानकारी ख़त्म हो जाएगी!
7. बधाई हो!
भले ही आपने इस कोडलैब में अधिक कोड नहीं लिखा, लेकिन आपने अपने मार्केटप्लेस ऐप में महत्वपूर्ण सुविधाएँ जोड़ीं।
आपने सीखा कि एक्सटेंशन कैसे खोजें, कॉन्फ़िगर करें, इंस्टॉल करें और पुन: कॉन्फ़िगर करें। इसके अलावा, आपने सीखा कि इंस्टॉल किए गए एक्सटेंशन की निगरानी कैसे करें और यदि आवश्यक हो तो उन्हें अनइंस्टॉल कैसे करें।
आगे क्या होगा?
इनमें से कुछ अन्य एक्सटेंशन देखें:
- क्लाउड फायरस्टोर में टेक्स्ट स्ट्रिंग्स का अनुवाद करें (बिलिंग खाता आवश्यक)
- Mailchimp ईमेल सूचियों में नए उपयोगकर्ता जोड़ें (बिलिंग खाता आवश्यक)
- यूआरएल छोटे करें (बिलिंग खाता आवश्यक)
अधिक कस्टम सर्वर-साइड कोड की आवश्यकता है?
अन्य उपयोगी दस्तावेज़
एक्सटेंशन प्रबंधित करना:
- फायरबेस सीएलआई के साथ एक्सटेंशन प्रबंधित करने का प्रयास करें
- बजट अलर्ट सेट करें
- जांचें कि इंस्टॉल किया गया एक्सटेंशन कितनी बार चल रहा है
- किसी इंस्टॉल किए गए एक्सटेंशन को नए संस्करण में अपडेट करें
- एक एक्सटेंशन अनइंस्टॉल करें
एक्सटेंशन के बारे में बारीकियां सीखना:
- GitHub पर प्रत्येक एक्सटेंशन के लिए स्रोत कोड और दस्तावेज़ देखें
- किसी एक्सटेंशन को दी गई अनुमतियों और पहुंच के बारे में जानें