क्लाउड से मैसेज और क्लाउड फ़ंक्शन का इस्तेमाल करके किसी वेब ऐप्लिकेशन के लिए सूचनाएं भेजें

1. खास जानकारी

इस कोडलैब में, आपको चैट ऐप्लिकेशन के उपयोगकर्ताओं को सूचनाएं भेजकर, चैट के वेब ऐप्लिकेशन में फ़ंक्शन जोड़ने के लिए, 'Firebase के लिए Cloud Functions' इस्तेमाल करने का तरीका बताया जाएगा.

आपको क्या सीखने को मिलेगा

• Firebase SDK टूल का इस्तेमाल करके, Google Cloud Functions बनाएं.
• पुष्टि करने की सुविधा, Cloud Storage, और Cloud Firestore इवेंट के आधार पर Cloud Functions ट्रिगर करना.
• अपने वेब ऐप्लिकेशन में Firebase Cloud Messaging की सहायता जोड़ें.

आपको इन चीज़ों की ज़रूरत होगी

• क्रेडिट कार्ड. Firebase के लिए Cloud Functions का इस्तेमाल करने के लिए, Firebase का Blaze प्लान ज़रूरी है. इसका मतलब है कि आपको क्रेडिट कार्ड का इस्तेमाल करके, अपने Firebase प्रोजेक्ट पर बिलिंग की सुविधा चालू करनी होगी.
• आपकी पसंद का IDE/टेक्स्ट एडिटर, जैसे कि WebStore, Atom या Sublime.
• शेल कमांड चलाने के लिए एक टर्मिनल. इसमें NodeJS v9 इंस्टॉल किया गया है.
• Chrome जैसा कोई ब्राउज़र.
• सैंपल कोड. इसके लिए, अगला चरण देखें.

2. सैंपल कोड पाएं

कमांड लाइन से GitHub डेटा स्टोर करने की जगह को क्लोन करें:

git clone https://github.com/firebase/friendlychat

स्टार्टर ऐप्लिकेशन इंपोर्ट करें

अपने आईडीई का इस्तेमाल करके, सैंपल कोड डायरेक्ट्री से cloud-functions-start डायरेक्ट्री खोलें या इंपोर्ट करें. इस डायरेक्ट्री में, कोडलैब का शुरुआती कोड मौजूद है. इसमें Chat का वेब ऐप्लिकेशन पूरी तरह से काम करता है.

3. Firebase प्रोजेक्ट बनाना और अपना ऐप्लिकेशन सेट अप करना

प्रोजेक्ट बनाना

Firebase कंसोल में, प्रोजेक्ट जोड़ें पर क्लिक करें और इसे FriendlyChat नाम दें.

प्रोजेक्ट बनाएं पर क्लिक करें.

Blaze प्लान पर अपग्रेड करना

'Firebase के लिए Cloud Functions' और 'Firebase के लिए Cloud Storage' का इस्तेमाल करने के लिए, आपका Firebase प्रोजेक्ट 'इस्तेमाल के हिसाब से पैसे चुकाएं' (ब्लेज़) वाले प्राइसिंग प्लान पर होना चाहिए. इसका मतलब है कि आपका Firebase प्रोजेक्ट, किसी क्लाउड बिलिंग खाते से जुड़ा होना चाहिए.

• Cloud Billing खाते के लिए, क्रेडिट कार्ड जैसा पेमेंट का कोई तरीका होना ज़रूरी है.
• अगर आपने Firebase और Google Cloud का इस्तेमाल पहले कभी नहीं किया है, तो देखें कि क्या आपको 300 डॉलर का क्रेडिट और मुफ़्त में आज़माने के लिए Cloud Billing खाता मिल सकता है.
• अगर आपने किसी इवेंट के तहत यह कोडलैब किया है, तो इवेंट के आयोजक से पूछें कि क्या कोई Cloud क्रेडिट उपलब्ध है.

अगर आपके पास क्रेडिट कार्ड का ऐक्सेस नहीं है या Blaze प्राइसिंग प्लान को जारी रखने में परेशानी होती है, तो Firebase Emulator Suite का इस्तेमाल करें. इसकी मदद से, अपनी स्थानीय मशीन पर Cloud Functions को मुफ़्त में एम्युलेट किया जा सकेगा.

सभी Firebase प्रोजेक्ट के पास अब भी Cloud Functions के इस्तेमाल के कोटा का ऐक्सेस है. इन प्रोजेक्ट में Blaze प्राइसिंग प्लान शामिल है. इस कोडलैब में बताया गया तरीका, मुफ़्त टीयर के इस्तेमाल की सीमाओं के अंदर होगा. हालांकि, आपको Cloud Storage से कुछ शुल्क (करीब $0.03) दिखेंगे. इसका इस्तेमाल आपके Cloud Functions की मदद से इमेज बनाने के लिए किया जाता है.

अपने प्रोजेक्ट को Blaze प्लान में अपग्रेड करने के लिए, यह तरीका अपनाएं:

