फायरबेस के लिए क्लाउड फ़ंक्शंस

इस कोडलैब में, आप सीखेंगे कि चैट वेब ऐप को बेहतर बनाने के लिए Google क्लाउड फ़ंक्शंस के लिए फायरबेस एसडीके का उपयोग कैसे करें और चैट ऐप के उपयोगकर्ताओं को सूचनाएं भेजने के लिए क्लाउड फ़ंक्शंस का उपयोग कैसे करें।

3b1284f5144b54f6.png

आप क्या सीखेंगे

  • फायरबेस एसडीके का उपयोग करके Google क्लाउड फ़ंक्शंस बनाएं।
  • ऑथ, क्लाउड स्टोरेज और क्लाउड फायरस्टोर इवेंट्स के आधार पर ट्रिगर क्लाउड फंक्शन।
  • अपने वेब ऐप में फायरबेस क्लाउड मैसेजिंग सपोर्ट जोड़ें।

आपको किस चीज़ की ज़रूरत पड़ेगी

  • एक क्रेडिट कार्ड। फायरबेस के लिए क्लाउड फंक्शंस के लिए फायरबेस ब्लेज़ प्लान की आवश्यकता होती है, जिसका अर्थ है कि आपको क्रेडिट कार्ड का उपयोग करके अपने फायरबेस प्रोजेक्ट पर बिलिंग सक्षम करनी होगी।
  • जैसे अपनी पसंद के आईडीई / पाठ संपादक WebStorm , एटम या उदात्त
  • NodeJS v8 के साथ शेल कमांड चलाने के लिए एक टर्मिनल स्थापित।
  • क्रोम जैसे ब्राउज़र।
  • नमूना कोड। इसके लिए अगला चरण देखें।

क्लोन GitHub भंडार कमांड लाइन से:

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

स्टार्टर ऐप आयात करें

अपने आईडीई का उपयोग करके, खोलें या आयात करें android_studio_folder.png cloud-functions-start नमूना कोड निर्देशिका से निर्देशिका। इस निर्देशिका में कोडलैब के लिए प्रारंभिक कोड है जिसमें पूरी तरह कार्यात्मक चैट वेब ऐप शामिल है।

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

में Firebase कंसोल पर क्लिक करें परियोजना जोड़ें और फोन यह FriendlyChat।

परियोजना बनाएँ क्लिक करें।

ब्लेज़ प्लान में अपग्रेड करें

आदेश में Firebase के लिए बादल कार्य का उपयोग करने में आप करने के लिए अपने Firebase परियोजना को अपग्रेड करना होगा ब्लेज़ बिलिंग योजना । इसके लिए आपको अपने Google क्लाउड खाते में एक क्रेडिट कार्ड या कोई अन्य बिलिंग साधन जोड़ना होगा।

सभी Firebase प्रोजेक्ट, जिनमें ब्लेज़ योजना शामिल है, के पास अभी भी क्लाउड फ़ंक्शंस के लिए निःशुल्क उपयोग कोटा तक पहुंच है। इस कोडलैब में बताए गए चरण फ्री टियर उपयोग सीमा के अंतर्गत आएंगे। लेकिन अगर आप (छोटे प्रभार देखेंगे $ 0.03 के बारे में जो आपके बादल कार्य निर्माण छवियों की मेजबानी के लिए प्रयोग किया जाता है क्लाउड मेमोरी से)।

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

Google प्रमाणीकरण सक्षम करें

उपयोगकर्ताओं को ऐप में साइन-इन करने देने के लिए हम Google प्रमाणन का उपयोग करेंगे जिसे सक्षम करने की आवश्यकता है।

Firebase कंसोल खोलने (या अनुभाग> प्रमाणीकरण> इन में विधि टैब का विकास यहां क्लिक करें वहाँ जाने के लिए) आप गूगल साइन-इन प्रदाता सक्षम और सहेजें क्लिक करें की जरूरत है। यह उपयोगकर्ताओं को अपने Google खातों के साथ वेब ऐप में साइन-इन करने की अनुमति देगा।

