HTML/जावास्क्रिप्ट के साथ अपने Arduino को नियंत्रित करना आसान तरीका: 8 कदम

2024 लेखक: John Day | [email protected]. अंतिम बार संशोधित: 2024-01-30 09:22

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

चालू करो

एक बटन चालू करने के लिए। सुंदरता यह है कि पिनमोड (12, INPUT) घोषित करने के अलावा कोई अन्य arduino प्रोग्रामिंग शामिल नहीं है; आपके सेट अप फ़ंक्शन में। जब तक पिन घोषित किया जाता है तब तक जावास्क्रिप्ट का उपयोग बाकी सभी चीजों के लिए किया जा सकता है।

दस्तावेज़.ऑनलोड = {

गेटजसन ('ए0', 1 'रिटर्न_जेसन')

}

एनालॉग पिन 0 का मान प्राप्त करने और परिणाम को div में वापस करने के लिए आपको बस इतना करना है। तो यह लोगों के लिए arduino को नियंत्रित करने वाले html पेज बनाने में सक्षम होने का एक आसान तरीका होना चाहिए। साथ ही एक इंटरफ़ेस बनाएं ताकि आर्डिनो पिन को जावास्क्रिप्ट के साथ सेट और पढ़ा जा सके।

चरण 1: आपको क्या चाहिए

मैंने इस प्रोजेक्ट को उन उपयोगकर्ताओं के लिए बनाया है जो ESP8266 पर एक html पेज के साथ अपने arduino को नियंत्रित करना चाहते हैं। इस परियोजना का लक्ष्य जावास्क्रिप्ट फ़ंक्शन के साथ अपने arduino पर पिन के मान सेट करने के लिए एक सरल विधि बनाना है। परीक्षा के लिए onclick="SetPin(12, 1, 0)" आपके arduino पर Pin 12 को High पर सेट कर देगा।

इस ट्यूटोरियल के लिए आपको सटीक रूप से अनुसरण करने के लिए निम्नलिखित मदों की आवश्यकता होगी। हालाँकि, मुझे लगता है कि इसे अधिकांश arduino और ESP8266 संयोजनों पर काम करना चाहिए। हालाँकि, मेरे पास यहाँ जो कुछ भी है, उसका पालन करने के लिए आपको निम्नलिखित घटकों की आवश्यकता होगी।

Arduino Uno - किसी भी arduino के साथ काम करना चाहिए जिसमें एक सीरियल Rx TxAdafruit Huzzah ब्रेकआउट बोर्ड USB टू सीरियल केबल 4 लो पावर LED का एनालॉग टर्पिडिटी टेस्टर हो - कोई भी एनालॉग सेंसर जो एनालॉग आउटपुट प्रदान करता है, मोबाइल ब्राउज़र Arduino लाइब्रेरी के साथ वायर वाईफाई राउटर सेल फोन करेगा।

चरण 2: Arduino ID तैयार करना

इस परियोजना के लिए एक नए arduino पुस्तकालयों और कुछ विन्यास की आवश्यकता है और समय के लिए। मैं हर स्क्रीन का एक स्क्रीनशॉट नहीं डालूंगा और मैं बस इसके माध्यम से चलाने जा रहा हूं कि आपको इसे कॉन्फ़िगर करने और इसे चलाने की आवश्यकता होगी। मैंने इसे उपयोगकर्ता के लिए यथासंभव आसान बनाने की कोशिश की।

कोड काम करने के लिए कई पुस्तकालयों का उपयोग करता है। सबसे पहले हम ESP8266 के लिए arduino की स्थापना पर ध्यान केंद्रित करेंगे, मैं इस उदाहरण में Adafruit Huzzah का उपयोग कर रहा हूं, क्योंकि मुझे adafruit के उत्पाद सबसे विश्वसनीय लगते हैं और उनके पास सबसे अच्छा समर्थन है। जब तक आप Adafruit Discord सर्वर से समर्थन प्राप्त करने का प्रयास नहीं करते हैं। सहायता फ़ोरम में सहायता प्राप्त करने के लिए आपके पास बहुत बेहतर भाग्य होगा।

वैसे भी, मैं ESP8266 पर निम्नलिखित पुस्तकालयों का उपयोग कर रहा हूँ

ESP8266WiFi WiFiClient ESP8266WebServer ArduinoJSONयह पुस्तकालयों को डाउनलोड और स्थापित करने के बारे में एक ट्यूटोरियल नहीं है, हालांकि, ये HUZZAH पर उपयोग की जाने वाली लाइब्रेरी हैं। तो कृपया उन्हें ढूंढें और उन्हें स्थापित करें। आपको HUZZAH के लिए बोर्ड परिभाषाएँ भी स्थापित करने की आवश्यकता होगी, इसलिए यदि आप FILE> वरीयताएँ पर जाते हैं तो बॉक्स में अतिरिक्त बोर्ड प्रबंधक URL कहते हैं, कृपया निम्नलिखित जोड़ेंhttps://arduino.esp8266.com/stable/package_esp8266c…यदि आपके पास पहले से ही है इस क्षेत्र में कुछ, यह सुनिश्चित करने के बजाय कि आप एक अतिरिक्त बोर्ड यूआरएल जोड़ने के लिए वहां अल्पविराम जोड़ते हैं। ठीक क्लिक करें कि जाओ

