ज़रूरी शर्तें
ट्यूटोरियल का पालन करने और उसे समझने के लिए आपके पास Node.js और Express.js ऐप्लिकेशन की बुनियादी जानकारी होनी चाहिए. इसके अलावा, पक्का करें कि आपने WhatsApp डॉक्यूमेंटेशन में में दिए गए के लिए बुनियादी चरणों को पूरा कर लिया है. अगर आप एक बिज़नेस सॉल्यूशन प्रोवाइडर (BSP) हैं, तो हमारी BSP गाइड का पालन करें और पक्का करें कि आपका ऐप्लिकेशन रिव्यू प्रोसेस में पास हो जाए.
पक्का करें कि आपके पास ये तीन चीज़ें तैयार हैं:
- WhatsApp Business ID.
- फ़ोन नंबर ID या टेस्ट फ़ोन ID.
- नीचे दी गई ज़रूरी परमिशन के साथ आपका सिस्टम यूज़र टोकन:
(whatsapp_business_management, whatsapp_business_messaging, and business_management) हैं.
अगर आप फ़ाइनल ऐप्लिकेशन देखना चाहते हैं, तो आप फ़ाइनल प्रोजेक्ट कोड देख सकते हैं.
बेसिक ऐप्लिकेशन बनाना
इस डेमो के लिए, आप इस बेसिक स्केलेटन Node.js और Express.js सर्वर का उपयोग ज़रूरी डिपेंडेंसी और पहले से बनाए गए स्केलेटन फ़ंक्शन के साथ करेंगे.
इस ट्यूटोरियल में रिक्वेस्ट पैकेज भी शामिल है, जिससे आप HTTP रिक्वेस्ट कर सकते हैं, क्योंकि आपका ऐप्लिकेशन API के साथ कम्युनिकेट करता है. एप्लिकेशन की .env फ़ाइल में दो वेरिएबल हैं:
META_AUTH_TOKEN और MESSAGING_PRODUCT.
सर्वर सेट करने के बाद, आप API बनाने की प्रोसेस में जा सकते हैं.
मीडिया मैसेज के लिए फ़ोटो अपलोड करना
WhatsApp का इस्तेमाल करके मीडिया वाले मैसेज भेजने से पहले, आपको मीडिया अपलोड करना होगा ताकि WhatsApp बाद में उसे एक्सेस कर सके. WhatsApp पर अपलोड की गई मीडिया फ़ाइलें 30 दिनों तक सेव रहती हैं और अगर आप डिलीट नहीं करते हैं, तो वे सेव ही रहती हैं.
आपको routes/media.js फ़ाइल में एक नया POST रूट बनाना होगा, जिसका उपयोग आप अपने मीडिया को मैनेज करने के लिए कर सकते हैं. डॉक्यूमेंट के अनुसार, आपको चार आइटम पास करने होंगे:
- फ़ोन नंबर ID, जिसे आप पैरामीटर के रूप में भेजते हैं.
- वह फ़ाइल, जिसे आप अपलोड करना चाहते हैं और जिसे आप फ़ॉर्म डेटा के तौर पर भेजते हैं.
- वह फ़ाइल टाइप अपलोड करें, जिसे आप हेल्पर फ़ंक्शन का उपयोग करके जेनरेट करते हैं.
- मैसेजिंग प्रोडक्ट, जो आपको .env फ़ाइल से मिलता है.
जब आप एक API कॉल बनाते हैं, तो आपको सिर्फ़ एक मोबाइल नंबर ID और फ़ाइल की ज़रूरत होती है. बाकी फ़ील्ड को आप हेल्पर फ़ंक्शन का उपयोग करके जेनरेट कर सकते हैं.
आप फ़ॉर्म डेटा प्रोसेस करने के लिए npm पैकेज formidable का उपयोग करते हैं. ध्यान दें कि WhatsApp Business API में कुछ तरह के और साइज़ के मीडिया के लिए कुछ सीमाएँ हैं, जिनके बारे में आप मीडिया डॉक्यूमेंट के सबसे नीचे सपोर्ट किए जाने वाले मीडिया के प्रकार सेक्शन में जान सकते हैं. इस समस्या से निपटने के लिए स्केलेटन प्रोजेक्ट में helper/validations.js फ़ाइल में दो हेल्पर फ़ंक्शन हैं.
फ़ोटो अपलोड करने के लिए, आपको एक नया फ़ॉर्मिडेबल फ़ॉर्म शुरू करना होगा. फ़ॉर्म ऑब्जेक्ट का उपयोग करके फ़ाइल पार्स करें और हेल्पर फ़ंक्शन का उपयोग करके कुछ वेरिफ़िकेशन पूरे करें. इसके बाद, फ़ॉर्म डेटा और रिक्वेस्ट का उपयोग करके मान्य वेरिफ़िकेशन टोकन के साथ एक पोस्ट रिक्वेस्ट करें.
exports.uploadMedia = async (req, res) => { let form = new formidable.IncomingForm(); form.keepExtensions = true; form.parse(req, async (err, fields, files) => { if (err) { return res.status(400).json({ error: "Media could not be uploaded", }); } if (!files.file) { return res.status(400).json({ error: "Media File is required", }); } let isFileValidSize = validateMediaSize(files.file.size, files.file.type); if (!isFileValidSize) { return res.status(400).json({ error: `Media File size should be less than ${mediaLimits( files.file.type )}`, }); } request.post( { url: `https://graph.facebook.com/v13.0/${req.params.id}/media`, formData: { file: { value: fs.createReadStream(files.file.path), options: { filename: files.file.name, contentType: files.file.type, }, }, type: files.file.type, messaging_product: process.env.MESSAGING_PRODUCT, }, headers: { Authorization: `Bearer ${process.env.META_AUTH_TOKEN}`, "content-type": "multipart/form-data", }, }, function (err, resp, body) { if (err) { console.log("Error!"); } else { res.json(JSON.parse(body)); } } ); }); };यह फ़ंक्शन जोड़ने के बाद आप Postman का उपयोग करके इस रूट को टेस्ट कर सकते हैं. Postman के इंटरफ़ेस में फ़ाइनल ऑब्जेक्ट इस तरह दिखाई देना चाहिए:
भेजें पर क्लिक करने पर, आपको API से जवाब के तौर पर अपलोड मीडिया ID मिलेगी.
अपलोड की गई मीडिया ID का ध्यान रखें, क्योंकि हम इसका उपयोग इस ट्यूटोरियल में बाद में करेंगे. अगर आप डेटा लेयर के साथ ऐप्लिकेशन बना रहे हैं, तो आप इस ID को अपने डेटाबेस में स्टोर कर सकते हैं और बाद में उपयोग कर सकते हैं. या आपका फ़्रंट-एंड एप्लिकेशन इस ID को कुछ समय के लिए वेरिएबल या स्टेट में स्टोर कर सकता है.
मीडिया मैसेज भेजना
अब, कस्टमर को मीडिया मैसेज भेजने के लिए उस मीडिया ID का उपयोग करें, जिसे आपने पिछले चरण में वापस पाया था. API रेफ़रेंस के अनुसार, कस्टमर को मीडिया मैसेज भेजने के लिए आपको API को पाँच आइटम भेजने होंगे:
- पैरामीटर के रूप में पास की गई फ़ोन नंबर ID
- रिक्वेस्ट के मुख्य हिस्से में भेजा गया कस्टमर का फ़ोन नंबर
- रिक्वेस्ट के मुख्य हिस्से में भेजे गए मैसेज का प्रकार
- रिक्वेस्ट के मुख्य हिस्से में भेजी गई मीडिया ID
- इस मामले में प्राप्तकर्ता का प्रकार व्यक्ति होगा
फ़ंक्शन ऐसा दिखता है:
exports.sendMediaMessage = async (req, res) => { const { id, to, type } = req.body; if (!id || !to || !type) { return res.status(400).json({ error: "Required Fields: to, type and id", }); } request.post( { url: `https://graph.facebook.com/v13.0/${req.params.id}/messages`, headers: { Authorization: `Bearer ${process.env.META_AUTH_TOKEN}`, "content-type": "application/json", }, body: `{ "messaging_product": "whatsapp", "recipient_type": "individual", "to": "${to}", "type": "${type}", "${type}": { "id": "${id}", }, }`, }, function (err, resp, body) { if (err) { console.log("Error!"); } else { res.json(JSON.parse(body)); } } ); };अगर आप ज़रूरी जानकारी और तर्कों के साथ इस एंड पॉइंट को Postman में चलाते हैं, तो यह इस तरह दिखाई देता है.
भेजने के बाद आपको Postman में नीचे दिया गया आउटपुट दिखाई देगा, जिसमें मैसेज ID भी शामिल होगी.
मीडिया आइटम देखना
GET ऑपरेशन और फ़ेच की गई या स्टोर की गई मीडिया ID के ज़रिए मीडिया URL को आसानी से वापस पाया जा सकता है.
exports.getMediaUrl = async (req, res) => { request.get( { url: `https://graph.facebook.com/v13.0/${req.params.id}`, headers: { Authorization: `Bearer ${process.env.META_AUTH_TOKEN}`, }, }, function (err, resp, body) { if (err) { console.log("Error!"); } else { res.json(JSON.parse(body)); } } ); };मीडिया आइटम को एक्सेस करने के बाद, Postman रिक्वेस्ट और रिस्पॉन्स कुछ इस तरह दिखाई देते हैं.
मीडिया डिलीट करना
मीडिया को डिलीट करने के लिए, आप मीडिया रिक्वेस्ट डिलीट करने के लिए उसी WhatsApp API एंड पॉइंट का उपयोग करेंगे.
exports.deleteMedia = async (req, res) => { request.delete( { url: `https://graph.facebook.com/v13.0/${req.params.id}`, headers: { Authorization: `Bearer ${process.env.META_AUTH_TOKEN}`, }, }, function (err, resp, body) { if (err) { console.log("Error!"); } else { res.json(JSON.parse(body)); } } ); };मीडिया को डिलीट करने के बाद, API यह रिस्पॉन्स भेजता है:
WhatsApp Business प्लेटफ़ॉर्म के बारे में ज़्यादा जानें
यह ट्यूटोरियल सिर्फ़ एक उदाहरण है कि आप WhatsApp Business प्लेटफ़ॉर्म के साथ क्या कर सकते हैं. अपने अगले प्रोजेक्ट का प्लान बनाते समय, WhatsApp Business प्लेटफ़ॉर्म डॉक्यूमेंट देखें, ताकि आप इसके मीडिया फ़ंक्शन और सीमाओं को पूरी तरह समझ सकें.
इन चीज़ों का ध्यान रखें:
- अपलोड किया गया मीडिया सिर्फ़ तीस दिनों तक रहता है
- जेनरेट किए गए डाउनलोड URL सिर्फ़ पाँच मिनट तक मौजूद रहते हैं
- फ़ाइल अपलोड करते समय हमेशा मीडिया ID सेव करें
यहाँ फ़िलहाल सपोर्ट किए जाने वाले मीडिया के प्रकारों की लिस्ट दी गई है. ज़्यादा जानकारी के लिए सपोर्ट किए जाने वाले मीडिया के प्रकार देखें.
- ऑडियो (<16 MB) – ACC, MP4, MPEG, AMR और OGG फ़ॉर्मेट
- डॉक्यूमेंट (<100 MB) – टेक्स्ट, PDF, Office और Open Office फ़ॉर्मेट
- फ़ोटो (<5 MB) – JPEG और PNG फ़ॉर्मेट
- वीडियो (<16 MB) – MP4 और 3GP फ़ॉर्मेट
- स्टिकर (<100 KB) – WebP फ़ॉर्मेट
निष्कर्ष
WhatsApp Business प्लेटफ़ॉर्म पर आपको मीडिया से भरपूर मैसेजिंग के ज़रिए अपने कस्टमर्स से इंटरैक्ट करने के मौके मिल सकते हैं. API-आधारित ऐप्लिकेशन बनाने से आप ऐसी मीडिया लाइब्रेरी बना सकते हैं और उसे कलेक्ट कर सकते हैं जिसका फ़ायदा आपके यूज़र्स उठा सकते हैं और वे बार-बार एक ही काम किए बिना आसानी से और कारगर तरीके से मैसेज भेज सकते हैं.
WhatsApp डेवलपर पोर्टल देखें और आपके लिए और क्या उपलब्ध है, यह देखने के लिए आज ही अपना ऐप्लिकेशन बनाना शुरू करें.