1. Firebase कंसोल में, अपना प्लान अपग्रेड करें को चुनें.
2. ब्लेज़ प्लान चुनें. अपने प्रोजेक्ट से क्लाउड बिलिंग खाता लिंक करने के लिए, स्क्रीन पर दिए गए निर्देशों का पालन करें.
   अगर आपको इस अपग्रेड के तहत क्लाउड बिलिंग खाता बनाना था, तो अपग्रेड पूरा करने के लिए आपको Firebase कंसोल में अपग्रेड फ़्लो पर वापस जाना पड़ सकता है.

Google पुष्टि चालू करें

उपयोगकर्ताओं को ऐप्लिकेशन में साइन-इन करने की अनुमति देने के लिए, हम Google की अनुमति का इस्तेमाल करेंगे. इसे चालू करना ज़रूरी है.

Firebase Console में, बिल्ड सेक्शन > पुष्टि करें > साइन इन करने का तरीका टैब खोलें या इस सेक्शन पर जाने के लिए यहां क्लिक करें. इसके बाद, Google साइन इन की सेवा देने वाली कंपनी चालू करें और सेव करें पर क्लिक करें. इससे उपयोगकर्ता अपने Google खातों से वेब ऐप्लिकेशन में साइन इन कर सकेंगे.

इसके अलावा, अपने ऐप्लिकेशन का सार्वजनिक नाम Friendly Chat पर सेट करें:

Firebase के लिए Cloud Storage सेट अप करना

यह ऐप्लिकेशन, फ़ोटो अपलोड करने के लिए Cloud Storage का इस्तेमाल करता है.

अपने Firebase प्रोजेक्ट में, Firebase के लिए Cloud Storage सेट अप करने का तरीका यहां बताया गया है:

1. Firebase कंसोल के बाएं पैनल में, बिल्ड को बड़ा करें. इसके बाद, स्टोरेज चुनें.
2. शुरू करें पर क्लिक करें.
3. अपनी डिफ़ॉल्ट स्टोरेज बकेट के लिए कोई जगह चुनें.
   US-WEST1, US-CENTRAL1, और US-EAST1 में मौजूद बकेट, Google Cloud Storage के लिए "हमेशा मुफ़्त" टीयर का फ़ायदा ले सकती हैं. अन्य सभी जगहों की बकेट के लिए, Google Cloud Storage की कीमत और इस्तेमाल लागू होता है.
4. टेस्ट मोड में चालू करें पर क्लिक करें. सुरक्षा के नियमों के बारे में डिसक्लेमर पढ़ें.
   अपनी स्टोरेज बकेट के लिए सुरक्षा नियम जोड़े बिना, किसी ऐप्लिकेशन को सार्वजनिक तौर पर डिस्ट्रिब्यूट या सार्वजनिक किए बिना शेयर न करें.
5. बनाएं पर क्लिक करें.

कोई वेब ऐप्लिकेशन जोड़ें

Firebase कंसोल पर, वेब ऐप्लिकेशन जोड़ें. इसके लिए, प्रोजेक्ट सेटिंग पर जाएं और नीचे की ओर स्क्रोल करके ऐप्लिकेशन जोड़ें पर जाएं. प्लैटफ़ॉर्म के तौर पर वेब चुनें और Firebase होस्टिंग सेट अप करने के लिए बॉक्स पर सही का निशान लगाएं. इसके बाद, ऐप्लिकेशन रजिस्टर करें और बाकी चरण पूरे करने के लिए आगे बढ़ें पर क्लिक करें. आखिर में, कंसोल पर जारी रखें पर क्लिक करें.

4. Firebase कमांड लाइन इंटरफ़ेस इंस्टॉल करें

Firebase कमांड लाइन इंटरफ़ेस (सीएलआई) की मदद से, वेब ऐप्लिकेशन को स्थानीय तौर पर इस्तेमाल किया जा सकता है. साथ ही, अपने वेब ऐप्लिकेशन और Cloud Functions को डिप्लॉय किया जा सकता है.

सीएलआई को इंस्टॉल या अपग्रेड करने के लिए, npm का यह निर्देश चलाएं:

npm -g install firebase-tools

यह पुष्टि करने के लिए कि सीएलआई सही तरीके से इंस्टॉल किया गया है, कोई कंसोल खोलें और यह कमांड चलाएं:

firebase --version

पक्का करें कि Firebase सीएलआई का वर्शन 4.0.0 से बाद का है, ताकि इसमें Cloud Functions के लिए ज़रूरी सभी नई सुविधाएं शामिल हों. अगर ऐसा नहीं है, तो ऊपर बताए गए तरीके से अपग्रेड करने के लिए, npm install -g firebase-tools को चलाएं.

Firebase CLI को अनुमति देने के लिए, यह कमांड चलाएं:

firebase login

पक्का करें कि आप cloud-functions-start डायरेक्ट्री में हैं. इसके बाद, अपने Firebase प्रोजेक्ट का इस्तेमाल करने के लिए, Firebase सीएलआई सेट अप करें:

firebase use --add

इसके बाद, अपना प्रोजेक्ट आईडी चुनें और निर्देशों का पालन करें. जब कहा जाए, तब codelab जैसा कोई भी दूसरा नाम चुना जा सकता है.

5. वेब ऐप्लिकेशन को डिप्लॉय और चलाना

प्रोजेक्ट इंपोर्ट और कॉन्फ़िगर करने के बाद, अब वेब ऐप्लिकेशन को पहली बार चलाया जा सकता है! टर्मिनल विंडो खोलें, cloud-functions-start फ़ोल्डर पर जाएं, और इनका इस्तेमाल करके Firebase होस्टिंग पर वेब ऐप्लिकेशन को डिप्लॉय करें:

firebase deploy --except functions

आपको यह कंसोल आउटपुट दिखेगा:

i deploying database, storage, hosting
✔  database: rules ready to deploy.
i  storage: checking rules for compilation errors...
✔  storage: rules file compiled successfully
i  hosting: preparing ./ directory for upload...
✔  hosting: ./ folder uploaded successfully
✔ storage: rules file compiled successfully
✔ hosting: 8 files uploaded successfully
i starting release process (may take several minutes)...

✔ Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview
Hosting URL: https://friendlychat-1234.firebaseapp.com

वेब ऐप्लिकेशन खोलना

आखिरी लाइन में होस्टिंग यूआरएल दिखना चाहिए. अब वेब ऐप्लिकेशन इस यूआरएल से दिखाया जाना चाहिए, जो https://<project-id>.firebaseapp.com फ़ॉर्मैट में होना चाहिए. इसे खोलें. आपको चैट ऐप्लिकेशन का यूज़र इंटरफ़ेस दिखेगा.

Google से साइन इन करें बटन का इस्तेमाल करके ऐप्लिकेशन में साइन इन करें. साथ ही, बेझिझक कुछ मैसेज जोड़ें और इमेज पोस्ट करें:

अगर किसी नए ब्राउज़र पर ऐप्लिकेशन में पहली बार साइन इन किया जा रहा है, तो सूचनाएं पाने की अनुमति दें:

हमें बाद में सूचनाएं पाने की सुविधा चालू करनी होगी.

अगर आपने गलती से ब्लॉक करें पर क्लिक कर दिया है, तो इस सेटिंग को बदला जा सकता है. इसके लिए, Chrome के ओमनीबार में यूआरएल की बाईं ओर मौजूद 🔒 सुरक्षित करें बटन पर क्लिक करें. इसके बाद, सूचनाएं के बगल में मौजूद बार को टॉगल करें:

अब हम Cloud Functions के लिए Firebase SDK टूल का इस्तेमाल करके, कुछ फ़ंक्शन जोड़ेंगे.

6. फ़ंक्शन डायरेक्ट्री

Cloud Functions, आपको सर्वर सेट अप किए बिना क्लाउड में चलने वाला कोड रखने की सुविधा देता है. हम ऐसे फ़ंक्शन बनाने का तरीका बताएंगे जो Firebase Auth, Cloud Storage, और Firebase Firestore डेटाबेस इवेंट पर प्रतिक्रिया देते हैं. चलिए, पुष्टि करने से शुरुआत करते हैं.

Cloud Functions के लिए Firebase SDK टूल का इस्तेमाल करने पर, आपके फ़ंक्शन कोड (डिफ़ॉल्ट रूप से) functions डायरेक्ट्री में लाइव रहेंगे. आपका फ़ंक्शन कोड एक Node.js ऐप्लिकेशन भी है. इसलिए, इसे package.json की ज़रूरत होती है, जो आपके ऐप्लिकेशन के बारे में कुछ जानकारी देता हो और डिपेंडेंसी की सूची बनाता हो.

आपके लिए इस काम को आसान बनाने के लिए, हमने पहले ही functions/index.js फ़ाइल बना दी है जहां आपका कोड डाला जाएगा. आगे बढ़ने से पहले बेझिझक इस फ़ाइल की जांच करें.

cd functions
ls

अगर आपको Node.js के बारे में जानकारी नहीं है, तो कोडलैब जारी रखने से पहले इसके बारे में ज़्यादा जानें.

package.json फ़ाइल में, पहले से ही दो ज़रूरी डिपेंडेंसी मौजूद हैं: Cloud Functions के लिए Firebase SDK टूल और Firebase Admin SDK टूल. उन्हें स्थानीय रूप से इंस्टॉल करने के लिए, functions फ़ोल्डर में जाएं और चलाएं:

npm install

अब index.js फ़ाइल पर एक नज़र डालते हैं:

index.js

/**
 * Copyright 2017 Google Inc. All Rights Reserved.
 * ...
 */

// TODO(DEVELOPER): Import the Cloud Functions for Firebase and the Firebase Admin modules here.

// TODO(DEVELOPER): Write the addWelcomeMessage Function here.

// TODO(DEVELOPER): Write the blurImages Function here.