उपकरण> बोर्ड> बोर्ड प्रबंधक ESP8266 समुदाय द्वारा ESP8266 स्थापित करने के बजाय ESP8266 की खोज करें।

महान अब यह सुनिश्चित करते हैं कि हमारे पास वह सब कुछ है जो हमें arduino कोड को काम करने के लिए चाहिए। एक arduino साइड arduino ही इस ट्यूटोरियल के लिए केवल 2 पुस्तकालयों का उपयोग करता है।

SoftwareSerialArduinoJSONजो आपके पास पहले से होना चाहिए।

चरण 3: ESP8266 तैयार करना

अब हम कोड को ESP8266 (Adafruit HUZZAH) पर डालने जा रहे हैं और इसे Arduino से कनेक्ट करने के लिए तैयार करेंगे। HUZZAH के लिए कोड को अनज़िप करें और स्केच खोलें। 11 और 12 की तर्ज पर अपने स्थानीय नेटवर्क पर अपने वाईफाई कनेक्शन के ssid और पासवर्ड को बदलें। आप देखेंगे कि स्केच फ़ाइल और index.h फ़ाइल 2 फ़ाइलें हैं। index.h फ़ाइल वह जगह है जहाँ html संग्रहीत किया जाता है जो आपके फ़ोन में प्रदर्शित होगा।

अपने वाईफाई पर सही SSID और पासवर्ड सेट करने के बाद आप कोड को संकलित कर सकते हैं और इसे अपने ESP8266 पर लोड कर सकते हैं। HUZZAH पर आपको GPIO0 लेबल वाले बटन को दबाए रखना चाहिए, फिर बाकी बटन पर क्लिक करें, चिप को बूटलोडर मोड में डालने के लिए GPIO0 बटन को जाने दें। यदि चिप को सफलतापूर्वक बूटलोडर मोड में डाल दिया गया है तो एक लाल बत्ती चालू हो जाएगी, यह दर्शाता है कि चिप बूट लोडर मोड में है।

ESP8266 से कनेक्ट करने के लिए आपको सीरियल केबल या USB से सीरियल एडेप्टर, या FDTI चिप की आवश्यकता होगी। इस मामले में मैं एडफ्रूट के केबल का उपयोग कर रहा हूं जैसा कि निर्देशों में बताया गया है। हालाँकि, आप Tx और Rx पिन पर TTL का उपयोग करके चिप को कई तरीकों से हुक कर सकते हैं। जो मैं उम्मीद कर रहा हूं कि इसे देखने वाले लोग इस पर कोड लोड करने के लिए चिप को हुक करना जानते हैं। किसी भी तरह आगे बढ़ें और इस चरण से जुड़ी ज़िप फ़ाइल में कोड के साथ चिप को फ्लैश करें।

चरण 4: Arduino तैयार करना

कोड को Arduino पर लोड करने के लिए, अपनी बोर्ड परिभाषा को Arduino/Genuino Uno में बदलें। इस चरण से जुड़ी फ़ाइल को अनज़िप करें। इसे ardunio पर अपलोड करें। बहुत सरल वास्तव में, सारी मेहनत आपके लिए पहले ही की जा चुकी है। मैं पहले ही एक त्रुटि प्रक्रिया के परीक्षण से गुजर चुका हूं, इसलिए आपको केवल कोड अपलोड करना है।

चरण 5: सब कुछ एक साथ तार करना

ठीक है तो वायरिंग के लिए मेरे पास जो कुछ है उसके ऊपर एक तस्वीर है।

Huzzah पर Tx को arduino पर पिन 2 से कनेक्ट करें। Huzzah पर Rx को arduino पर पिन 3 से कनेक्ट करें। मैंने डिफ़ॉल्ट सीरियल कंसोल को मुक्त करने के लिए arduino पर पिन 2 और 3 पर एक और सीरियल सॉकेट बनाया।

पिन V+ और En को arduino से 5v से कनेक्ट करें। - एडफ्रूट हुज़ाह में बिल्ट इन वोल्टेज 3.3v रेगुलेटर है, इसलिए इन पिनों को इस तरह से प्लग करना सभी ESP8266 मॉड्यूल के साथ काम नहीं कर सकता है। आपको अपने स्वयं के वोल्टेज नियामक में तार लगाने की आवश्यकता हो सकती है। मैं हुज़ाह का उपयोग करने की सलाह देता हूं यदि आप बस चीज़ को आसानी से काम करना चाहते हैं। GND को arduino के GND से कनेक्ट करें

आपके एल ई डी में आर्डिनो तार पर पिन १२, ११, ९, ८ पर मैंने यहाँ कम शक्ति वाली एलईडी का उपयोग किया है क्योंकि जो बहुत अधिक करंट खींचते हैं वे इस प्रयोग को सरल रखने के लिए बहुत अधिक शक्ति खींच सकते हैं।

