How to create an Alexa skill for your site

Sep 11, 2025
कैसे करना है
Create an Alexa skill for your site

हम में से कई में अब घर के चारों ओर कुछ प्रकार का आवाज सहायक है, भले ही यह एक अमेज़ॅन गूंज, ऐप्पल होमपॉड या Google होम हो। ऐसा लगता है कि जिस तरह से हम अपने दैनिक जीवन के बारे में जाते हैं, और वेब डेवलपर्स के रूप में हमें अपने आप से पूछने की ज़रूरत है, वे क्या तरीके से सुधार कर सकते हैं प्रयोगकर्ता का अनुभव हमारी वेबसाइटों और वेब अनुप्रयोगों में आवाज लागू करके?

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

और एक AWS खाता ।

फायरबेस का उपयोग हमारे उपयोगकर्ता इनपुट को स्टोर करने के लिए किया जाएगा, इसलिए सुनिश्चित करें कि आप साइन अप करें फायरबेस खाता । हम नवीनतम समाचार कहानियों को पाने के लिए समाचार एपीआई का भी उपयोग करेंगे, इसलिए अपने आप को एक मुफ्त एपीआई कुंजी प्राप्त करें [5 9] Newsapi.org

।

इरादों, उच्चारण और स्लॉट

[6 9] Alexa skill: Utterances

यहां हमारे कौशल के लिए एलेक्सा डेवलपर कंसोल के अंदर सेटअप किए गए हैं। अधिक जोड़ने के लिए स्वतंत्र महसूस करें

एक बार जब आप सेट हो जाते हैं, तो नेविगेट करें developer.amazon.com/alexa/console/ask और कौशल बनाने पर क्लिक करें। हमें जो पहली चीज करने की ज़रूरत है वह एलेक्सा डेवलपर कंसोल के अंदर इरादों, उच्चारण और स्लॉट प्रकारों को स्थापित करता है। एक इरादा यह है कि कौशल का उपयोगकर्ता प्राप्त करने की कोशिश कर रहा है। उच्चारण विशिष्ट वाक्यांश हैं जो उपयोगकर्ता एलेक्सा से बात करते समय कहेंगे, उदाहरण के लिए: 'यह किस दिन है?'। एक स्लॉट एक चर है जो एक उच्चारण से संबंधित है, उदाहरण के लिए: 'यह {place} में क्या समय है?' यह कस्टम स्लॉट {place} बना देगा।

डैशबोर्ड के बाईं ओर से इरादे का चयन करें और इरादे जोड़ें पर क्लिक करें। सुनिश्चित करें कि कस्टम इरादा का चयन किया गया है और टाइप करें संतुष्ट टेक्स्ट बॉक्स में: यह अब बाद में हमारा फ़ंक्शन नाम बन जाएगा।

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

[9 3] "अद्यतन {श्रेणी}" "{श्रेणी} कहानियां" "{श्रेणी} को अपडेट करें" "{श्रेणी} में कहानियां सेट करें" [9 4]

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

एडब्ल्यूएस लैम्ब्डा समारोह

हम अब आगे बढ़ेंगे Aws के अंदर लैम्ब्डा । फ़ंक्शन बनाएं चुनें और फिर ब्लूप्रिंट रेडियो बॉक्स का चयन करें। सुनिश्चित करें कि आप का चयन करें एलेक्सा-कौशल-किट-एसडीके-फैक्टस्किल सूची से और कॉन्फ़िगर करें पर क्लिक करें। अपना फ़ंक्शन को एक नाम दें और फिर एक नई भूमिका बनाएं। समाप्त होने पर, पृष्ठ के नीचे फ़ंक्शन बनाएं पर क्लिक करें। आपको अपने फ़ंक्शन के लिए ट्रिगर के रूप में एलेक्सा कौशल किट का चयन करने की आवश्यकता होगी, फिर हम फ़ंक्शन पर ही जा सकते हैं। हम इस परियोजना के लिए अंतर्निहित कोड संपादक का उपयोग नहीं करेंगे; इसके बजाय हम स्थानीय रूप से कार्यों को लिखेंगे और फिर ज़िप फ़ाइल अपलोड करेंगे। सुनिश्चित करें कि आप Lambda संपादक के अंदर index.js फ़ाइल की सामग्री की प्रतिलिपि बनाते हैं, क्योंकि हम इसे हमारी स्थानीय परियोजना के अंदर पेस्ट करेंगे।

एक स्थानीय परियोजना बनाएँ

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

