银川市网站建设_网站建设公司_安全防护_seo优化
2026/1/2 22:58:48 网站建设 项目流程

一、前言

在物联网开发中,让设备直接通过浏览器访问是一个非常常见的需求。ESP32 自带 WiFi,非常适合用来实现一个简单的 Web 服务器。本文将基于MicroPython,手把手教你在 ESP32 上搭建一个最基础的 HTTP Web Server,并通过浏览器访问。

适合人群:

  • ESP32 / MicroPython 初学者
  • 想快速实现网页访问 ESP32 的开发者

二、开发环境准备

1. 硬件准备

  • ESP32 开发板(任意型号)
  • USB 数据线

2. 软件准备

  • 已刷好MicroPython 固件的 ESP32
  • Thonny / uPyCraft / VS Code + MicroPython 插件
  • 可用的 WiFi 网络

⚠️ 注意:ESP32 需要刷入 MicroPython 固件,否则无法运行本文代码。


三、实现原理说明

整体流程如下:

  1. ESP32 连接 WiFi
  2. 获取 ESP32 的 IP 地址
  3. 创建 Socket 监听 80 端口
  4. 接收浏览器 HTTP 请求
  5. 返回 HTML 页面

浏览器访问 ESP32 的 IP,即可看到网页内容。


四、完整示例代码

importnetworkimportusocketassocketimporturequests# 设置 WiFi 凭据SSID="wifi名称"PASSWORD="wifi密码"# 创建 WLAN 对象wlan=network.WLAN(network.STA_IF)# 激活 WLAN 接口wlan.active(True)# 连接到 WiFi 网络wlan.connect(SSID,PASSWORD)# 等待连接完成whilenotwlan.isconnected():pass# 打印连接信息print("Connected to WiFi")print("Network config:",wlan.ifconfig())# 定义简单的 HTTP 响应HTML=""" HTTP/1.0 200 OK Content-Type: text/html <!DOCTYPE html> <html> <head><title>MicroPython Web Server</title></head> <body> <h1>Hello from MicroPython!</h1> <p>This is a simple web server running on ESP32 with MicroPython.</p> </body> </html> """# 创建套接字s=socket.socket(socket.AF_INET,socket.SOCK_STREAM)# 绑定 IP 地址和端口s.bind(('0.0.0.0',80))# 监听连接s.listen(5)# 循环接受和处理请求whileTrue:conn,addr=s.accept()print('Got a connection from %s'%str(addr))request=conn.recv(1024)print('Content = %s'%str(request))# 发送 HTTP 响应conn.sendall(HTML)conn.close()

五、代码详解

1️⃣ 连接 WiFi

wlan=network.WLAN(network.STA_IF)wlan.active(True)wlan.connect(SSID,PASSWORD)
  • STA_IF:表示工作在Station 模式(连接路由器)
  • isconnected():判断是否成功联网

2️⃣ 获取 ESP32 IP 地址

print(wlan.ifconfig())

输出格式:

(ip, subnet, gateway, dns)

记住这个 IP,后面浏览器要用。


3️⃣ 创建 Socket 服务器

s=socket.socket(socket.AF_INET,socket.SOCK_STREAM)s.bind(('0.0.0.0',80))s.listen(5)

说明:

  • 0.0.0.0:监听所有网卡
  • 80:HTTP 默认端口
  • listen(5):最多同时处理 5 个连接

4️⃣ 处理 HTTP 请求

conn,addr=s.accept()request=conn.recv(1024)conn.sendall(HTML)conn.close()
  • accept():等待浏览器连接
  • recv():接收 HTTP 请求
  • sendall():返回 HTML 页面

六、浏览器访问测试

  1. 打开串口,查看 ESP32 的 IP 地址
  2. 在同一局域网下,浏览器输入:
http://ESP32_IP

示例:

http://192.168.31.250


如果看到网页内容,说明服务器运行成功 🎉

📌原创不易,欢迎点赞 + 收藏 + 关注!

需要专业的网站建设服务?

联系我们获取免费的网站建设咨询和方案报价,让我们帮助您实现业务目标

立即咨询