Arduino पर A0 एनालॉग पिन 0 पर मैंने अपने टर्पिटिटी टेस्टर की आउटपुट लाइन में प्लग किया है। हालाँकि, आप मूल रूप से किसी भी सेंसर के आउटपुट में प्लग इन कर सकते हैं जो आपको एक एनालॉग रीडिंग देगा। इसे वायर करने के लिए आपको बस इतना करना है।

चरण 6: वेबपेज तक पहुंचना

अब जब आपके पास arduino को तार-तार कर दिया गया है और आपके बोर्ड पर सब कुछ लोड हो गया है, तो आपको अपने मोबाइल फोन पर html देखने में सक्षम होने की आवश्यकता है। अब मैं चाहता हूं कि आप उसी वाईफाई राउटर से कनेक्ट हों, जिसके लिए आपने हुजाह के कोड में एसएसआईडी और पासवर्ड सेट किया था। आपको यह पता लगाने की आवश्यकता है कि आपके राउटर ने आपके डिवाइस को कौन सा आईपी पता सौंपा है। आमतौर पर, यदि आप अपने राउटर कॉन्फ़िगरेशन में लॉग इन करते हैं तो क्लाइंट सूची होनी चाहिए। यह आपके वाईफाई कनेक्शन से जुड़े सभी उपकरणों के आईपी पते दिखाता है। हालाँकि, यदि आपको यह IP पता नहीं मिल रहा है, तो आप इसे arduino से अनप्लग कर सकते हैं और इसे फिर से सीरियल केबल के साथ चला सकते हैं। यदि आप डिवाइस पर सीरियल कंसोल खोलते हैं तो यह सीरियल कंसोल में डिवाइस पर आईपी एड्रेस प्रिंट करेगा यदि आप इसे किसी अन्य तरीके से नहीं ढूंढ पा रहे हैं। वैसे भी एक बार जब आप अपने सेल फोन के साथ उसी वाईफाई नेटवर्क से जुड़े होते हैं। अपने मोबाइल वेब ब्राउज़र को हुज़ाह के आईपी पते पर इंगित करें। जो शायद कुछ इसी तरह दिखता है। https://192.168.0.107 या कुछ बहुत समान। वहां मैंने एक मूल पृष्ठ डाला है जो आपको 4 एल ई डी को चालू और बंद करने के साथ-साथ एनालॉग सेंसर के मूल्य को पढ़ने की अनुमति देगा।

चरण 7: जावास्क्रिप्ट का उपयोग करना

ESP8266Code स्केच में index.h नामक फ़ाइल में इसे arduino संपादक में एक अलग टैब के रूप में आना चाहिए। आप मूल उदाहरण देख सकते हैं जो मैंने यहां बनाया है। मूल रूप से इसके काम करने का तरीका इस प्रकार है।

सेटपिन(12, 1, 0); सेटपिन ({पिन नंबर}, {वैल्यू 1 हाई 0 लो}, {IsAnalog 1 हां 0 नहीं})

यह डिजिटल पिन 12 का मान उच्च पर सेट करेगा

सेटपिन (4, 0, 0);

यह डिजिटल पिन 4 का मान निम्न पर सेट कर देगा

SetPin(A2, 439, 1) यह एनालॉग पिन 2 का मान 439. पर सेट करेगा

इसी तरह, फ़ंक्शन GetJSON एक पिन से अनुरोधित मान लौटाएगा और इसे निर्दिष्ट div Id के साथ एक html में रखेगा।

GetJSON('A0', 1, 'resp_i') GetJSON({Pin Number}, {IsAnalog 1 Yes 0 No}, {Id Of HTML Element to return result})

यह arduino को एक अनुरोध भेजकर एनालॉग पिन 0 के मान के लिए कहेगा और परिणाम को ID resp_iGetJSON(12, 0, 'mydiv') के साथ Div में वापस करने के लिए; यह arduino को डिजिटल पिन 0 का मान प्राप्त करने के लिए कहेगा और परिणाम को html तत्व और mydiv के आईडी में वापस कर देगा

चरण 8: समर्थन

मुझे उम्मीद है कि मेरी स्क्रिप्ट आप में से उन लोगों की मदद करेगी जो इसका इस्तेमाल करना चाहते हैं। मैंने यहां एक बहुत ही बुनियादी html उदाहरण का उपयोग इस उम्मीद के साथ किया है कि अन्य लोग इसकी सभी क्षमताओं का पता लगाएंगे जो मैं नहीं कर सकता। हालांकि, यह प्रदर्शित करना चाहिए कि एचटीएमएल पेज लोड और उस प्रकृति की चीजों के बिना एक आर्डिनो को नियंत्रित करने के लिए AJAX का उपयोग कैसे किया जा सकता है।

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

मेरा कोड देखने के लिए समय निकालने के लिए धन्यवाद।

जॉन एंडरसनईमेल मी

वरमोंट इंटरनेट डिजाइन एलएलसी

www.vermontinternetdesign.com