[10 9] एनपीएम एलेक्सा-एसडीके स्थापित करें एनपीएम इंस्टॉल फायरबेस [9 4]

सुनिश्चित करें कि आप अपने index.js फ़ाइल के शीर्ष पर संदर्भ शामिल हैं।

[10 9]कॉन्स एलेक्सा = आवश्यकता ('एलेक्सा-एसडीके'); वीएआर फायरबेस = आवश्यकता ("फायरबेस"); [9 4]

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

[10 9] 'लॉन्च राइस्ट': फ़ंक्शन () { यह। (': पूछें', 'वेबसाइट अपडेट में आपका स्वागत है'); }, [9 4]

यदि आप उपयोग करते हैं :कहना कमांड फिर एलेक्सा संदेश के बाद कौशल समाप्त कर देगा, जबकि यदि आप उपयोग करते हैं :पूछना फिर एलेक्सा अगले प्रॉम्प्ट के लिए आठ सेकंड तक सुनेंगे। हम उपयोग करेंगे :पूछना , ताकि एलेक्सा हमारे अपडेट प्रॉम्प्ट को सुनने के लिए तैयार हो।

फ़ायरबेस विन्यास

इसके बाद, हमें index.js फ़ाइल के शीर्ष पर हमारे फ़ायरबेस कॉन्फ़िगरेशन विवरण जोड़ने की आवश्यकता है। 

 var config = {
    Apikey: "& lt; api_key & gt;",
    Authdomain: "& lt; project_id & gt; .firebaseApp.com",
    DatableUrl: "https: // & lt; डेटाबेस_नाम और जीटी; .firebaseio.com",
    प्रोजेक्टिड: "& lt; project_id & gt;",
    स्टोरेजबकेट: "& lt; बाल्टी और gt; .appspot.com",
    Messagingsenderid: "& lt; sender_id & gt;"
  };
Firebase.initializeapp (कॉन्फ़िगरेशन);

संतुष्ट समारोह

Alexa skill: Simulator

एलेक्सा सिम्युलेटर एक अमेज़ॅन इको डिवाइस की आवश्यकता के बिना आपकी मशीन पर आपके कौशल का परीक्षण करने का एक शानदार तरीका है

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

