ESP8266 ওয়েব সার্ভার ব্যবহার করে 7-সেগমেন্ট LED ডিসপ্লে নিয়ন্ত্রণ করা: 8 টি ধাপ (ছবি সহ)

2024 লেখক: John Day | [email protected]. সর্বশেষ পরিবর্তিত: 2024-01-30 08:01

আমার প্রজেক্টের একটি Nodemcu ESP8266 আছে যা html ফর্ম ব্যবহার করে http সার্ভারের মাধ্যমে 7-সেগমেন্ট ডিসপ্লে নিয়ন্ত্রণ করছে।

ধাপ 1: এই প্রকল্প সম্পর্কে

এটি একটি IOT প্রকল্প যা ESP8266 (NodeMCU) ওয়াইফাই মডিউল ব্যবহার করে তৈরি করা হয়েছে। প্রকল্পের উদ্দেশ্য হল মডিউলে একটি ওয়েব সার্ভার তৈরি করা যা নেটওয়ার্কে একাধিক ক্লায়েন্টকে হোস্ট করতে পারে। এখানে, আমার প্রকল্পটি বোঝার জন্য এইচটিএমএল এবং জাভাস্ক্রিপ্টের প্রাথমিক জ্ঞান প্রয়োজন। ESP8266 এবং জাভাস্ক্রিপ্ট সম্পর্কিত কিছু অগ্রিম বিষয় আমি এখানে আলোচনা করব:

1. আমাদের arduino কোডে সেই ফাইলগুলিকে আরও দক্ষতার সাথে ব্যবহার করার জন্য ESP8266 এর SPIFFS এ ফাইল আপলোড করা।

2. জাভাস্ক্রিপ্ট ব্যবহার করে ওয়েব স্টোরেজ

SPIFFS

এখন পর্যন্ত, আমরা সবসময় আমাদের ওয়েব পেইজের HTML কে আমাদের স্কেচে স্ট্রিং লিটারেল হিসেবে অন্তর্ভুক্ত করেছি। এটি আমাদের কোডটি পড়তে খুব কঠিন করে তোলে এবং আপনার স্মৃতিশক্তি দ্রুত শেষ হয়ে যাবে।

SPIFFS একটি SPI ফ্ল্যাশ চিপ সহ মাইক্রোকন্ট্রোলারের জন্য একটি হালকা ওজনের ফাইল সিস্টেম। ESP8266 এর অন-বোর্ড ফ্ল্যাশ চিপে আপনার ওয়েবপেজগুলির জন্য প্রচুর জায়গা রয়েছে, বিশেষ করে যদি আপনার 1MB, 2MB বা 4MB সংস্করণ থাকে। SPIFFS- এ ফাইল আপলোড করার জন্য আপনার arduino সফটওয়্যারে কীভাবে টুলস যোগ করতে হয় তা আপনি নিম্নলিখিত লিঙ্ক দ্বারা বুঝতে পারেন:

এই প্রকল্পে, আমার 2 টি এইচটিএমএল ফাইল এবং একটি জাভাস্ক্রিপ্ট ফাইল আছে। এই সমস্ত ফাইলগুলি স্কেচ থেকে পৃথক SPIFFS এ আপলোড করা হয় যাতে এই ফাইলগুলির পরিবর্তন মূল স্কেচ থেকে স্বাধীন হয়।

এইচটিএমএল ফাইল উভয়ই প্রস্তুতকৃত ফাইল () দ্বারা পুনরুদ্ধার করা হয়েছে যেমনটি নীচে দেখানো হয়েছে:

অকার্যকর প্রস্তুতি ফাইল () {

bool ok = SPIFFS.begin (); যদি (ঠিক আছে) {File f = SPIFFS.open ("/index.html", "r"); ফাইল f1 = SPIFFS.open ("/index1.html", "r"); ডেটা = f.readString (); data1 = f1.readString (); f.close (); f1. বন্ধ (); } অন্যথায় Serial.println ("এমন কোন ফাইল পাওয়া যায়নি।"); }

যখন জাভাস্ক্রিপ্ট ফাইলটি লোডস্ক্রিপ্ট () ব্যবহার করে পড়া হয় নীচে দেখানো হয়েছে:

অকার্যকর লোডস্ক্রিপ্ট (স্ট্রিং পাথ, স্ট্রিং টাইপ) {

যদি (SPIFFS.exists (path)) {File file = SPIFFS.open (path, "r"); server.streamFile (ফাইল, টাইপ); }}

ওয়েব অ্যাপ্লিকেশনের জন্য স্থানীয় স্টোরেজ

এইচটিএমএল 5 -তে স্থানীয় স্টোরেজের বিভিন্ন বস্তু এবং পদ্ধতিগুলি কীভাবে ব্যবহার করতে হয় তা আপনি নিম্নলিখিত নিবন্ধ থেকে জাভাস্ক্রিপ্ট ব্যবহার করে বুঝতে পারেন: https://diveintohtml5.info/storage.html। আমি ওয়ার্কিং সেকশনে আমার প্রজেক্টে লোকাল স্টোরেজের ব্যবহার নিয়ে আলোচনা করব।

পদক্ষেপ 2: হার্ডওয়্যার প্রয়োজন

NodeMCU ESP8266 12E Wifi মডিউল

Solderless breadboard

জাম্পার তার

7 Segent প্রদর্শন (সাধারণ ক্যাথোড)

1K ওহম প্রতিরোধক

মাইক্রো-ইউএসবি কেবল (আপনার কম্পিউটারের সাথে নোডএমসিইউ সংযোগের জন্য)

ধাপ 3: সার্কিট এবং সংযোগ

সংযোগগুলি সত্যিই সহজ। উপরের সার্কিট ডায়াগ্রামে, নোডেমকুর পিনগুলি নিম্নলিখিত ফ্যাশনে সংযুক্ত:

একটি D1

বি D2

সি ডি 3

D D4

ই D6

এফ ডি 7

জি ডি 8

যেখানে A, B, C, D, E & F হল 7 সেগমেন্ট ডিসপ্লের সেগমেন্ট

। 7 সেগমেন্ট ডিসপ্লের ডিপি উপেক্ষা করুন। এটি ESP এর পিন D5 এর সাথে সংযুক্ত করবেন না

ধাপ 4: কাজ

আগে আলোচনা করা হয়েছে, আমাদের দুটি html ফাইল আছে। যার মধ্যে একটি হল রুট এইচটিএমএল পেজ যাকে বলা হয় যখন ESP8266 সার্ভার "/" অর্থাৎ ইউআরআই '/' রিকোয়েস্ট করা হলে সার্ভারের 200 (HTTP) স্ট্যাটাস কোড দিয়ে উত্তর দিতে হবে এবং তারপর "ইনডেক্স" দিয়ে একটি প্রতিক্রিয়া পাঠাতে হবে। html "ফাইল।

ফর্মটিতে একটি ইনপুট জমা দিয়ে রুট পেজ থেকে ক্লায়েন্ট অনুরোধ করলে দ্বিতীয় এইচটিএমএল ফাইল পাঠানো হবে। যত তাড়াতাড়ি, সার্ভার ফর্ম থেকে পোস্ট ইনপুট পায়, এটি এটি নির্দিষ্ট স্ট্রিং মানের সাথে তুলনা করে এবং প্রতিক্রিয়া হিসাবে দ্বিতীয় HTML পৃষ্ঠা পাঠায়।

যদি (server.arg ("nam") == "0") {server.send (200, "text/html", data1); সাত সেগ (0); }

যেহেতু দ্বিতীয় পৃষ্ঠার জন্য এইচটিএমএল স্কেচে সংজ্ঞায়িত করা হয়নি, তাই এখানে আমরা "ডেটা 1" উল্লেখ করছি যা ইতিমধ্যেই SPIFFS.readString () ব্যবহার করে এইচটিএমএল কোডগুলি পড়ে আছে

ফাইল f1 = SPIFFS.open ("/index1.html", "r"); data1 = f1.readString ();

