扫码关注官方微信

扫码下载APP
返回顶部
首页 > 资讯 > 服务器 >ESP32构建简单WebServer服务器
  • 122

0
分享到

ESP32构建简单WebServer服务器

服务器githubjavaesp32arduino 2023-08-30 22:08:05 122人浏览 薄情痞子
摘要

目录 WebServer 服务器ESP32 filesystem uploaderWebServer 库WIFI 链接网页与代码烧录 WEBServer 服务器 此案

目录

WEBServer 服务器

此案例中，我们将创建一个最简单的 webserver 服务器

案例实现：ESP32 通过 SPIFFS 上传网页文件并保存，之后手机开启热点，ESP32 连接到该热点；与手机处于同一热点下的任何一个设备（下面用电脑演示）都可以通过 ESP32 反馈的内网地址访问其构建的网页！


ESP32 filesystem uploader

SPIFFS 是一种嵌入式文件管理系统
arduino 已经集成了对应库，但是依然需要我们下载另一个库来实现文件上传的功能

下载 ESP32 filesystem uploader
https://GitHub.com/me-no-dev/arduino-esp32fs-plugin

注意我们需要下载的是 jar 文件，即编译过后的，具体下载地址在上方 github 页面的 readme 里面有

下载对应的 ZIP 包后，直接解压到 arduino 根目录下的 tools 文件夹内即可（如下图所示）

在这里插入图片描述


重启 arduino，新建一个项目，项目内容保持为空

依次点击 工具->ESP Sketch Data Upload

在这里插入图片描述

由于我们是第一次使用 SPIFFS，需要进行初始化，弹出窗口点击 yes 即可

等待一段时间，当 arduino 下方输出框停止输出后，就会在当前项目目录下创建一个 data 文件夹

该文件夹存放网页文件，下次直接按照此方法再次运行 ESP Sketch Data Upload 即可上传文件到 ESP32 的 SPIFFS 里面了！


WebServer 库

此时需要外部的 webserver 库支持，下载下面这两个库

Asynctcp Https://github.com/me-no-dev/AsyncTCP
ESPAsyncWebServer https://github.com/me-no-dev/ESPAsyncWebServer

依次点击 项目->加载库->加载 ZIP 库

选择我们下载完毕的两个库的 ZIP 压缩包，arduino 即可自动安装！

在这里插入图片描述


WIFI 链接

此时开启我们的手机热点

我的热点设置是
热点名称（SSID）：zhiller
热点密码：pp12345678

故得出以下代码

#include #include #include "ESPAsyncWebServer.h"// 设置ESP32服务器运行于80端口AsyncWebServer server(80);//连接WIFIvoid connect_wifi(){  // WIFI名称以及对应密码  const char* wifi_ssid = "zhiller";  const char* wifi_passWord = "pp12345678";  // 设置串口波特率，以便通过串口监视器观察输出  Serial.begin(115200);  WiFi.begin(wifi_ssid, wifi_password);         //连接WIFI  Serial.print("正在连接WIFI");  //循环请求，直到连接成功  while(WiFi.status() != WL_CONNECTED){    Serial.print(".");    delay(500);  }  Serial.println();  IPAddress local_IP = WiFi.localIP();  Serial.print("WIFI链接成功，此为IP:"); //连接成功提示  Serial.println(local_IP);}// 开启webserver，挂载网页index.htmlvoid web_server(){ if(!SPIFFS.begin(true)){    Serial.println("SPIFFS发生错误");    return;  }  server.serveStatic("/", SPIFFS, "/").setDefaultFile("index.html");  server.begin();                       //初始化}void setup() {  connect_wifi();  web_server();}void loop() {}

网页与代码烧录

随便写一个网页

代码清单 index.html

DOCTYPE html><html><head><meta charset="utf-8" /><linkrel="stylesheet"type="text/CSS"href="style.css"/><title>测试网站title>head><body><h1>测试网站h1><p>测试测试测试p>body>html>

保存该网页到项目目录下的 data 文件夹

之后回到 arduino，依次执行 工具->ESP Sketch Data Upload 上传网页文件
（此时必须要保证串口监视器是关闭状态，否则上传必定失败）

上传完毕后，先打开串口监视器（提前调节波特率到 115200），然后才开始上传代码

我们通过串口监视器可以观察到正在连接 WIFI，并且在连接到 WIFI 后，出现 ESP32 搭设的 webserver 的内网 IP

在这里插入图片描述

之后将电脑连接到手机热点

电脑上访问对应的 IP+端口，如 192.168.43.141:80
此时即可浏览到对应的网页 index.html 啦


来源地址：https://blog.csdn.net/delete_you/article/details/131147834

--结束END--

本文标题: ESP32构建简单WebServer服务器

