กลับไปหน้ารวมไฟล์
creating-a-website-with-an-arduino-ethernet-shield-8b5ae7.md

ชื่อโปรเจกต์: การสร้างเว็บไซต์ด้วย Arduino Ethernet Shield

ด้วยการตั้งค่า port forwarding และ DNS records ที่เหมาะสม คุณก็สามารถสร้างเว็บไซต์ / webserver ที่ขับเคลื่อนด้วย Arduino ของคุณเองได้!

หน้าเว็บนี้จะมีสองปุ่มสำหรับควบคุม LED!

STEP 1 ---------------------------------------------

ทำตามแผนผังวงจร จากนั้นเชื่อมต่อสาย ethernet ด้านหนึ่งเข้ากับ router ของคุณ และเชื่อมต่อปลายอีกด้านหนึ่งเข้ากับ Ethernet Shield ของ Arduino ของคุณ

STEP 2 ---------------------------------------------

เสียบ Arduino Uno ของคุณเข้ากับคอมพิวเตอร์โดยใช้สาย USB A to USB B ที่เข้ากันได้กับ Arduino จากนั้นอัปโหลดโค้ด

STEP 3 ---------------------------------------------

เปิด Serial Monitor - เห็น IP address ไหม? จดไว้

STEP 4 ---------------------------------------------

เปิด "gateway" ของ ISP ของคุณ โดยปกติคุณสามารถค้นหาได้บน Windows ดังนี้:


  1. ค้นหา Control Panel ผ่านช่องค้นหาของ Windows
  2. คลิก Control Panel, และ Network and Internet
  3. คลิก Network and Sharing Center
  4. คลิก Ethernet, และ Details
  5. IP address จะแสดงอยู่ข้าง IPv4 Default Gateway

โดยปกติคุณสามารถค้นหาได้บน MacOS ดังนี้:


  1. เปิดเมนู Apple, และคลิก System Preferences
  2. คลิก Network, จากนั้นเลือกเครือข่ายที่คุณเชื่อมต่ออยู่
  3. คลิก Advanced, และเปิดแท็บ TCP/IP
  4. ที่อยู่ default gateway ของคุณจะปรากฏอยู่ข้าง Router

STEP 5 --------------------------------------------- (ดูภาพแรกภายใต้ "Documentation")

ไปยังกฎ port forwarding ของ "gateway" ของคุณ (วิธีการไปยังกฎ port forwarding ของคุณจะแตกต่างกันไปตาม ISP แต่ละราย) เพิ่มกฎใหม่ด้วยการตั้งค่าเหล่านี้:

NAME/SERVICE: [อะไรก็ได้]

PROTOCOL: TCP

EXTERNAL HOST: IP ของคุณ (คุณสามารถค้นหาได้โดยพิมพ์ "whats my ip" ใน search engine)

INTERNAL HOST: [IP ที่คุณจดไว้ (หวังว่าจะใช่!) ]

Internal Port และ External Port ควรเป็น 80 ทั้งคู่

คลิก confirm หรือ accept

STEP 6 --------------------------------------------- (ดูภาพที่สองภายใต้ "Documentation")

ลงทะเบียนชื่อ domain. ฉันลงทะเบียนผ่าน Google Domains ซึ่งมีราคาแตกต่างกันไป

ไปยังการตั้งค่า DNS ของ domain ของคุณ (วิธีการไปยังการตั้งค่า DNS ของคุณจะแตกต่างกันไปตามผู้ลงทะเบียน domain แต่ละราย) ในการตั้งค่า DNS ให้สร้าง A record ใหม่ ภายใต้ data ให้พิมพ์ IP address ของคุณ (คุณสามารถค้นหาได้โดยพิมพ์ "whats my ip" ใน search engine) ปล่อย host name ให้ว่างไว้ แต่ตั้งค่า TTL เป็น 3600 (หรือ 1 ชั่วโมง)

คลิก confirm หรือ accept

STEP 7 ---------------------------------------------

คุณไม่สามารถทดสอบ domain ของคุณเองได้ คุณจะต้องให้เพื่อนช่วย ขอให้พวกเขาพิมพ์ชื่อ domain ใหม่ที่คุณลงทะเบียนไว้ในช่อง address bar ของ search engine หากพวกเขาเห็นหน้าเว็บที่มี 2 ปุ่ม แสดงว่าสำเร็จ! ถ้าไม่... ลองอีกครั้ง ตรวจสอบทุกขั้นตอน จากนั้นไปที่ Google เพื่อลองแก้ไขข้อผิดพลาด

-------------------------------------------------------

ขอบคุณสำหรับการอ่าน ขอให้โชคดี!

โปรดทราบว่า Arduino Ethernet shield อาจร้อนจัดได้ ตรวจสอบให้แน่ใจว่ามีการไหลเวียนของอากาศที่เพียงพอ และพิจารณาติด heatsink ให้กับ processor หลักของมัน

รายละเอียดทางเทคนิคเพิ่มเติม

การโฮสต์ Embedded Web-Server

โปรเจกต์นี้เปลี่ยน Arduino ให้เป็น web server แบบ standalone ทำให้สามารถควบคุมฮาร์ดแวร์ได้โดยตรงผ่าน browser

  • W5100 / W5500 SPI Bridge: Ethernet Shield ทำหน้าที่หลักในการจัดการ TCP/IP stack. Arduino จะรอรับ request แบบ "GET" และ "POST" ที่เข้ามาทาง Port 80
  • HTML Content Generation: Arduino จะส่งหน้า HTML ขนาดเล็กที่เขียนด้วยมือ เมื่อผู้ใช้เข้าสู่ IP address, Arduino จะพิมพ์เนื้อหาของหน้า (ปุ่มและข้อความสถานะ) ทีละบรรทัดผ่านคำสั่ง client.println()

การโต้ตอบระยะไกล

  • Browser-to-Pin Control: โดยการคลิก hyperlink บนหน้าเว็บที่โฮสต์ (เช่น 192.168.1.1/led_on), browser จะส่ง request ที่ Arduino จะประมวลผลเพื่อสลับสถานะของ relay หรือ LED strip ทางกายภาพ

ข้อมูล Frontmatter ดั้งเดิม

title: "Creating a website with An Arduino Ethernet Shield"
description: "Using an Arduino Ethernet to create a website."
author: "arduino_projects_23"
category: "Internet of Things, BT & Wireless"
tags:
  - "Tools"
  - "Internet Of Things"
views: 1438
likes: 0
price: 2450
difficulty: "Intermediate"
components:
  - "1x Arduino Uno Rev3"
  - "1x Ethernet Shield"
  - "1x Ethernet Cable, 1.8 m"
tools: []
apps:
  - "1x Google Domains"
downloadableFiles: []
documentationLinks: []
passwordHash: "ff0f905a67e20c56bb59c75aff1879cb2a8077b563e5722aa4fd8ab48dd3861a"
encryptedPayload: "U2FsdGVkX1/R/7354gWdILLdmE1JvEUyFgpTpSLlZUP4otl6YwmTr3e8faizHhm4oX6z+gs65BWzI1zpbfyPbJSWu+6ed/8V/eusUxAlxI8="
seoDescription: "Learn how to create a simple website using an Arduino and Ethernet Shield to control devices over a network."
videoLinks: []
heroImage: "https://cdn.jsdelivr.net/gh/bigboxthailand/arduino-assets@main/images/projects/creating-a-website-with-an-arduino-ethernet-shield-8b5ae7_cover.jpg"
lang: "th"