阶段2-新手上路\项目-移动物体监控系统\Sprint4-嵌入式web服务器开发\第3课-CGI程序开发
实现CGI程序显示一幅图片最核心的功能
把上一节课编写好的led.c程序拷贝过来,并重新命名为image.c
把led的某些部分删除,后如下
那么如何显示一幅图片呢,百度(搜索在html里面去插入图片)
这是一个原始的html代码,在cgi程序中需要把它打印到cgiout里面去
以上运行的话会出错,因为cgi找的根路径不是在开发板的根路径,而是在web服务器的根路径开始,也就是从web目录开始的,那么该怎么办呢
我们可以在web目录下创建一个软链接,链接到/mnt/sd/目录下面去
所以把上面的程序调整一下
把上面的图像分辨率修改为width="160" height="120"
由于除了fprintf要求的里面的引号外,还有src="/sd/%s"这里的引号,所以这里就需要使用转义字符来处理,修改如下
然后编译这个CGI程序
再把它拷贝到我的/web/cam/下面去
然后还要去修改首页index.html代码
上面可以显示图片了!
上面显示的界面太简陋了,我希望显示出来的界面更好一些
下面把首页index.html一分为二,一个叫做top.html,另一个叫做bottom.html
top.html的效果图
bottom.html的效果图
其代码如下图
下面就需要把image.c与top.html,bottom.html给拼接起来
主要是与这行拼接起来
我只需要把top.html与bottom.html读出来然后,打印到cgiout里面
做一个函数print_file,它的第一个参数为需要把文件信息打印到何处,即cgiout,第二个参数就是要打印的文件信息。
void print_file(FILE *dst_fp, const char *src) { FILE *src_fp; char line[1024]; src_fp=fopen(src, "r");//只读方式打开 while (NULL != fgets(line, 1024, src_fp)) //把数据读到字符数组line里面来,最后结果部位NULL fputs(line, dst_fp);//最后结果不为NULL,则把数组里面的内容写到dst_fp fclose(src_fp); }
图片显示好看后的代码
现在已经实现了显示一幅图片的效果,下面要去显示我所抓取到的所有图片,
要完成以上工作,需要两步:
a、把要显示的图片的名字加到一个列表中来;
b、专门实现一个显示函数去显示这些列表中的图片。
要显示一个图片最关键的是要去知道它的名字,那么要创建的那个列表就是图片名字的列表,那么如何去获取这些文件名呢,我们应该到/mnt/sd目录里面把所有文件都遍历一遍,然后把文件名(后缀为.jpg的文件名)拷贝到列表里面去
那么我们首先要去定义一个列表,保存所有图片文件名字
struct pic_list { char name[30]; }g_img[2000];//可保存2000个文件名
见图片加入列表
下面要显示这些图片
//2.显示图片
下面加上一个跳转的按钮,去选择观看那一页的图片
对页面跳转的处理可以分为两个步骤,第一是去加上一个下拉框;第二是处理用户的选择
处理用户的选择请求
最后实现查看监控视频
怎么在一个CGI程序中嵌入视频