《Linux网络开发必学教程》29_动态创建交互页面

头像
TianSong
     江苏
    阅读 7 分钟
    问题：如何创建浏览器中的文件展示页面？

    再论前端页面

    image.png

    交互页面分析

    • 静态部分

      • 表格，页面结构

    • 动态部分

      • 文件浏览路径 (Path)
      • 文件列表（Table）
    "<!DOCTYPE html>"
"<html>"
"    <head>"
"    <meta charset=\"utf-8\">"
"    <title>D.T.Software</title>"
"    <head>"
"    <body>"
"    <h1>DT4SW Http File Server</h1>"
"    <hr/>"
"    <h3>Path: %s</h3>"
"    %s"
"    <body>"
"<html>"

    文件列表分析

    • 静态

      • 表格标题行
      • 表格列表结构

    • 动态部分

      • 表格行数据
    "<table border=\"1\" width=\"100%\">";
"    <tr>"
"        <th>File Name</th><th>File Type</th><th>File Size</th><th>Modify Time</th>"
"    </tr>"
"        <td><a href=\"%s\">%s</a></td><td>%s</td><td>%s</td><td>%s</td>"
"    </tr>"
"</table>"

    文件列表接口函数及数据结构

    • Table *CreateTable();
    • Table *InsertRow(Table *table, RowInfo *info);
    • char *ToTableString(Table *table);
    • void FreeTable(Table *table);
    typedef void Table;
typedef struct {
    char link[2048];
    char name[255];
    char type[32];
    char size[32];
    char time[32];
}RowInfo;

    解决方案

    • CreateTable()

      • 从堆空间创建表格标题行，并作为初始表格数据返回

    • InsertRow(table, info)

      • 将 info 中的字符串进行表格行格式化，并添加到 table 末尾

    • ToTableString(table)

      • 将 table 表格数据格式化为 HTML 字符串，并返回

    表格动态创建关键代码

    if (table && info) {
    char *t = table;
    int len = strlen(t);
    char *buf = malloc(strlen(ROW_FORMAT) + sizeof(*info));
    if (buf) {
        sprintf(buf, ROW_FORMAT, info->link, info->name, info->type, info->size, info->time);
        ret = realloc(t, len + strlen(buf) + 1);
        ret = ret ? (strcpy(ret + len, buf), ret) : t;
    } else {
        ret = t;
    }
    free(buf);
}

    页面动态创建代码

    char *ToPageString(const char *path, char *ts)
{
    char *ret = NULL;

    if (path && ts && (ret = malloc(strlen(PAGE_FORMAT) + strlen(path) + strlen(ts) + 1))) {
        sprintf(ret, PAGE_FORMAT, path, ts);
    }

    return ret;
}

    编程实验：动态创建交互页面

    main.c

    #include<stdio.h>
#include<stdlib.h>
#include<unistd.h>
#include<pthread.h>
#include <sys/types.h>
#include <dirent.h>
#include <sys/stat.h>
#include <time.h>
#include <fcntl.h>
#include <string.h>

#include "tcp_server.h"
#include "tcp_client.h" 
#include "utility.h"
#include "page.h"

int main(int argc, char *argv[])
{
    Table *t = CreateTable();
    RowInfo ri = {"aa", "bbb", "cccc", "ddddd", "eeeeee"};
    RowInfo rj = {"11", "222", "3333", "44444", "555555"};

    t = InsertRow(t, &ri);
    t = InsertRow(t, &rj);

    char *ts = ToTableString(t);
    char *page = ToPageString("test/path/folder", ts);

    printf("%s\n", page);

    free(page);
    free(ts);
    FreeTable(t);

    return 0;
}

    page.h

    #ifndef PAGE_H
#define PAGE_H

typedef void Table;

typedef struct
{
    char link[2048];
    char name[255];
    char type[32];
    char size[32];
    char time[32];
} RowInfo;

char* ToPageString(const char* path, const char* ts);
Table* CreateTable();
Table* InsertRow(Table* table, RowInfo* info);
char* ToTableString(Table* table);
void FreeTable(Table* table);

#endif  // PAGE_H

    page.c

    #include "page.h"

#include <stdlib.h>
#include <string.h>
#include <stdio.h>

static const char* PAGE_FORMAT = "<!DOCTYPE html>"
                                 "<html>"
                                 "  <head>"
                                 "    <meta charset=\"utf-8\">"
                                 "    <title>D.T.Software</title>"
                                 "  </head>"
                                 "  <body>"
                                 "    <h1>DT4SW Http File Server</h1>"
                                 "    <hr/>"
                                 "    <h3>Path: %s</h3>"
                                 "    %s"
                                 "  </body>"
                                 "</html>";

