💎一站式轻松地调用各大LLM模型接口,支持GPT4、智谱、星火、月之暗面及文生图 广告
# 8.4 主页展示与下载文件功能 ##1、主页展示 >客户端 web前端通过Ajax动态想后台请求页面。 http请求方式GET 请求url为/data 传输协议以json数据格式为例: ```json { "cmd":"newFile", "fromId":"0", "count":"8" } ``` >服务端 首先应该在nginx.conf里面设置好对/data 的url处理的模块. ```php location = /data { fastcgi_pass 127.0.0.1:8085; fastcgi_index data.cgi; include fastcgi.conf; } ``` 当然同时fastCGI对应的data.cgi要在后台启动起来 后台服务进程解析json数据,得到cmd,fromId,count等参数 随后从redis数据库中取出每个文件的信息返回给前端。 还是以json格式传输。 ```json { "games": [ { "id": "group1/M00/00/00/wKgCbFepUHGAUTOhAP_fjuN0kbA670.pdf", "kind": 2, "title_m": "python-网络爬虫.pdf", "title_s": "文件title_s", "descrip": "2016-08-09 11:39:24", "picurl_m": "http://172.16.0.148/static/file_png/pdf.png", "url": "http://192.168.2.108/group1/M00/00/00/wKgCbFepUHGAUTOhAP_fjuN0kbA670.pdf", "pv": 1, "hot": 0 }, { "id": "group1/M00/00/00/wKgCbFepT0SAOBCtACjizOQy1fU405.rar", "kind": 2, "title_m": "阶段测试_STL_数据结构.rar", "title_s": "文件title_s", "descrip": "2016-08-09 11:34:23", "picurl_m": "http://172.16.0.148/static/file_png/rar.png", "url": "http://192.168.2.108/group1/M00/00/00/wKgCbFepT0SAOBCtACjizOQy1fU405.rar", "pv": 1, "hot": 0 }, { "id": "group1/M00/00/00/wKgCbFepTp2AUnd1AFRAAvu2TSg259.mp3", "kind": 2, "title_m": "黄昏.mp3", "title_s": "文件title_s", "descrip": "2016-08-09 11:31:35", "picurl_m": "http://172.16.0.148/static/file_png/mp3.png", "url": "http://192.168.2.108/group1/M00/00/00/wKgCbFepTp2AUnd1AFRAAvu2TSg259.mp3", "pv": 5, "hot": 0 }, { "id": "group1/M00/00/00/wKgCbFepTmGAQvuXAAEYXfRAMkc937.png", "kind": 2, "title_m": "01-nginx-市场占有率.png", "title_s": "文件title_s", "descrip": "2016-08-09 11:30:35", "picurl_m": "http://172.16.0.148/static/file_png/png.png", "url": "http://192.168.2.108/group1/M00/00/00/wKgCbFepTmGAQvuXAAEYXfRAMkc937.png", "pv": 2, "hot": 0 }, { "id": "group1/M00/00/00/wKgCbFepSKeASREwAAapfc9k6Rc011.jpg", "kind": 2, "title_m": "小猫5.jpg", "title_s": "文件title_s", "descrip": "2016-08-09 11:06:10", "picurl_m": "http://172.16.0.148/static/file_png/jpg.png", "url": "http://192.168.2.108/group1/M00/00/00/wKgCbFepSKeASREwAAapfc9k6Rc011.jpg", "pv": 1, "hot": 0 }, { "id": "group1/M00/00/00/wKgCbFepSKeAOkV4AAY7zSGunKE058.jpg", "kind": 2, "title_m": "小猫6.jpg", "title_s": "文件title_s", "descrip": "2016-08-09 11:06:09", "picurl_m": "http://172.16.0.148/static/file_png/jpg.png", "url": "http://192.168.2.108/group1/M00/00/00/wKgCbFepSKeAOkV4AAY7zSGunKE058.jpg", "pv": 0, "hot": 0 }, { "id": "group1/M00/00/00/wKgCbFepSKeARhoLAAXsKfNoK_k046.jpg", "kind": 2, "title_m": "猫4.jpg", "title_s": "文件title_s", "descrip": "2016-08-09 11:06:09", "picurl_m": "http://172.16.0.148/static/file_png/jpg.png", "url": "http://192.168.2.108/group1/M00/00/00/wKgCbFepSKeARhoLAAXsKfNoK_k046.jpg", "pv": 0, "hot": 0 }, { "id": "group1/M00/00/00/wKgCbFepSKeAADFfAAbuwxC1bYU619.jpg", "kind": 2, "title_m": "猫2.jpg", "title_s": "文件title_s", "descrip": "2016-08-09 11:06:09", "picurl_m": "http://172.16.0.148/static/file_png/jpg.png", "url": "http://192.168.2.108/group1/M00/00/00/wKgCbFepSKeAADFfAAbuwxC1bYU619.jpg", "pv": 0, "hot": 0 } ] } ``` 其中每个文件对应id、kind、title_m、title_s、descrip、picurl_m、url、pv、hot等字段。 `id`为通过fastDFS保存文件所返回的分布式最终的file_id字符串,用了记录文件唯一标识的key。 `kind`应该是文件类型。 `title_m` 文件的名称 `title_s` 暂时没有用上。 `descrip` 存放文件上传的时间。 `picurl_m` 存放文件的的图标文件路径 `url` 存放文件存放在fastdfs分布式存储服务器的url地址。 `pv` 文件当前的下载量 `hot` 该文件是否是火爆文件。 然后前端根据文件数据,通过js将文件内容展示出来。即可。 ##2、文件下载 文件下载实际上比较容易,因为页面上展示的“下载文件”就已经将封装好的url展示出来,下载文件全部基于浏览器对文件的自动解析,如果是图片那就是展示出来,如果是rar等,那就直接下载。