// TODO(DEVELOPER): Write the sendNotification Function here.

हम ज़रूरी मॉड्यूल इंपोर्ट करेंगे. इसके बाद, TODOs की जगह तीन फ़ंक्शन लिखेंगे. चलिए, ज़रूरी नोड मॉड्यूल को इंपोर्ट करने से शुरू करते हैं.

7. Cloud Functions और Firebase एडमिन मॉड्यूल इंपोर्ट करना

इस कोडलैब के दौरान दो मॉड्यूल की ज़रूरत होगी: firebase-functions, Cloud Functions के ट्रिगर और लॉग लिखने की सुविधा देता है. वहीं, firebase-admin, एडमिन ऐक्सेस वाले सर्वर पर Firebase प्लैटफ़ॉर्म का इस्तेमाल करने की सुविधा देता है. इससे, Cloud Firestore में डेटा लिखने या FCM सूचनाएं भेजने जैसी कार्रवाइयां की जा सकती हैं.

index.js फ़ाइल में, पहले TODO को इनके साथ बदलें:

index.js

/**
 * Copyright 2017 Google Inc. All Rights Reserved.
 * ...
 */

// Import the Firebase SDK for Google Cloud Functions.
const functions = require('firebase-functions');
// Import and initialize the Firebase Admin SDK.
const admin = require('firebase-admin');
admin.initializeApp();

// TODO(DEVELOPER): Write the addWelcomeMessage Function here.

// TODO(DEVELOPER): Write the blurImages Function here.

// TODO(DEVELOPER): Write the sendNotification Function here.

Cloud Functions एनवायरमेंट या दूसरे Google Cloud Platform कंटेनर में डिप्लॉय किए जाने पर, Firebase एडमिन SDK टूल अपने-आप कॉन्फ़िगर हो सकता है. ऐसा तब होता है, जब हम बिना किसी तर्क के admin.initializeApp() को कॉल करते हैं.

आइए, अब एक ऐसा फ़ंक्शन जोड़ते हैं जो किसी उपयोगकर्ता के चैट ऐप्लिकेशन में पहली बार साइन इन करने पर चलता है. इसके बाद, हम उपयोगकर्ता का स्वागत करने के लिए चैट मैसेज जोड़ेंगे.

8. नए उपयोगकर्ताओं का स्वागत करें

चैट मैसेज का स्ट्रक्चर

FriendlyChat के चैट फ़ीड में पोस्ट किए गए मैसेज, Cloud Firestore में सेव किए जाते हैं. आइए, मैसेज के लिए इस्तेमाल किए जाने वाले डेटा स्ट्रक्चर पर नज़र डालते हैं. इसके लिए, चैट में "नमस्ते दुनिया" लिखकर नया मैसेज पोस्ट करें:

यह इस तरह दिखना चाहिए:

Firebase कंसोल में, बिल्ड सेक्शन में जाकर Firestore डेटाबेस पर क्लिक करें. आपको मैसेज का कलेक्शन और एक दस्तावेज़ दिखेगा, जिसमें आपका लिखा मैसेज होगा:

जैसा कि आपको दिख रहा है, चैट मैसेज को Cloud Firestore में दस्तावेज़ के तौर पर सेव किया जाता है. इन मैसेज के messages कलेक्शन में name, profilePicUrl, text, और timestamp एट्रिब्यूट जोड़े जाते हैं.

वेलकम मैसेज जोड़ना

पहला क्लाउड फ़ंक्शन, चैट में नए उपयोगकर्ताओं का स्वागत करने वाला मैसेज जोड़ता है. इसके लिए, हम ट्रिगर functions.auth().onCreate का इस्तेमाल कर सकते हैं. यह ट्रिगर, हर बार Firebase ऐप्लिकेशन में पहली बार साइन-इन करने पर फ़ंक्शन को चलाता है. अपनी index.js फ़ाइल में addWelcomeMessages फ़ंक्शन जोड़ें:

index.js

// Adds a message that welcomes new users into the chat.
exports.addWelcomeMessages = functions.auth.user().onCreate(async (user) => {
  functions.logger.log('A new user signed in for the first time.');
  const fullName = user.displayName || 'Anonymous';

  // Saves the new welcome message into the database
  // which then displays it in the FriendlyChat clients.
  await admin.firestore().collection('messages').add({
    name: 'Firebase Bot',
    profilePicUrl: '/images/firebase-logo.png', // Firebase logo
    text: `${fullName} signed in for the first time! Welcome!`,
    timestamp: admin.firestore.FieldValue.serverTimestamp(),
  });
  functions.logger.log('Welcome message written to database.');
});

इस फ़ंक्शन को खास exports ऑब्जेक्ट में जोड़ने से, फ़ंक्शन को मौजूदा फ़ाइल के बाहर ऐक्सेस करने में मदद मिलती है और यह Cloud Functions के लिए ज़रूरी है.