static const char* TABLE_BEGIN = "<table border=\"1\" width=\"100%\">";
                                                                  
static const char* TABLE_TITLE = "  <tr>"
                                 "    <th>File Name</th><th>File Type</th><th>File Size</th><th>Modify Time</th>"
                                 "  </tr>";
                                
static const char* ROW_FORMAT =  "<tr>"
                                 "  <td><a href=\"%s\">%s</a></td><td>%s</td><td>%s</td><td>%s</td>"
                                 "</tr>";     
                                
static const char* TABLE_END =   "  </tr>"
                                 "</table>";  

char *ToPageString(const char *path, const char *ts)
{
    char *ret = NULL;

    if (path && ts && (ret = malloc(strlen(PAGE_FORMAT) + strlen(path) + strlen(ts) + 1))) {
        sprintf(ret, PAGE_FORMAT, path, ts);
    }

    return ret;
}

Table *CreateTable()
{
    const int TITLE_LEN = strlen(TABLE_TITLE);
    char *ret = malloc(TITLE_LEN + 1);

    if (ret) {
        strcpy(ret, TABLE_TITLE);
    }

    return ret;
}

char *ToTableString(Table *table)
{
    const int BEGIN_LEN = strlen(TABLE_BEGIN);
    const int END_LEN = strlen(TABLE_END);
    char *ret = NULL;

    if (table && (ret = malloc(strlen(table) + BEGIN_LEN + END_LEN + 1))) {
        strcpy(ret, TABLE_BEGIN);
        strcpy(ret + BEGIN_LEN, table);
        strcpy(ret  + BEGIN_LEN + strlen(table), TABLE_END);
    }

    return ret;
}

Table *InsertRow(Table *table, RowInfo *info)
{
    char *ret = NULL;

    if (table && info) {
        char *t = table;
        int len = strlen(t);
        char *buf = malloc(strlen(ROW_FORMAT) + sizeof(*info));
        if (buf) {
            sprintf(buf, ROW_FORMAT, info->link, info->name, info->type, info->size, info->time);
            ret = realloc(t, len + strlen(buf) + 1);
            ret = ret ? (strcpy(ret + len, buf), ret) : t;
        } else {
            ret = t;
        }
        free(buf);
    }

    return ret;
}

void FreeTable(Table *table)
{
    free(table);
}
    输出
    <!DOCTYPE html><html>  <head>    <meta charset="utf-8">    <title>D.T.Software</title>  </head>  <body>    <h1>DT4SW Http File Server</h1>    <hr/>    <h3>Path: test/path/folder</h3>    <table border="1" width="100%">  <tr>    <th>File Name</th><th>File Type</th><th>File Size</th><th>Modify Time</th>  </tr><tr>  <td><a href="aa">bbb</a></td><td>cccc</td><td>ddddd</td><td>eeeeee</td></tr><tr>  <td><a href="11">222</a></td><td>3333</td><td>44444</td><td>555555</td></tr>  </tr></table>  </body></html>

    image.png

    思考

    浏览器于文件服务器如何交互？
    clinux网络编程
    TianSong
    734 声望138 粉丝

    阿里山神木的种子在3000年前已经埋下，今天不过是看到当年注定的结果，为了未来的自己，今天就埋下一颗好种子吧

    « 上一篇
    《Linux网络开发必学教程》28_浏览器请求响应实现
    下一篇 »
    《Linux网络开发必学教程》30_文件浏览交互涉及

    引用和评论

    推荐阅读
    头像
    《Linux系统编程训练营》1-2_多核调度预备知识

    TianSong赞 1阅读 125

    头像
    一份简单i3wm配置

    notusednow赞 2阅读 27.7k

    头像
    记录一次Linux下安装Oracle数据库的过程

    少放香菜赞 1阅读 3.4k

    头像
    在 ubuntu24.04 上使用英伟达显卡——安装驱动和cuda

    universe_king赞 1阅读 3.8k

    头像
    linux下使用笔记本的相关设置

    notusednow阅读 7.6k

    头像
    张晋涛：KubeCon China 2024 回顾

    张晋涛赞 2阅读 573评论 1

    头像
    docker 使用--storage-opt参数约束容器文件系统大小

    李朝阳赞 2阅读 4.6k

    0 条评论
    得票最新