lwip-2.1.3自带的httpd网页服务器使用教程（一）从SD卡读取网页文件并显示

概述

本教程使用的单片机是STM32F103ZE，有线网口芯片为ENC28J60。
本教程里面的网页由于需要兼容Windows XP系统的IE8浏览器，所以采用HTML 4.01编写，不使用任何前端框架。笔者使用的网页设计软件是Adobe Dreamweaver CS3。
开发板PCB文件是公开的，大家可以拿去打印出来，焊好器件后，就可以直接跑本教程提供的所有示例程序。


lwip-2.1.3在STM32F103ZE+ENC28J60有线网卡上无操作系统移植（使用STM32 HAL库）_lwip stm32f103_巨大八爪鱼的博客-CSDN博客一、概述以太网芯片简介ENC28J60是一款10Mbps速率的以太网MAC+PHY芯片，和单片机的通信接口为SPI，SPI最高时钟频率为20MHz。ENC28J60支持半双工和全双工模式，但是不支持自动协商。在支持自动协商的网络环境中，ENC28J60默认的工作模式是半双工模式。另外，STM32本身有一个ETH外设，这个外设采用的接口是MII或RMII，不是SPI，所以不能连接ENC28J60芯片，这次我们用不到这个ETH外设。STM32本身的ETH外设相当于MAC，通常要外接一个PHY芯片（_lwip stm32f103https://blog.csdn.net/ZLK1214/article/details/121419417

makefsdata程序的使用

默认情况下，lwip httpd服务器使用的网页文件来源于lwip-2.1.3/apps/http/fsdata.c。
fsdata.c是由lwip自带的makefsdata程序将lwip-2.1.3/apps/http/fs里面的所有文件打包后得到的。
lwip只提供了makefsdata程序的C语言源代码，如果想要在Windows系统上运行，需要用Visual Studio编译代码，生成exe文件，放到http目录下（也就是有fs文件夹的目录下），双击即可使用。编译的方法请参考下面这篇文章。
（本文例程里面已经放好了编译好的makefsdata程序，可直接使用，不用再自己重新编译）
在Visual Studio 2012下编译lwip-2.1.3 httpd的makefsdata_makefsdata.exe_巨大八爪鱼的博客-CSDN博客步骤一 建立空白工程新建一个工程，项目名称起名为makefsdata。因为mkfsdata是一个控制台程序，所以我们要选择Win32 Console Application。这里很重要，必须要勾选“Empty Project”选项，建立空项目：建好的解决方案目录是C:\Users\Octopus\Desktop\makefsdata，工程目录是C:\Users\Octopus\Desktop\makefsdata\makefsdata。步骤二 解压lwip-2.1.3的部分头文件和_makefsdata.exehttps://blog.csdn.net/ZLK1214/article/details/122490482双击运行makefsdata程序后，程序自动将fs文件夹下的所有内容打包成一个fsdata.c文件。每次修改完fs文件夹里面的网页文件和图片后，只需要重新运行makefsdata程序，就能打包生成新的fsdata.c文件。

STM32的Keil工程里面只需要添加fs.c和httpd.c这两个C文件，不能把fsdata.c添加到Keil工程里面去。这是因为fs.c里面用#include指令包含了fsdata.c文件。

#define HTTPD_FSDATA_FILE "fsdata.c" // httpd_opts.h
#include HTTPD_FSDATA_FILE // fs.c

fsdata.c也可以改成其他自己喜欢的名字，把扩展名改成.h都行，改名后要把新的文件名定义到lwipopts.h中（注意不是改fs.c或者httpd_opts.h）。新命名的文件同样不能添加到Keil工程中。

#define HTTPD_FSDATA_FILE "fsdata_custom.h"

fsdata.c里面以C语言数组的形式保存了fs文件夹下的所有文件，包括html文件和图片文件，以及其他类型的文件。zip、rar压缩包，还有exe文件都可以放进去，用户用浏览器访问这些非网页文件的时候，浏览器不会直接显示这些文件的内容，而是启动下载工具，把文件下载下来，让用户选择一个电脑上的文件夹保存。
当用户通过浏览器访问一个不存在的网页时，lwip会自动重定向到404.html错误页面。
Keil工程编译并烧写到STM32单片机后，最终这些网页内容是保存到STM32单片机的Flash中的。STM32单片机的Flash容量是有限的，只有几百KB~几MB，能存放的网页文件非常有限。如果网页个数非常多，非常大，Flash放不下的话，就得想其他的办法。