এখানে SevenSeg () কে "0" যুক্তি দিয়েও ডাকা হয় যাতে এটি বিভিন্ন সেগমেন্ট চালু এবং বন্ধ করে "0" প্রদর্শন করতে ব্যবহার করা যায়। এখানে, আমি ফাকশনের নাম স্ব -ব্যাখ্যামূলক করেছি যেমন onA () রুটিবোর্ডে 7 সেগ ডিসপ্লের A সেগমেন্ট চালু করবে, একইভাবে অফএ এটি বন্ধ করবে।

সুতরাং, এই ক্ষেত্রে "0" প্রদর্শন করার জন্য, আমাদের G ছাড়া সব সেগমেন্ট পরিবর্তন করতে হবে (DP উপেক্ষা করা হয়েছে কারণ এটি ESP8266 এর কোন পিনের সাথে সংযুক্ত নয়)। সুতরাং আমার ফাংশন এর মত দেখাচ্ছে:

যদি (num == 0) {onA (); onB (); onC (); onD (); এক(); onF (); offG (); }

ধাপ 5: HTML এবং জাভাস্ক্রিপ্ট কোড

Index.html এর একটি ক্যানভাস আছে যার 7 টি সেগমেন্ট ডিসপ্লে অফ মোডে আছে এবং এর নিচে ফর্ম আছে। এটি খোলার পরে আপনি যা দেখতে পাবেন:

যদি আমরা আমাদের ওয়েবপৃষ্ঠাটি ESP8266 ছাড়া ব্যবহার করতে চাই, তাহলে আপনার ফর্মের অ্যাকশন অ্যাট্রিবিউটের লিঙ্ক পরিবর্তন করে এটি সম্ভব হবে।

এখানে আপনি দেখতে পাচ্ছেন যে লিংকটি একই আইপি ঠিকানা যা আপনার নোড এমসিইউতে বরাদ্দ করা হয়েছে যে কোনও ওয়াইফাই (বা হটস্পট) এর সাথে সংযোগ করার পরে। সামঞ্জস্যের পরে ফর্ম ট্যাগটি দেখতে এরকম:

এখানে, আমি ব্যবহারকারীর ইনপুট মান সংরক্ষণ করতে ব্রাউজারের ওয়েব স্ট্রজ ব্যবহার করছি যাতে index.html এ প্রবেশ করা মানটি ব্রাউজারে স্থানীয়ভাবে সংরক্ষণ করা হয় (যেমন কুকি)। এই মানটি index1.html দ্বারা আনা হয় এবং html ক্যানভাসে 7 সেগমেন্ট ডিসপ্লেতে সংখ্যা প্রদর্শিত হয়। আপনি ভিডিওটি অনুসরণ করে এই পদ্ধতিটি বুঝতে পারেন:

video_attach

ধাপ 6: মূল নোট

আপনি যদি নিম্নলিখিত বিষয়গুলির যত্ন নেন তবে এই প্রকল্পটি আপনার নোডেমকুর সাথে কাজ করবে:

1. রুট এইচটিএমএল ফাইলের অ্যাকশন অ্যাট্রিবিউটের লিঙ্কটি "https:// (সিরিয়াল মনিটরের আইপি বা আপনার ইএসপিতে বরাদ্দকৃত আইপি)/জমা দিতে হবে"।

2. ব্রাউজারের সর্বশেষ সংস্করণ ব্যবহার করুন যা HTML5 এবং নতুন ট্যাগ এবং কার্যকারিতা সমর্থন করে।

3. SPIFFS তখনই কাজ করবে যদি আপনার index.html, index1.html এবং main.js ডেটা ফোল্ডারে একসাথে রাখা হয়। আপনি আমার github থেকে কোড ফাইল ক্লোন করতে পারেন

ধাপ 7: কোড

এটি আমার প্রকল্পের কোডের সংগ্রহস্থল লিঙ্ক। আপনি যদি ESP8266 এ SPIFFS- এর সাথে কাজ করছেন, তাহলে আপনি বুঝতে পারবেন কেন আমি ডাটা ফোল্ডারে html এবং জাভাস্ক্রিপ্ট ফাইল রেখেছি।

গিটহাব রিপোজিটরি লিংক

ধাপ 8: ভিডিও টিউটোরিয়াল

যদি এটি সাহায্য করে, দয়া করে সাবস্ক্রাইব করুন