इसके अलावा अनुकूल चैट करने के लिए अपने अनुप्रयोग के सार्वजनिक संपर्क वाले नाम सेट करने के लिए स्वतंत्र महसूस:

8290061806aacb46.png

क्लाउड स्टोरेज सक्षम करें

ऐप तस्वीरें अपलोड करने के लिए क्लाउड स्टोरेज का उपयोग करता है। संग्रहण अनुभाग अपने Firebase परियोजना यात्रा के संबंध में क्लाउड संग्रहण सक्षम और प्रारंभ करें बटन पर क्लिक करें। फिर मिल गया यह क्लिक करने पर सुरक्षा नियमों के बारे में त्याग प्राप्त करते हैं।

842ad84821323ef5.png

फायरबेस कमांड लाइन इंटरफेस (सीएलआई) आपको स्थानीय रूप से वेब ऐप की सेवा करने और अपने वेब ऐप और क्लाउड फ़ंक्शंस को तैनात करने की अनुमति देगा।

CLI को स्थापित या अपग्रेड करने के लिए निम्नलिखित npm कमांड चलाएँ:

npm -g install firebase-tools

यह सत्यापित करने के लिए कि सीएलआई सही ढंग से स्थापित किया गया है, एक कंसोल खोलें और चलाएं:

firebase --version

सुनिश्चित करें कि Firebase CLI के संस्करण 4.0.0 से ऊपर है इतना है कि यह है सभी नवीनतम बादल कार्य के लिए आवश्यक सुविधा है। यदि नहीं, तो चलाने npm install -g firebase-tools के रूप में ऊपर दिखाए गए उन्नत करने के लिए।

फायरबेस सीएलआई को चलाकर अधिकृत करें:

firebase login

सुनिश्चित करें कि आप में हैं cloud-functions-start निर्देशिका फिर अपने Firebase परियोजना का उपयोग करने के Firebase CLI की स्थापना:

firebase use --add

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

अब जब आपने अपना प्रोजेक्ट आयात और कॉन्फ़िगर कर लिया है तो आप पहली बार वेब ऐप चलाने के लिए तैयार हैं। में एक कंसोल खोलें cloud-functions-start फ़ोल्डर और चलाने firebase deploy --except functions यह केवल 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 फॉर्म का होना चाहिए। खोलो इसे। आपको चैट ऐप का कार्यशील UI देखना चाहिए।

साइन-इन के साथ GOOGLE बटन का उपयोग करके साइन-इन अनुप्रयोग के लिए और कुछ संदेश और पोस्ट छवियों को जोड़ने के लिए स्वतंत्र लग रहा है:

3b1284f5144b54f6.png

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

हम चाहते हैं कि आप बाद में सूचनाओं को सक्षम करें।

अगर आप गलती से ब्लॉक क्लिक किया है, तो आप Chrome Omnibar में URL के लिए छोड़ दिया और सूचनाएं का चयन करने पर 🔒 सुरक्षित बटन पर क्लिक करके इस सेटिंग को परिवर्तित कर सकते हैं> इस साइट पर की अनुमति दें:

e926868b0546ed71.png

अब हम क्लाउड फ़ंक्शंस के लिए फायरबेस एसडीके का उपयोग करके कुछ कार्यक्षमता जोड़ेंगे।

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

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

यह आप के लिए आसान बनाने के लिए हम पहले से बनाए गए functions/index.js फ़ाइल जहाँ आपके कोड जाना होगा। आगे बढ़ने से पहले बेझिझक इस फाइल का निरीक्षण करें।

cd functions
ls

आप के साथ परिचित नहीं हैं Node.js यह codelab जारी रखने से पहले इसके बारे में अधिक जानने के लिए मदद मिलेगी।

: Package.json फ़ाइल पहले से ही दो आवश्यक निर्भरता को सूचीबद्ध बादल कार्य के लिए Firebase एसडीके और Firebase नियंत्रक SDK । स्थापित करने के लिए उन्हें स्थानीय स्तर पर चलाने के npm install से 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.

हम पहले आवश्यक मॉड्यूल आयात करेंगे और फिर TODO के स्थान पर तीन फ़ंक्शन लिखेंगे। पहले आवश्यक नोड मॉड्यूल आयात करते हैं।