动态加载SD卡上的网页文件（一次性加载）

（本节例程名称：webpages_from_sdcard）
既然STM32本身的Flash放不下网页文件，那我们可以外接一个SPI Flash（如W25Q128）或者一张SD卡来保存网页文件。如果用SD卡的话，能保存的网页文件就非常多了，保存一个几百兆的压缩包供用户下载都不是问题。
存储器可以使用FAT、FAT32或者exFAT文件系统，以文件的形式存储网页文件。STM32通过FatFS读取存储器中存储的文件。
笔者是把所有的网页文件放到SD卡的www目录下，如下图所示。

要想让lwip的httpd服务器从SPI Flash或SD卡上动态加载网页文件并显示的话，需要在lwipopts.h中定义下面两个宏。

// 配置HTTPD
#define LWIP_HTTPD_CUSTOM_FILES 1
#define LWIP_HTTPD_DYNAMIC_HEADERS 1

然后我们需要自己实现下面两个接口函数。

int fs_open_custom(struct fs_file *file, const char *name);
void fs_close_custom(struct fs_file *file);

fs_open_custom函数的功能是读取指定的网页文件的内容。函数返回1表示文件读取成功，返回0表示文件读取失败。
fs_close_custom函数的功能是释放fs_open_custom函数里面分配的内存块，关闭已打开的文件。

我们新建一个webpages_test.c文件，在里面实现这两个函数。

#include <ff.h>
#include <lwip/apps/fs.h>
#include <lwip/mem.h>
#include <string.h>int fs_open_custom(struct fs_file *file, const char *name)
{char path[260];int i, size;int ret = 0;void *mem;FIL *fp;FRESULT fr;UINT br;// name为要访问的网页URL, 是相对路径, 将其转换成绝对路径snprintf(path, sizeof(path), "C:\\www%s", name);for (i = 0; path[i] != '\0'; i++){if (path[i] == '/')path[i] = '\\';}if (path[i - 1] == '\\' && sizeof(path) - i >= 10 + 1)strcat(path, "index.html");fp = mem_malloc(sizeof(FIL));if (fp != NULL){fr = f_open(fp, path, FA_READ); // 打开文件if (fr == FR_OK){size = f_size(fp); // 获取文件大小mem = mem_malloc(size);if (mem != NULL){f_read(fp, mem, size, &br); // 一次性读完整个文件file->data = mem; // 要显示的网页内容file->pextension = mem; // http连接关闭时要在fs_close_custom()函数中释放的内存块file->len = size; // 要显示的网页内容的长度file->index = size; // 要显示的网页内容的长度printf("%s(%p): %s\n", __func__, file->pextension, path);ret = 1;}f_close(fp); // 关闭文件}mem_free(fp);}// 函数返回1表示网页文件存在, 返回0表示网页文件不存在// 网页文件不存在时httpd会去加载lwip-2.1.3/apps/http/makefsdata里面的默认网页return ret;
}void fs_close_custom(struct fs_file *file)
{printf("%s(%p)\n", __func__, file->pextension);if (file->pextension != NULL){mem_free(file->pextension);file->pextension = NULL;}
}

fs_open_custom函数的name参数的值跟浏览器里面访问的网址有关。如果浏览器访问的网址是http://stm32f103ze/entertainment.html，那么name="/entertainment.html"。
在上面的程序中，将name与“C:\www”字符串拼接（C语言中字符串里面的反斜杠要双写），再把所有的正斜杠替换成反斜杠，就得到了“C:\www\entertainment.html”这个路径，打开的是SD卡www文件夹下的entertainment.html文件。如果浏览器访问的是一个文件夹，则自动在后面追加index.html，实际访问的是这个文件夹下的index.html文件。
把文件路径保存到path字符数组中，用FatFs的f_open函数以只读的方式打开网页文件，再用f_size函数获取网页文件的大小（size）。
用lwip的mem_malloc函数分配size大小的内存，接着用f_read函数把整个文件的内容一次性读取到新分配的这块内存里面。
把保存有网页内容的内存块指针mem赋给file->data，网页的大小赋给file->len和file->index这两个成员，lwip的httpd服务器就能显示SD卡上的网页了。
mem内存块会在fs_open_custom函数执行完毕后由lwip使用，所以mem内存块不能在fs_open_custom函数里面释放，那在哪里释放呢？fs_close_custom函数就是用来完成这个任务的。
我们把mem内存块的地址赋给file->pextension成员，lwip不会使用file->pextension这个成员变量，变量的值可以随便定义。
lwip发送完全部网页内容后就会调用fs_close_custom函数，在这个函数中用file->pextension访问刚才的mem内存块，用mem_free函数回收内存。

 

 

 