ऊपर दिए गए फ़ंक्शन में, हम चैट मैसेज की सूची में "Firebase Bot" के ज़रिए पोस्ट किया गया एक नया वेलकम मैसेज जोड़ रहे हैं. हम Cloud Firestore में messages कलेक्शन पर add तरीके का इस्तेमाल करके ऐसा कर रहे हैं. इस कलेक्शन में चैट के मैसेज सेव किए जाते हैं.

यह एक असाइनोक्रोनस ऑपरेशन है. इसलिए, हमें Promise दिखाना होगा, ताकि यह पता चल सके कि Cloud Firestore में डेटा लिखने की प्रोसेस कब पूरी हुई. इससे Cloud Functions जल्दी से जल्दी लागू नहीं होंगे.

Cloud फ़ंक्शन डिप्लॉय करें

Cloud Functions को डिप्लॉय करने के बाद ही वे चालू होंगे. ऐसा करने के लिए, कमांड लाइन पर यह चलाएं:

firebase deploy --only functions

आपको यह कंसोल आउटपुट दिखेगा:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
⚠  functions: missing necessary APIs. Enabling now...
i  env: ensuring necessary APIs are enabled...
⚠  env: missing necessary APIs. Enabling now...
i  functions: waiting for APIs to activate...
i  env: waiting for APIs to activate...
✔  env: all necessary APIs are enabled
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: creating function addWelcomeMessages...
✔  functions[addWelcomeMessages]: Successful create operation. 
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlypchat-1234/overview

फ़ंक्शन की जांच करना

फ़ंक्शन के डिप्लॉय हो जाने के बाद, आपको कोई ऐसा उपयोगकर्ता चाहिए जो पहली बार साइन इन करे.