दो मॉड्यूल इस codelab दौरान की आवश्यकता होगी, firebase-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();

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

चैट संदेश संरचना

फ्रेंडलीचैट चैट फीड पर पोस्ट किए गए मैसेज क्लाउड फायरस्टोर में स्टोर किए जाते हैं। आइए उस डेटा संरचना पर एक नज़र डालें जिसका उपयोग हम किसी संदेश के लिए करते हैं। ऐसा करने के लिए, चैट पर एक नया संदेश पोस्ट करें जिसमें लिखा हो "Hello World":

11f5a676fbb1a69a.png

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

fe6d1c020d0744cf.png

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

442c9c10b5e2b245.png

आप देख सकते हैं, चैट संदेशों के साथ एक दस्तावेज के रूप में बादल के firestore में जमा हो जाती name , profilePicUrl , text और timestamp विशेषताओं को जोड़ा गया messages संग्रह।

स्वागत संदेश जोड़ना

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

index.js

// Adds a message that welcomes new users into the chat.
exports.addWelcomeMessages = functions.auth.user().onCreate(async (user) => {
  console.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(),
  });
  console.log('Welcome message written to database.');
});

विशेष को यह समारोह जोड़ा जा रहा है exports वस्तु वर्तमान फ़ाइल का कार्य सुलभ बाहर बनाने की नोड का तरीका है और क्लाउड कार्य के लिए आवश्यक है।

उपरोक्त फ़ंक्शन में हम चैट संदेशों की सूची में "Firebase Bot" द्वारा पोस्ट किया गया एक नया स्वागत संदेश जोड़ रहे हैं। हम का उपयोग करके यह कर रहे हैं add पर विधि messages बादल Firestore में संग्रह है जो जहां चैट के संदेशों जमा हो जाती है।

चूंकि यह एक अतुल्यकालिक ऑपरेशन है, हम वापस जाने के लिए की जरूरत है वादा , जब बादल Firestore लिखने समाप्त हो गया है यह दर्शाता है ताकि कार्य निष्पादन बहुत जल्दी से बाहर नहीं।

समारोह तैनात करें

आपके द्वारा इसे परिनियोजित करने के बाद ही फ़ंक्शन सक्रिय होगा। कमांड लाइन चलाने पर firebase deploy --only 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 कंसोल प्रमाणीकरण अनुभाग और उपयोगकर्ताओं की सूची से अपना खाता हटा। फिर दोबारा साइन इन करें।

262535d1b1223c65.png

  1. आपके साइन इन करने के बाद, एक स्वागत संदेश अपने आप प्रदर्शित होना चाहिए:

1c70e0d64b23525b.png

उपयोगकर्ता चैट में सभी प्रकार की छवियों को अपलोड कर सकते हैं, और आपत्तिजनक छवियों को मॉडरेट करना हमेशा महत्वपूर्ण होता है, विशेष रूप से सार्वजनिक सामाजिक प्लेटफार्मों में। छवियों कि चैट करने के लिए प्रकाशित किए जा रहे FriendlyChat में में जमा हो जाती है Google क्लाउड संग्रहण

बादल कार्य के साथ, आप का उपयोग कर नए छवि अपलोड का पता लगा सकते functions.storage().onFinalize ट्रिगर। यह हर बार तब चलेगा जब कोई नई फ़ाइल क्लाउड स्टोरेज में अपलोड या संशोधित की जाएगी।

छवियों को मॉडरेट करने के लिए हम निम्नलिखित प्रक्रिया से गुजरेंगे:

  1. जाँच करें कि छवि या का उपयोग कर वयस्क के रूप में चिह्नित कर देने पर हिंसक बादल विजन एपीआई
  2. यदि छवि को फ़्लैग किया गया है, तो इसे चल रहे फ़ंक्शंस इंस्टेंस पर डाउनलोड करें
  3. का उपयोग कर छवि को धुंधला ImageMagick
  4. धुंधली छवि को क्लाउड स्टोरेज पर अपलोड करें

क्लाउड विज़न API सक्षम करें