如果访问了sd卡上不存在的网页，则fs_open_custom函数返回0，lwip会去makefsdata的fs文件夹里面寻找，如果还是没找到，则会显示makefsdata的404.html错误页面。

这种方法是把整个网页文件一次性读取到单片机的SRAM内存中，再由lwip httpd通过网络发送给浏览器显示。
要是网页文件很大，SRAM一次性放不下，那就只有换一种分多次读取的方法了。

动态加载SD卡上的网页文件（分多次读取）

如果想要多次读取同一个网页文件，可以在lwipopts.h中定义LWIP_HTTPD_DYNAMIC_FILE_READ=1，然后实现int fs_read_custom(struct fs_file *file, char *buffer, int count)函数。

// 配置HTTPD
#define LWIP_HTTPD_CUSTOM_FILES 1
#define LWIP_HTTPD_DYNAMIC_FILE_READ 1
#define LWIP_HTTPD_DYNAMIC_HEADERS 1
#include <ff.h>
#include <lwip/apps/fs.h>
#include <lwip/mem.h>
#include <string.h>struct file_content
{FIL fil;char buffer[2500];int pos;
};int fs_open_custom(struct fs_file *file, const char *name)
{char path[260];int i, ret = 0;struct file_content *content;FRESULT fr;// name为要访问的网页URL, 是相对路径, 将其转换成绝对路径snprintf(path, sizeof(path), "C:\\public%s", name);for (i = 0; path[i] != '\0'; i++){if (path[i] == '/')path[i] = '\\';}if (path[i - 1] == '\\' && sizeof(path) - i >= 10 + 1)strcat(path, "index.html");content = mem_malloc(sizeof(struct file_content));if (content != NULL){content->pos = 0;fr = f_open(&content->fil, path, FA_READ); // 打开文件if (fr == FR_OK){// 网页文件存在file->len = sizeof(content->buffer); // 指定fs_read_custom()函数的count参数的最大值(不能设置为0)file->pextension = content; // 保存分配的内存指针, http连接关闭时才释放printf("%s(%p): %s\n", __func__, content, path);ret = 1;}else{// 网页文件不存在mem_free(content);content = NULL;}}// 函数返回1表示网页文件存在, 返回0表示网页文件不存在// 网页文件不存在时httpd会去加载lwip-2.1.3/apps/http/makefsdata里面的默认网页return ret;
}void fs_close_custom(struct fs_file *file)
{struct file_content *content = file->pextension;printf("%s(%p)\n", __func__, content);if (content != NULL){f_close(&content->fil); // 关闭文件mem_free(content); // 释放内存file->pextension = NULL;}
}int fs_read_custom(struct fs_file *file, char *buffer, int count)
{struct file_content *content = file->pextension;UINT br;// count为要读取的字节数, br为实际读取到的字节数f_read(&content->fil, buffer, count, &br);if (br == 0){// 文件读取完毕printf("%s(%p): end of file\n", __func__, content);return FS_READ_EOF;}printf("%s(%p): %d~%d\n", __func__, content, content->pos, content->pos + br - 1);content->pos += br;return br;
}

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.hqwc.cn/news/20538.html

如若内容造成侵权/违法违规/事实不符，请联系编程知识网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

运维小知识（一）——centos系统安装（小白入门级）

运维小知识（一）——centos系统安装（小白入门级）

目录 1.制作系统U盘 2.安装centos系统 3.系统配置 3.1【语言】配置​编辑 3.2【软件选择】配置 3.3【安装位置】配置 3.4【主机名、root密码、网络】配置 1.制作系统U盘 首先下载软件ventoy&#xff0c;制作系统U盘&#xff0c;买个新U盘。先在笔记本电脑安装ventoy软件&a…
阅读更多...
产品经理学习画原型（三）

产品经理学习画原型（三）

1.布尔运算的使用 合并必须选择两个及以上元件 合并后&#xff1a; 组合&#xff1a; 去除顶层&#xff1a;
阅读更多...
常用API学习01（Java）

常用API学习01（Java）

Math Math是一个帮助我们用于进行数学计算的工具类。私有化的构造方法&#xff0c;所有方法都是静态的。 Math类的常用方法&#xff1a; public static int abs(int a) 获取参数绝对值 public static double cell(double a) 向上取整 public static double floor(…
阅读更多...
全链路Python环境迁移

全链路Python环境迁移

全链路Python环境迁移 在当前的Python环境中&#xff0c;安装一些库以后&#xff0c;如果换了一套Python环境&#xff0c;难道再来一次不停的pip install&#xff1f;当然不是。 第一步&#xff0c;使用pip freeze&#xff08;冻结&#xff09;备份当前Python库的环境 pip f…
阅读更多...
linux 服务器之间传输文件的方式

linux 服务器之间传输文件的方式

情景&#xff1a;有时迁移项目&#xff0c;一般人就想到需要在服务器下载到win本地电脑上面&#xff0c;再上传到目的服务器&#xff0c;这样若是文件大&#xff0c;下载的速度都足够让你歇一天了。遇到这问题&#xff0c;怎么解决呢&#xff1f; 方法1&#xff1a;scp 【优点…
阅读更多...
《向量数据库指南》——传统数据库上的向量搜索插件

《向量数据库指南》——传统数据库上的向量搜索插件

传统数据库上的向量搜索插件 很好，现在我们已经知道了向量搜索库和向量数据库之间的区别，下面让我们来看看向量数据库与向量搜索插件有何不同。 很多传统关系型数据库和搜索系统，如 ClickHouse 和 Elasticsearch，都包含内置的向量搜索插件。例如，Elasticsearch 8.0 包…
阅读更多...
智慧班牌源码，融合人脸识别、即时通讯等技术，与智慧校园中各类系统互联互通

智慧班牌源码，融合人脸识别、即时通讯等技术，与智慧校园中各类系统互联互通

电子班牌系统又称之为智慧班牌&#xff0c;是当前校园数字化信息化建设、文化建设的主流&#xff0c;是校园日常工作安排、校园信息发布、班级文化风采展示、课堂交流的重要应用载体。智慧班牌系统在传统信息发布和校园文化展示功能基础上&#xff0c;融合了人脸识别、即时通讯…
阅读更多...
前端Vue自定义加载loading组件 通过设置gif实现loading动画 可用于页面请求前loading

前端Vue自定义加载loading组件 通过设置gif实现loading动画 可用于页面请求前loading

随着技术的发展&#xff0c;开发的复杂度也越来越高&#xff0c;传统开发方式将一个系统做成了整块应用&#xff0c;经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改&#xff0c;造成牵一发而动全身。 通过组件化开发&#xff0c;可以有效实现…
阅读更多...
NAS私有云存储 - 搭建Nextcloud私有云盘并公网远程访问

NAS私有云存储 - 搭建Nextcloud私有云盘并公网远程访问

文章目录 摘要视频教程1. 环境搭建2. 测试局域网访问3. 内网穿透3.1 ubuntu本地安装cpolar3.2 创建隧道3.3 测试公网访问 4 配置固定http公网地址4.1 保留一个二级子域名4.1 配置固定二级子域名4.3 测试访问公网固定二级子域名 摘要 Nextcloud,它是ownCloud的一个分支,是一个文…
阅读更多...
今日分享——语音同声翻译软件

今日分享——语音同声翻译软件

安娜和卡洛是一对在旅行时偶遇的年轻男女&#xff0c;他们互有好感&#xff0c;但他们来自不同的国家&#xff0c;说着不同的语言。每次面对彼此的时候&#xff0c;他们总是陷入语言的困扰&#xff0c;无法用自己熟悉的语言表达内心的情感。因此他俩都十分需要一款翻译语音的软…
阅读更多...
使用STM32 再实现感应开关盖垃圾桶

使用STM32 再实现感应开关盖垃圾桶

硬件介绍 SG90舵机 如上图所示的舵机SG90&#xff0c;橙线对应PWM信号&#xff0c;而PWM波的频率不能太高&#xff0c;大约50Hz&#xff0c;即周期0.02s&#xff0c;20ms左右。 在20ms的周期内&#xff0c;高电平占多少秒和舵机转到多少度的关系如下&#xff1a; 0.5ms-----0度…
阅读更多...
软件进行压力测试的主要目的

软件进行压力测试的主要目的

软件进行压力测试是指通过模拟大量用户访问和负载压力&#xff0c;在正常和峰值使用情况下对软件系统进行测试的过程。软件进行压力测试的主要目的是确保软件在实际应用中能够稳定、可靠地运行&#xff0c;满足用户的需求。 首先&#xff0c;软件进行压力测试的主要目的是评估系…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023