1. होस्ट करने वाले यूआरएल (https://<project-id>.firebaseapp.com के रूप में) का इस्तेमाल करके, अपने ऐप्लिकेशन को ब्राउज़र में खोलें.
2. किसी नए उपयोगकर्ता के तौर पर, साइन इन करें बटन का इस्तेमाल करके, अपने ऐप्लिकेशन में पहली बार साइन इन करें.

• अगर आपने ऐप्लिकेशन में पहले ही साइन इन कर लिया है, तो Firebase कंसोल की पुष्टि करने की सुविधा खोलें और उपयोगकर्ताओं की सूची से अपना खाता मिटाएं. इसके बाद, फिर से साइन इन करें.

3. साइन इन करने के बाद, आपको वेलकम मैसेज अपने-आप दिखेगा:

9. इमेज मॉडरेशन

उपयोगकर्ता, चैट में सभी तरह की इमेज अपलोड कर सकते हैं. इसके लिए, आपत्तिजनक इमेज को मॉडरेट करना ज़रूरी है. खास तौर पर, सार्वजनिक सोशल मीडिया प्लैटफ़ॉर्म पर ऐसा करना बेहद ज़रूरी है. FriendlyChat में, चैट में पब्लिश की जा रही इमेज को Cloud Storage बकेट में सेव किया जाता है.

Cloud Functions की मदद से, functions.storage().onFinalize ट्रिगर का इस्तेमाल करके, नई इमेज अपलोड होने का पता लगाया जा सकता है. यह हर बार तब चलेगा, जब Cloud Storage में कोई नई फ़ाइल अपलोड की जाएगी या किसी मौजूदा फ़ाइल में बदलाव किया जाएगा.

इमेज को मॉडरेट करने के लिए, हम यह तरीका अपनाएंगे:

1. Cloud Vision API का इस्तेमाल करके देखें कि इमेज को 'वयस्क या हिंसक' के तौर पर फ़्लैग किया गया है या नहीं.
2. अगर इमेज को फ़्लैग किया गया है, तो उसे मौजूदा Functions इंस्टेंस पर डाउनलोड करें.
3. ImageMagick का इस्तेमाल करके, इमेज को धुंधला करें.
4. धुंधली की गई इमेज को Cloud Storage में अपलोड करें.

Cloud Vision API चालू करना

इस फ़ंक्शन में, हम Google Cloud Vision API का इस्तेमाल करेंगे. इसलिए, आपको अपने Firebase प्रोजेक्ट में एपीआई को चालू करना होगा. इस लिंक पर जाएं. इसके बाद, अपना Firebase प्रोजेक्ट चुनें और एपीआई चालू करें:

डिपेंडेंसी इंस्टॉल करना

इमेज को मॉडरेट करने के लिए, हम Node.js के लिए Google Cloud Vision क्लाइंट लाइब्रेरी का इस्तेमाल करेंगे, ताकि @google-cloud/vision गलत इमेज का पता लगाने के लिए Cloud Vision API के ज़रिए इमेज चलाए जा सके.

इस पैकेज को अपने Cloud Functions ऐप्लिकेशन में इंस्टॉल करने के लिए, यह npm install --save कमांड चलाएं. पक्का करें कि ऐसा functions डायरेक्ट्री से किया जा रहा हो.

npm install --save @google-cloud/vision@2.4.0

इससे पैकेज, स्थानीय तौर पर इंस्टॉल हो जाएगा और उसे आपकी package.json फ़ाइल में, डिक्लेयर्ड डिपेंडेंसी के तौर पर जोड़ दिया जाएगा.

डिपेंडेंसी इंपोर्ट और कॉन्फ़िगर करना

इंस्टॉल की गई डिपेंडेंसी और कुछ Node.js कोर मॉड्यूल (path, os, और fs) को इंपोर्ट करने के लिए, जिनकी हमें इस सेक्शन में ज़रूरत पड़ेगी, अपनी index.js फ़ाइल के ऊपर ये लाइनें जोड़ें:

index.js

const Vision = require('@google-cloud/vision');
const vision = new Vision.ImageAnnotatorClient();
const {promisify} = require('util');
const exec = promisify(require('child_process').exec);

const path = require('path');
const os = require('os');
const fs = require('fs');

आपका फ़ंक्शन, Google Cloud के एनवायरमेंट में चलेगा. इसलिए, Cloud Storage और Cloud Vision लाइब्रेरी को कॉन्फ़िगर करने की ज़रूरत नहीं है: ये आपके प्रोजेक्ट का इस्तेमाल करने के लिए अपने-आप कॉन्फ़िगर हो जाएंगी.

आपत्तिजनक इमेज का पता लगाना

आपको functions.storage.onChange Cloud Functions ट्रिगर का इस्तेमाल करना होगा. यह Cloud Storage बकेट में किसी फ़ाइल या फ़ोल्डर के बनाए जाने या उसमें बदलाव किए जाने पर, आपका कोड रन करता है. अपनी index.js फ़ाइल में blurOffensiveImages फ़ंक्शन जोड़ें:

index.js

// Checks if uploaded images are flagged as Adult or Violence and if so blurs them.
exports.blurOffensiveImages = functions.runWith({memory: '2GB'}).storage.object().onFinalize(
    async (object) => {
      const imageUri = `gs://${object.bucket}/${object.name}`;
      // Check the image content using the Cloud Vision API.
      const batchAnnotateImagesResponse = await vision.safeSearchDetection(imageUri);
      const safeSearchResult = batchAnnotateImagesResponse[0].safeSearchAnnotation;
      const Likelihood = Vision.protos.google.cloud.vision.v1.Likelihood;
      if (Likelihood[safeSearchResult.adult] >= Likelihood.LIKELY ||
          Likelihood[safeSearchResult.violence] >= Likelihood.LIKELY) {
        functions.logger.log('The image', object.name, 'has been detected as inappropriate.');
        return blurImage(object.name);
      }
      functions.logger.log('The image', object.name, 'has been detected as OK.');
    });

ध्यान दें कि हमने उस Cloud Functions इंस्टेंस का कुछ कॉन्फ़िगरेशन जोड़ा है जो फ़ंक्शन को चलाएगा. .runWith({memory: '2GB'}) के साथ हम अनुरोध करते हैं कि इंस्टेंस को डिफ़ॉल्ट के बजाय 2 जीबी की मेमोरी मिले, क्योंकि इस फ़ंक्शन में ज़्यादा मेमोरी इस्तेमाल की जाती है.

फ़ंक्शन ट्रिगर होने पर, इमेज को Cloud Vision API की मदद से यह पता लगाने के लिए चलाया जाता है कि उसे वयस्कों के लिए या हिंसा दिखाने वाली इमेज के तौर पर फ़्लैग किया गया है या नहीं. अगर इन शर्तों के आधार पर इमेज को आपत्तिजनक माना जाता है, तो हम इमेज को धुंधला कर देते हैं. ऐसा blurImage फ़ंक्शन की मदद से किया जाता है. इसके बारे में हम आगे जानेंगे.

इमेज को धुंधला करना

अपनी index.js फ़ाइल में यह blurImage फ़ंक्शन जोड़ें:

index.js

// Blurs the given image located in the given bucket using ImageMagick.
async function blurImage(filePath) {
  const tempLocalFile = path.join(os.tmpdir(), path.basename(filePath));
  const messageId = filePath.split(path.sep)[1];
  const bucket = admin.storage().bucket();

  // Download file from bucket.
  await bucket.file(filePath).download({destination: tempLocalFile});
  functions.logger.log('Image has been downloaded to', tempLocalFile);
  // Blur the image using ImageMagick.
  await exec(`convert "${tempLocalFile}" -channel RGBA -blur 0x24 "${tempLocalFile}"`);
  functions.logger.log('Image has been blurred');
  // Uploading the Blurred image back into the bucket.
  await bucket.upload(tempLocalFile, {destination: filePath});
  functions.logger.log('Blurred image has been uploaded to', filePath);
  // Deleting the local file to free up disk space.
  fs.unlinkSync(tempLocalFile);
  functions.logger.log('Deleted local file.');
  // Indicate that the message has been moderated.
  await admin.firestore().collection('messages').doc(messageId).update({moderated: true});
  functions.logger.log('Marked the image as moderated in the database.');
}

ऊपर दिए गए फ़ंक्शन में, इमेज बाइनरी को Cloud Storage से डाउनलोड किया जाता है. इसके बाद, इमेज को ImageMagick के convert टूल की मदद से धुंधला किया जाता है. साथ ही, धुंधला किए गए वर्शन को स्टोरेज बकेट पर फिर से अपलोड किया जाता है. इसके बाद, हम कुछ डिस्क स्टोरेज खाली करने के लिए, Cloud Functions इंस्टेंस पर मौजूद फ़ाइल मिटा देते हैं. हम ऐसा इसलिए करते हैं, क्योंकि उसी Cloud Functions को फिर से इस्तेमाल किया जा सकता है और अगर फ़ाइलें साफ़ नहीं की जाती हैं, तो डिस्क में जगह खत्म हो सकती है. आखिर में, हम चैट मैसेज में बूलियन जोड़कर बताते हैं कि इमेज को मॉडरेट किया गया था. इससे क्लाइंट के मैसेज पर रीफ़्रेश का असर दिखेगा.

फ़ंक्शन को डिप्लॉय करना

यह फ़ंक्शन, डिप्लॉय किए जाने के बाद ही चालू होगा. कमांड लाइन पर, firebase deploy --only functions चलाएं:

firebase deploy --only functions

आपको यह कंसोल आउटपुट दिखेगा:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: updating function addWelcomeMessages...
i  functions: creating function blurOffensiveImages...
✔  functions[addWelcomeMessages]: Successful update operation.
✔  functions[blurOffensiveImages]: Successful create operation.
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview

फ़ंक्शन की जांच करना

फ़ंक्शन के डिप्लॉय होने के बाद:

1. होस्ट करने वाले यूआरएल (https://<project-id>.firebaseapp.com के रूप में) का इस्तेमाल करके, अपने ऐप्लिकेशन को ब्राउज़र में खोलें.
2. ऐप्लिकेशन में साइन इन करने के बाद, एक इमेज अपलोड करें:
3. अपलोड करने के लिए अपनी सबसे अच्छी आपत्तिजनक इमेज चुनें (या आप इस मांस वाले ज़ॉम्बी का इस्तेमाल कर सकते हैं!) और कुछ देर बाद, आपको इमेज के धुंधले वर्शन के साथ अपनी पोस्ट रीफ़्रेश होगी:

10. नए मैसेज की सूचनाएं

इस सेक्शन में, आपको एक ऐसा Cloud फ़ंक्शन जोड़ना होगा जो नया मैसेज पोस्ट किए जाने पर, चैट में हिस्सा लेने वाले लोगों को सूचनाएं भेजता है.

Firebase क्लाउड से मैसेज (FCM) का इस्तेमाल करके, आप सभी प्लैटफ़ॉर्म पर उपयोगकर्ताओं को भरोसेमंद तरीके से सूचनाएं भेज सकते हैं. किसी उपयोगकर्ता को सूचना भेजने के लिए, आपके पास उसका FCM डिवाइस टोकन होना चाहिए. हम जिस चैट वेब ऐप्लिकेशन का इस्तेमाल कर रहे हैं वह पहले से ही उपयोगकर्ताओं से डिवाइस टोकन इकट्ठा करता है. ऐसा तब होता है, जब वे किसी नए ब्राउज़र या डिवाइस पर पहली बार ऐप्लिकेशन खोलते हैं. ये टोकन, Cloud Firestore में fcmTokens कलेक्शन में सेव किए जाते हैं.

अगर आपको वेब ऐप्लिकेशन पर FCM डिवाइस टोकन पाने का तरीका जानना है, तो Firebase वेब कोडलैब पर जाएं.

सूचनाएं भेजना

नए मैसेज पोस्ट होने का पता लगाने के लिए, आपको functions.firestore.document().onCreate Cloud Functions ट्रिगर का इस्तेमाल करना होगा. यह ट्रिगर, Cloud Firestore के किसी दिए गए पाथ पर नया ऑब्जेक्ट बनने पर आपका कोड चलाता है. अपनी index.js फ़ाइल में sendNotifications फ़ंक्शन जोड़ें:

index.js

// Sends a notifications to all users when a new message is posted.
exports.sendNotifications = functions.firestore.document('messages/{messageId}').onCreate(
  async (snapshot) => {
    // Notification details.
    const text = snapshot.data().text;
    const payload = {
      notification: {
        title: `${snapshot.data().name} posted ${text ? 'a message' : 'an image'}`,
        body: text ? (text.length <= 100 ? text : text.substring(0, 97) + '...') : '',
        icon: snapshot.data().profilePicUrl || '/images/profile_placeholder.png',
        click_action: `https://${process.env.GCLOUD_PROJECT}.firebaseapp.com`,
      }
    };

    // Get the list of device tokens.
    const allTokens = await admin.firestore().collection('fcmTokens').get();
    const tokens = [];
    allTokens.forEach((tokenDoc) => {
      tokens.push(tokenDoc.id);
    });

    if (tokens.length > 0) {
      // Send notifications to all tokens.
      const response = await admin.messaging().sendToDevice(tokens, payload);
      await cleanupTokens(response, tokens);
      functions.logger.log('Notifications have been sent and tokens cleaned up.');
    }
  });

ऊपर दिए गए फ़ंक्शन में, हम Cloud Firestore डेटाबेस से सभी उपयोगकर्ताओं के डिवाइस टोकन इकट्ठा कर रहे हैं और admin.messaging().sendToDevice फ़ंक्शन का इस्तेमाल करके इन सभी को सूचना भेज रहे हैं.

टोकन हटाने का तरीका

आखिर में, हम उन टोकन को हटाना चाहते हैं जो अब मान्य नहीं हैं. ऐसा तब होता है, जब हमें उपयोगकर्ता से एक बार मिला टोकन, ब्राउज़र या डिवाइस से इस्तेमाल नहीं हो पाता है. उदाहरण के लिए, ऐसा तब होता है, जब उपयोगकर्ता ने ब्राउज़र सेशन के लिए सूचना की अनुमति रद्द कर दी हो. ऐसा करने के लिए, अपनी index.js फ़ाइल में यह cleanupTokens फ़ंक्शन जोड़ें:

index.js

// Cleans up the tokens that are no longer valid.
function cleanupTokens(response, tokens) {
 // For each notification we check if there was an error.
 const tokensDelete = [];
 response.results.forEach((result, index) => {
   const error = result.error;
   if (error) {
     functions.logger.error('Failure sending notification to', tokens[index], error);
     // Cleanup the tokens that are not registered anymore.
     if (error.code === 'messaging/invalid-registration-token' ||
         error.code === 'messaging/registration-token-not-registered') {
       const deleteTask = admin.firestore().collection('fcmTokens').doc(tokens[index]).delete();
       tokensDelete.push(deleteTask);
     }
   }
 });
 return Promise.all(tokensDelete);
}

फ़ंक्शन को डिप्लॉय करना

यह फ़ंक्शन सिर्फ़ तब ही ऐक्टिव होगा, जब आपने उसे डिप्लॉय किया होगा. इसके बाद, डिप्लॉय करने के लिए, इसे कमांड लाइन में चलाएं:

firebase deploy --only functions

आपको यह कंसोल आउटपुट दिखेगा:

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (X.XX KB) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: updating function addWelcomeMessages...
i  functions: updating function blurOffensiveImages...
i  functions: creating function sendNotifications...
✔  functions[addWelcomeMessages]: Successful update operation.
✔  functions[blurOffensiveImages]: Successful updating operation.
✔  functions[sendNotifications]: Successful create operation.
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/friendlychat-1234/overview

फ़ंक्शन की जांच करना

1. फ़ंक्शन के डिप्लॉय होने के बाद, होस्टिंग यूआरएल (https://<project-id>.firebaseapp.com के तौर पर) का इस्तेमाल करके, अपने ब्राउज़र में ऐप्लिकेशन खोलें.
2. अगर आपने ऐप्लिकेशन में पहली बार साइन इन किया है, तो पक्का करें कि पूछे जाने पर आपने सूचनाएं भेजने की अनुमति दी हो:
3. चैट ऐप्लिकेशन टैब बंद करें या कोई दूसरा टैब दिखाएं: ऐप्लिकेशन के बैकग्राउंड में चलने पर ही सूचनाएं दिखती हैं. अगर आपको यह जानना है कि ऐप्लिकेशन फ़ोरग्राउंड में होने पर मैसेज कैसे मिलते हैं, तो हमारा दस्तावेज़ देखें.
4. किसी दूसरे ब्राउज़र (या गुप्त विंडो) का इस्तेमाल करके, ऐप्लिकेशन में साइन इन करें और कोई मैसेज पोस्ट करें. आपको पहले ब्राउज़र से एक सूचना दिखेगी:

11. बधाई हो!

आपने Cloud Functions के लिए Firebase SDK टूल का इस्तेमाल किया है और चैट ऐप्लिकेशन में सर्वर-साइड कॉम्पोनेंट जोड़े हैं.

हमने क्या-क्या शामिल किया है

• Cloud Functions के लिए Firebase SDK टूल का इस्तेमाल करके Cloud Functions तैयार करना.
• पुष्टि करने की सुविधा, Cloud Storage, और Cloud Firestore इवेंट के आधार पर Cloud Functions ट्रिगर करना.
• अपने वेब ऐप्लिकेशन में Firebase Cloud Messaging की सहायता जोड़ें.
• Firebase सीएलआई का इस्तेमाल करके Cloud Functions डिप्लॉय करें.

अगले चरण

• Cloud फ़ंक्शन के अन्य ट्रिगर टाइप के बारे में जानें.
• अपने ऐप्लिकेशन के साथ Firebase और Cloud Functions का इस्तेमाल करें.

ज़्यादा जानें

• firebase.google.com/docs/functions
• firebase.google.com