चूंकि हम इस फ़ंक्शन में Google क्लाउड विज़न एपीआई का उपयोग करेंगे, इसलिए आपको अपने फायरबेस प्रोजेक्ट पर एपीआई को सक्षम करना होगा। का पालन करें इस लिंक , अपने Firebase परियोजना का चयन करें और API को सक्षम:

5c77fee51ec5de49.png

निर्भरता स्थापित करें

छवियों को मॉडरेट करने के लिए हमें कुछ Node.js पैकेजों की आवश्यकता होगी:

  • Node.js के लिए Google क्लाउड विजन क्लाइंट लाइब्रेरी: @ google-बादल / दृष्टि अनुचित चित्रों का पता लगाने के बादल विजन एपीआई के माध्यम से छवि को चलाने के लिए।
  • एक Node.js हमें प्रक्रियाओं को चलाने के लिए अनुमति देता है पुस्तकालय: बच्चे की प्रक्रिया वादा ImageMagick कमांड लाइन उपकरण के बाद से ImageMagick को चलाने के लिए सभी कार्य उदाहरणों पर पहले से इंस्टॉल आता है।

आपका क्लाउड कार्य एप्लिकेशन में इन दो पैकेज इंस्टॉल करने के लिए निम्न चला npm install --save आदेश। सुनिश्चित करें कि आप से ऐसा बनाओ functions निर्देशिका।

npm install --save @google-cloud/vision@0.12.0 child-process-promise@2.2.1

यह दो संकुल स्थानीय स्तर पर स्थापित करने और उन्हें अपने में घोषित निर्भरता के रूप में जोड़ना होगा package.json फ़ाइल।

निर्भरता आयात और कॉन्फ़िगर करें

दो निर्भरता कि स्थापित किए गए थे और कुछ Node.js कोर मॉड्यूल (आयात करने के लिए path , os और fs ) है कि हम अपने के शीर्ष निम्न पंक्तियां जोड़ें इस खंड में की आवश्यकता होगी index.js फ़ाइल:

index.js

const Vision = require('@google-cloud/vision');
const vision = new Vision();
const spawn = require('child-process-promise').spawn;

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

चूंकि आपका फ़ंक्शन Google क्लाउड परिवेश में चलेगा, इसलिए क्लाउड संग्रहण और क्लाउड विज़न लाइब्रेरी को कॉन्फ़िगर करने की कोई आवश्यकता नहीं है: वे आपके प्रोजेक्ट का उपयोग करने के लिए स्वचालित रूप से कॉन्फ़िगर हो जाएंगे।

अनुपयुक्त छवियों का पता लगाना

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

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 image = {
        source: {imageUri: `gs://${object.bucket}/${object.name}`},
      };

      // Check the image content using the Cloud Vision API.
      const batchAnnotateImagesResponse = await vision.safeSearchDetection(image);
      const safeSearchResult = batchAnnotateImagesResponse[0].safeSearchAnnotation;
      const Likelihood = Vision.types.Likelihood;
      if (Likelihood[safeSearchResult.adult] >= Likelihood.LIKELY ||
          Likelihood[safeSearchResult.violence] >= Likelihood.LIKELY) {
        console.log('The image', object.name, 'has been detected as inappropriate.');
        return blurImage(object.name);
      }
      console.log('The image', object.name, 'has been detected as OK.');
    });

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

जब फ़ंक्शन ट्रिगर होता है, तो छवि को क्लाउड विज़न एपीआई के माध्यम से चलाया जाता है ताकि यह पता लगाया जा सके कि इसे वयस्क या हिंसक के रूप में फ़्लैग किया गया है। छवि इन मानदंडों के आधार पर अनुपयुक्त के रूप में पता चला है कि हम छवि है जो में किया जाता है धुंधला कर रहे हैं blurImage समारोह जो हम अगले देखेंगे।

छवि को धुंधला करना

