ESP32-Web-Server编程-在网页中插入图片

ESP32-Web-Server编程-在网页中插入图片

概述

图胜与言，在网页端显示含义清晰的图片，可以使得内容更容易理解。

需求及功能解析

本节演示在 ESP32 Web 服务器上插入若干图片。在插入图片时还可以对图片设置一个超链接，用户点击该图片时，网页将跳转到图片对应的链接网址。

示例解析

• 目录结构

  ├── CMakeLists.txt
  ├── main
  │   ├── CMakeLists.txt
  │   └── main.c                 User application
  ├── components
  │   └── fs_image
  └── README.md                  This is the file you are currently reading
  

  • 目录结构主要包含主目录 main，以及组件目录 components.
  • 其中组件目录components中包含了用于存储网页文件的 fs_image 目录。

前端代码

前端代码设置了插入图片的文件名，并设置 snow.png 图片的超链接：