上篇我们说到通过路由去返回不同的html页面,如果每一个页面都是一个数组的话,那么我们可能需要很多数组,里面很多内容都是一样的,这样子会浪费我们单片机很多flash,我们需要把共同的部分固定出来,每个页面不同的部分才定义一个数组。
要想设计html模板,我们的先了解html的结构,更加具体的可以百度查阅。我这边把一个html大致分成一下部分:
-模板文件
0-html标准格式
1-style
2-导航
3-body
4-js
对于一个页面,其实html标准格式是不需要变化的,style,导航,body,js可能需要变化,于是我们可以设计一个标准的匹配模板:里面的%s就代表着style,导航,body,js
//模板页面
static char *page_template="\
\
\
webserver \
%s\
\
\
\
%s\
%s\
%s\
\
";
有了模板后,我们需要分别定义出style,导航,body,js ,JS还没用的,可以先不定义
//style
static char *html_style="";
//导航 static char *html_navigation="
\
\";嵌入式设备
\\ \ \ \ \ \\
//index的body
static char *html_index_body="\
\
\
\
\
\
\
\
\
\
\
\
\
\
";
//info的body
static char *html_info_body="\
信息开发中
\
";
//para的body
static char *html_para_body="\
参数开发中
\
";
//debug的body
static char *html_debug_body="\
调试开发中
\
";
//OTA的body
static char *html_ota_body="\
只能选择OTA文件
\
\
\
\
\
\
\
";
我们有了数据后,需要把数据通过模板构建成一个完整的html。先设计一个html文件缓存数组,这个数组代表着你能返回多大的页面。
static u8 html_file[4*1024]={0};
定义构建页面的函数,js部分没有定义,全部为空("")
//生成index页面
static void create_index_page()
{
memset(html_file,0,strlen((char*)html_file));
sprintf((char*)html_file,page_template,html_style,html_navigation,html_index_body,"");
}
static void create_info_page()
{
memset(html_file,0,strlen((char*)html_file));
sprintf((char*)html_file,page_template,html_style,html_navigation,html_info_body,"");
}
static void create_para_page()
{
memset(html_file,0,strlen((char*)html_file));
sprintf((char*)html_file,page_template,html_style,html_navigation,html_para_body,"");
}
static void create_debug_page()
{
memset(html_file,0,strlen((char*)html_file));
sprintf((char*)html_file,page_template,html_style,html_navigation,html_debug_body,"");
}
//生成ota页面
static void create_ota_page()
{
memset(html_file,0,strlen((char*)html_file));
sprintf((char*)html_file,page_template,html_style,html_navigation,html_ota_body,"");
}
下面就是可以通过路由反馈不同页面的,和文章1一样的效果。
if(strcmp("/ota",route)==0)
{
create_ota_page();
send_html(remote_sock,(char *)html_file);
}
if(strcmp("/",route)==0)
{
create_index_page();
send_html(remote_sock,(char *)html_file);
}
if(strcmp("/info",route)==0)
{
create_info_page();
send_html(remote_sock,(char *)html_file);
}
if(strcmp("/para",route)==0)
{
create_para_page();
send_html(remote_sock,(char *)html_file);
}
if(strcmp("/debug",route)==0)
{
create_debug_page();
send_html(remote_sock,(char *)html_file);
}
https://download.csdn.net/download/HES_C/87620599