निम्नलिखित जोड़े blurImage अपने में समारोह index.js फ़ाइल:

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});
  console.log('Image has been downloaded to', tempLocalFile);
  // Blur the image using ImageMagick.
  await spawn('convert', [tempLocalFile, '-channel', 'RGBA', '-blur', '0x24', tempLocalFile]);
  console.log('Image has been blurred');
  // Uploading the Blurred image back into the bucket.
  await bucket.upload(tempLocalFile, {destination: filePath});
  console.log('Blurred image has been uploaded to', filePath);
  // Deleting the local file to free up disk space.
  fs.unlinkSync(tempLocalFile);
  console.log('Deleted local file.');
  // Indicate that the message has been moderated.
  await admin.firestore().collection('messages').doc(messageId).update({moderated: true});
  console.log('Marked the image as moderated in the database.');
}

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

समारोह तैनात करें

आपके द्वारा इसे परिनियोजित करने के बाद ही फ़ंक्शन सक्रिय होगा। कमांड लाइन चलाने पर 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. ऐप में साइन-इन करने के बाद एक इमेज अपलोड करें: 4db9fdab56703e4a.png
  3. अपलोड करने के लिए अपने सबसे अच्छे आक्रामक छवि चुनें (या आप इस का उपयोग कर सकते ज़ोंबी खाने मांस !) और कुछ ही क्षणों के बाद आप छवि का एक धुंधला संस्करण के साथ अपनी पोस्ट ताज़ा देखना चाहिए: 83dd904fbaf97d2b.png

इस खंड में आप एक क्लाउड फ़ंक्शन जोड़ेंगे जो एक नया संदेश पोस्ट किए जाने पर चैट के प्रतिभागियों को सूचनाएं भेजता है।

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

यदि आप एक वेब एप्लिकेशन को आप के माध्यम से जा सकते हैं पर FCM डिवाइस टोकन प्राप्त करने के लिए कैसे जानने के लिए चाहते हैं, तो Firebase वेब Codelab

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

यह निर्धारित करने के नए संदेश का उपयोग किया जाएगा पोस्ट कर रहे हैं functions.firestore.document().onCreate बादल कार्य ट्रिगर जो अपने कोड जब एक नई वस्तु बादल Firestore के एक दिए गए पथ पर बनाई गई है चलाता है। जोड़े sendNotifications अपने में कार्य करते हैं index.js फ़ाइल:

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);
      console.log('Notifications have been sent and tokens cleaned up.');
    }
  });

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

टोकन साफ़ करें

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

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) {
     console.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 :

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. यदि आप पहली बार ऐप में साइन-इन करते हैं, तो सुनिश्चित करें कि आप संकेत मिलने पर सूचनाओं की अनुमति देते हैं: 8b9d0c66dc36153d.png
  3. चैट ऐप टैब बंद करें या एक अलग टैब प्रदर्शित करें: नोटिफिकेशन तभी दिखाई देते हैं जब ऐप बैकग्राउंड में हो। आप संदेश प्राप्त करने के लिए कैसे, जबकि अपने अनुप्रयोग अग्रभूमि में जानने के लिए चाहते हैं, तो पर एक नजर है हमारे प्रलेखन
  4. एक अलग ब्राउज़र (या एक गुप्त विंडो) का उपयोग करके, ऐप में साइन इन करें और एक संदेश पोस्ट करें। आपको पहले ब्राउज़र द्वारा प्रदर्शित एक सूचना देखनी चाहिए: 45282ab12b28b926.png

आपने क्लाउड फ़ंक्शंस के लिए Firebase SDK का उपयोग किया है और चैट ऐप में सर्वर-साइड घटकों को जोड़ा है।

हमने क्या कवर किया है

  • क्लाउड फ़ंक्शंस के लिए फायरबेस एसडीके का उपयोग करके क्लाउड फ़ंक्शंस को संलेखित करना।
  • ऑथ, क्लाउड स्टोरेज और क्लाउड फायरस्टोर इवेंट्स के आधार पर ट्रिगर क्लाउड फंक्शन।
  • अपने वेब ऐप में फायरबेस क्लाउड मैसेजिंग सपोर्ट जोड़ें।
  • Firebase CLI का उपयोग करते हुए परिनियोजित क्लाउड फ़ंक्शंस।

अगला कदम

और अधिक जानें