本文链接: https://lsjlt.com/news/383889.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • ESP32构建简单WebServer服务器
    目录 WebServer 服务器ESP32 filesystem uploaderWebServer 库WIFI 链接网页与代码烧录 WebServer 服务器 此案...
    99+
    2023-08-30
    服务器 github java esp32 arduino
  • VScode+ESP32简单环境搭建
    目录第一步：准备1.软件部分2.ESP部分第二步：安装第三步：VS Code配置第四步：运行 Hello Word第一步：准备 1.软件部分 VS Code 下载 : https:/...
    99+
    2024-04-02
  • WebServer项目(四)-＞(基于Proactor的c++)Web服务器简介及简单实现
    基于Proactor的c++Web服务器项目 WebServer项目(四)-＞(基于Proactor的c++)Web服务器简介及简单实现1.Web Server（网页服务器）2.HTTP协议(...
    99+
    2023-09-20
    服务器 c++ 网络 linux 后端
  • C++——WebServer服务器项目
    项目场景： C++——WebServer服务器编程 项目搭建 （1）配置虚拟机，下载XShell、Xftp以及windows版本的VScode； （2）安装SSH： sudo apt install...
    99+
    2023-09-03
    web 服务器 linux 网络 websocket
  • java代码构建简单http服务器和客户端
    初识http a、超文本传输 、应用层的面向对象的协议，概念介绍网上资源一大堆，关键是基于TCP/IP通信协议来传递数据。 b、一开始接触web项目，都是先接触的servlet，tomcat服务器默认实现的一套http规范，提供了基础服务和...
    99+
    2023-09-30
    java 服务器 http 开发语言 前端
  • 如何使用Node.js构建一个简单Web服务器
    Node.js是一个用于后端服务的JavaScript运行环境，它允许开发者使用同一种语言编写服务器端和客户端应用程序。与其他后端技术相比，Node.js具有更高的处理能力和更好的可扩展性。在这篇文章中，我们将介绍如何使用Node.js构建...
    99+
    2023-05-14
  • 怎么使用Flask构建简单的RESTful服务
    本篇文章给大家分享的是有关怎么使用Flask构建简单的RESTful服务，小编觉得挺实用的，因此分享给大家学习，希望大家阅读完这篇文章后可以有所收获，话不多说，跟着小编一起来看看吧。    我们现在的...
    99+
    2023-06-05
  • 使用NODE.JS创建一个WEBSERVER(服务器)的步骤
    目录什么是 nodejs 安装nodejs 如何使用node创建hello world？ 如何使用nodejs读写文件使用nodejs创建web服务器如何根据不同的请求路径返回不同数...
    99+
    2024-04-02
  • docker搭建NFS服务器（超简单)
    docker 安装 NFS服务端与客户端 一：服务端： 下载镜像到本地。 地址：https://www.aliyundrive.com/s/LUQ4A4yuZcY 启动镜像 解压镜像 docker ...
    99+
    2023-10-06
    docker 服务器 运维
  • 用 Node.js 构建 HTTP 服务器：简单易懂的初学者秘籍
    Node.js 是一个强大的 JavaScript 运行时环境，非常适合构建实时、高性能的网络应用程序。本文将指导你使用 Node.js 构建一个简单的 HTTP 服务器，以便你深入了解这项技术。 服务器模块导入 首先，你需要导入 Nod...
    99+
    2024-04-02
  • NodeJS创建最简单的HTTP服务器
    ☆ 引子 var http = require('http'); http.createServer(function(request, response){ response.writeHead...
    99+
    2022-06-04
    最简单 服务器 NodeJS
  • 简单搭建一个直播服务器
    要搭建一个简单的直播服务器，可以按照以下步骤进行操作：1. 选择合适的直播服务器软件：常用的直播服务器软件有NGINX-RTMP、F...
    99+
    2023-09-20
    服务器
  • centos搭建简单自用syslog服务器
    安装rsyslog软件（rsyslog是syslogd的升级版） yum install -y  rsyslog 配置rsyslog.conf文件  vi /etc/rsyslog.conf （1）打开tcp和udp接收和配置端...
    99+
    2023-09-20
    服务器 centos linux
  • node.js怎么搭建简单web服务器
    今天小编给大家分享一下node.js怎么搭建简单web服务器的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我们一...
    99+
    2022-12-01
    node.js web服务器
  • Docker构建文件Dockerfile简单入门
    1.Dockerfile介绍 在之前Docker的使用中，我们直接从仓库下载需要的镜像到本地，然后稍加配置就可以应用了，通常从仓库下载下来的镜像都是通用的，无任何私有化的东西，我们拿...
    99+
    2024-04-02
  • 简单聊聊C#字符串构建利器StringBuilder
    目录前言简单示例源码探究构造入手无参构造带参数的构造构造小结核心方法转换成字符串对比java实现总结前言 在日常的开发中StringBuilder大家肯定都有用过，甚至用的很多。毕竟...
    99+
    2024-04-02
  • 搭建简单的nodejs http服务器详解
    搭建简单的nodejs服务器 通过一些简单配置我们就可以搭建一台基于nodejs的http服务器 通过switch配置url路由的方法 // 这是一个简单的Node HTTP服务器,能处理当前目录的文件...
    99+
    2022-06-04
    详解 简单 服务器
  • Nginx如何搭建简单直播服务器
    Nginx如何搭建简单直播服务器，相信很多没有经验的人对此束手无策，为此本文总结了问题出现的原因和解决方法，通过这篇文章希望你能解决这个问题。 前言使用 Nginx + Nginx-rtmp-module 在Ubuntu 中搭建简...
    99+
    2023-06-15
  • 最简单的云服务器怎么搭建
    搭建最简单的云服务器可以参考以下步骤：1.选择云服务提供商：根据需求选择一家云服务提供商。2.注册账号：在选定的云服务提供商网站上注...
    99+
    2023-09-27
    云服务器
  • 用Python建立最简单的web服务器
    第一个python Web程序——简单的Web服务器。 与其它Web后端语言不同，Python语言需要自己编写Web服务器。 如果你使用一些现有的框架的话，可以省略这一步； 如果你使用Python CGI编程的话，也可以省略这一步...
    99+
    2023-01-31
    最简单 服务器 Python
软考高级职称资格查询
热门wiki
近期文章
推荐阅读
热门问答
热门标签
编程网，编程工程师的家园，是目前国内优秀的开源技术社区之一，形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容，为IT开发者提供了一个发现、使用、并交流开源技术的平台。

  • 官方手机版

  • 微信公众号

  • 商务合作