[10 9] 'सामग्री अपडेट': फ़ंक्शन () { var श्रेणी टाइप = this.event.request.intent.slots.category.value; अगर (firebase.apps.length === 0) { Firebase.initializeapp (कॉन्फ़िगरेशन); } Firebase.database ()। रेफरी ('/')। सेट ({ वरीयता: श्रेणी टाइप })। फिर ((डेटा) = & gt; { Firebase.app ()। हटाएं ()। फिर () })। पकड़ ((ERR) = & gt; { Console.log (ERR); }) यह। (': पूछें', 'आपने' श्रेणी टाइप करने के लिए 'अपडेट किया है; }, [9 4]

अपनी index.js फ़ाइल को सहेजने के बाद, आपको परियोजना को ज़िप करने की आवश्यकता होगी। कमांड लाइन से प्रोजेक्ट फ़ोल्डर पर नेविगेट करें और निम्न आदेश टाइप करें।

[9 3] ज़िप -आर इंडेक्स.ज़िप * [9 4]

लैम्ब्डा के अंदर अपने फ़ंक्शन पर वापस जाएं और फ़ंक्शन कोड अनुभाग पर स्क्रॉल करें। कोड प्रविष्टि प्रकार के लिए ड्रॉप-डाउन बॉक्स से, 'एक .zip फ़ाइल अपलोड करें' का चयन करें। अब आप अपनी ज़िप फ़ाइल अपलोड करने में सक्षम होंगे।

एलेक्सा सिम्युलेटर के अंदर अपनी परियोजना का परीक्षण करने से पहले, एआरएन को लैम्ब्डा पृष्ठ के ऊपरी दाएं भाग पर लें और इसे एलेक्सा कंसोल के एंडपॉइंट सेक्शन के अंदर इनपुट करें। अपने कौशल का परीक्षण करने के लिए, आपको यह कहना होगा कि 'ओपन वेब अपडेट' और एलेक्सा 'वेब अपडेट में आपका स्वागत' के साथ प्रतिक्रिया देगा। यदि आप अब 'खेल के लिए अद्यतन' कहते हैं, तो एलेक्सा को 'आप खेल में अपडेट' कहना चाहिए। 'स्पोर्ट' शब्द भी आपके फायरबेस डेटाबेस के अंदर वरीयता के तहत दिखाई देना चाहिए।

समाचार पृष्ठ

[17 9] Alexa skill: Final page

यहां बताया गया है कि अंतिम HTML पृष्ठ कैसा दिखता है। यह उस श्रेणी को प्रदर्शित करेगा जिसे आपने एलेक्सा के माध्यम से अनुरोध किया था

अंत में, एलेक्सा प्रोजेक्ट - एचटीएमएल फ़ोल्डर से मैंने बनाए गए समाचार पृष्ठ (index.html) को डाउनलोड करें GitHub ।

Main.js फ़ाइल खोलें और 1-8 पंक्तियों पर अपने फायरबेस कॉन्फ़िगरेशन विवरण में प्रवेश करें, जैसे हमने पहले ट्यूटोरियल में किया था।

आपको Main.js फ़ाइल के लाइन 11 पर newsapi.org से अपनी समाचार एपीआई कुंजी दर्ज करने की भी आवश्यकता होगी।

[10 9] var myapikey = "& lt; yourapikey" & gt ;; [9 4]

यदि आप अब index.html फ़ाइल खोलते हैं, तो इसे आपकी चुनी हुई श्रेणी से कुछ समाचार कहानियों में लोड करना चाहिए। हर बार जब आप एलेक्सा को एक नई श्रेणी (खेल, प्रौद्योगिकी, व्यापार या राजनीति) के साथ अद्यतन करने के लिए कहते हैं, तो पृष्ठ पर समाचार कहानी श्रेणी बदल जाएगी।

एलेक्सा, आगे!

यह केवल एक छोटा सा उदाहरण है जो आप एलेक्सा के साथ प्राप्त कर सकते हैं और उम्मीद है कि आपको किसी भी भविष्य की आवाज परियोजनाओं के लिए एक अच्छी नींव प्रदान करता है। आप एपीआई से अधिक श्रेणियां प्राप्त करने के लिए हमेशा अधिक स्लॉट मानों को जोड़ सकते हैं या यहां तक ​​कि प्रोजेक्ट को अपडेट कर सकते हैं ताकि यह आपकी वेबसाइट / पोस्ट में खींच सके। मैं यह देखने के लिए इंतजार नहीं कर सकता कि वेब और ऐप डेवलपर्स को अपनी परियोजनाओं में एलेक्सा शामिल कैसे मिलेगा।

आपकी साइट को ऊपर और चल रहा है?इसे पूरी तरह से सर्वश्रेष्ठ के साथ निगरानी करें वेब होस्टिंग सेवाएं।

यह लेख मूल रूप से अंक 313 में प्रकाशित किया गया था जाल , वेब डिजाइनरों और डेवलपर्स के लिए दुनिया की सबसे अच्छी बिकने वाली पत्रिका। यहां 313 जारी करें या यहां सदस्यता लें ।

संबंधित आलेख:

  • क्यों वॉयस यूआई वेब डिज़ाइन में अगली बड़ी बात है
  • वॉयस प्रोटोटाइप एडोब एक्सडी में जोड़ा गया
  • सभी अमेज़ॅन उपकरणों के लिए अंतिम गाइड
[24 9]

कैसे करना है - सर्वाधिक लोकप्रिय लेख

Create your own Calligraphic brush in Illustrator

कैसे करना है Sep 11, 2025

इलस्ट्रेटर के बारे में सबसे अच्छी चीजों में से एक..

Use Marmoset Toolbag to present models in VR

कैसे करना है Sep 11, 2025

Marmoset Toolbag किसी भी तरह से नया नहीं है 3 डी कला industry. �..

How to build an AR app

कैसे करना है Sep 11, 2025

पेज 1 में से 3: एक एआर ऐप बनाएं: चरण 01-10 ..

Paint a mischievous hare in watercolour

कैसे करना है Sep 11, 2025

प्राणीशास्त्र, जानवरों और वन्यजीवन का अध्ययन करने के बाद हमेशा मेरे लिए �..

Understanding the CSS display property

कैसे करना है Sep 11, 2025

यह आधी रात है, और वह एक डिव आपकी साइट पर अभी भ�..

एक ऐप बनाएं जो सेंसर डेटा एकत्र करता है

कैसे करना है Sep 11, 2025

आज, इंटरकनेक्टेड उत्पादों के विकास के लिए किफायत�..

How to build worlds for the cinema

कैसे करना है Sep 11, 2025

एक फंतासी वातावरण बनाने पर एक कार्यशाला करने के ल..

5 ways to manage cashflow effectively

कैसे करना है Sep 11, 2025

अपने कैशफ्लो को नियंत्रित करना फ्रीलांस सफलता क�..

श्रेणियाँ