Apache目录列表模式定制个性化界面

HonestQiao

首先请参考：Mod_AutoIndex模块
http://w.yi.org/ftp/FAPM/apache/Apache2/zh/mod/mod_autoindex.html

以下只是展示了其中很少一部分设置的用法，要想获得更好的效果，请自己查看Mod_AutoIndex模块的文档。如果你没有时间，请联系我定制方案。谢谢。

演示：http://w.yi.org/ftp

1. 
   
2. <Directory "/path/to/you/folder">;
   
3. 
   
4. #开启目录列表索引模式
   
5. Options Indexes
   
6. 
   
7. #参数设置
   
8. IndexOptions FancyIndexing ScanHTMLTitles
   
9.                       NameWidth=128 DescriptionWidth=256
   
10.                       HTMLTable VersionSort FoldersFirst
    
11. #ScanHTMLTitles:搜索HTML标题
    
12. #NameWidth:文件命显示字节数
    
13. #DescriptionWidth:描述显示字节数
    
14. #HTMLTable:允许HTML格式
    
15. #FoldersFirst:目录优先
    
16. 
    
17. #索引排除选项
    
18. IndexIgnore header.html footer.html
    
19. 
    
20. #索引头部嵌入文件
    
21. HeaderName /data/index/header.html
    
22. #索引底部嵌入文件
    
23. ReadmeName /data/index/footer.html
    
24. 
    
25. #默认索引排序方式
    
26. IndexOrderDefault Ascending Date
    
27. 
    
28. #关闭服务器标志
    
29. ServerSignature Off            
    
30. 
    
31. #目录索引文件
    
32. DirectoryIndex index.htm     
    
33. </Directory>;
    

复制代码

以下配置文件内容，演示了如何把基本目录列表信息完整的嵌入到一个HTML网页之中
#索引头部嵌入文件
HeaderName /data/index/header.html

1. 
   
2. <!--// 网页基本信息以及修饰配置部分_Start//-->;
   
3. <!--// 网页基本信息以及修饰配置部分_End//-->;
   
4. <table>;
   
5. <tr>;
   
6. <td>;
   
7. <!--// 目录内容开始显示部分_Start//-->;
   

复制代码

#索引底部嵌入文件
ReadmeName /data/index/footer.html

1. 
   
2. <!--// 目录内容开始显示部分_EnD//-->;
   
3. </td>;
   
4. <td>;
   
5. <!--// 其他修饰部分，例如我的美美老婆的图片啊//-->;
   
6. </td>;
   
7. </tr>;
   
8. </table>;
   
9. <!--// 网页尾部基本信息以及修饰配置部分_Start//-->;
   
10. <!--// 网页尾部基本信息以及修饰配置部分_End//-->;
    

复制代码

生成个性化的目录列表页面的过程
1、读取#索引头部嵌入文件HeaderName /data/index/header.html 并输出
2、服务器生成目录列表信息并输出

1. 
   
2. <table>;<tr>;<th>;<img src="/icons/blank.gif" alt="[ICO]" />;</th>;<th>;<a href="?C=N;O=A">;Name</a>;</th>;<th>;<a href="?C=M;O=D">;Last modified</a>;</th>;<th>;<a href="?C=S;O=A">;Size</a>;</th>;<th>;<a href="?C=D;O=A">;Description</a>;</th>;</tr>;<tr>;<th colspan="5">;<hr />;</th>;</tr>;
   
3. <tr>;<td valign="top">;<img src="/icons/back.gif" alt="[DIR]" />;</td>;<td>;<a href="/">;Parent Directory</a>;                                                                                                                </td>;<td>;&</td>;<td align="right">;  - </td>;</tr>;
   
4. <tr>;<td valign="top">;<img src="/icons/folder.gif" alt="[DIR]" />;</td>;<td>;<a href="3.PHP-MYSQL/">;3.PHP-MYSQL/</a>;                                                                                                                    </td>;<td align="right">;11-Nov-2003 13:19  </td>;<td align="right">;  - </td>;</tr>;
   
5. <tr>;<td valign="top">;<img src="/icons/folder.gif" alt="[DIR]" />;</td>;<td>;<a href="2.WEB-Server/">;2.WEB-Server/</a>;                                                                                                                   </td>;<td align="right">;11-Nov-2003 13:19  </td>;<td align="right">;  - </td>;</tr>;
   
6. <tr>;<td valign="top">;<img src="/icons/folder.gif" alt="[DIR]" />;</td>;<td>;<a href="1.FreeBSD/">;1.FreeBSD/</a>;                                                                                                                      </td>;<td align="right">;11-Nov-2003 13:28  </td>;<td align="right">;  - </td>;</tr>;
   
7. <tr>;<td valign="top">;<img src="/icons/layout.gif" alt="[DIR]" />;</td>;<td>;<a href="FAPM/">;FAPM/</a>;                                                                                                                           </td>;<td align="right">;23-Aug-2004 10:17  </td>;<td align="right">;  - </td>;<td>;FAPM 豪华手册</td>;</tr>;
   
8. <tr>;<td valign="top">;<img src="/icons/folder.gif" alt="[DIR]" />;</td>;<td>;<a href="incoming/">;incoming/</a>;                                                                                                                       </td>;<td align="right">;28-Sep-2004 13:16  </td>;<td align="right">;  - </td>;</tr>;
   
9. <tr>;<th colspan="5">;<hr />;</th>;</tr>;
   
10. </table>;
    

复制代码

3、读取#索引底部嵌入文件ReadmeName /data/index/footer.html 并输出
以上三个部分的输出组成一个完整的网页，可以看出，基本目录列表信息是动态生成为一段表格的HTML内容，只需要适当定制你的HTML页面，然后把页面分割为头部和尾部，使得基本目录列表信息刚好嵌入到你所指定的位置，那么你就可以任意定制一个花里胡哨的个性化目录列表页面了。

HonestQiao

演示：http://w.yi.org/ftp

RTDT

老大，多谢，
我有个问题，
上头，下头都能改，就是不知道中间怎么改，那张图片怎么添加进去的？
是不是需要修改apache的源文件，多谢多谢多谢

laixi781211

原帖由 "RTDT" 发表：
老大，多谢，
我有个问题，
上头，下头都能改，就是不知道中间怎么改，那张图片怎么添加进去的？
是不是需要修改apache的源文件，多谢多谢多谢

<!--// 其他修饰部分，例如我的美美老婆的图片啊//-->;

HonestQiao

拜托那个文问题的兄弟，我写得很清楚了，你可不可以多看看我写得东西啊，拜托多看看清楚在问问题，。


如果实在不想的话，那么找我定制好了

zhangr

谢谢
HQ老大.
我修改了我的一个叶面效果不错!

1. 
   
2.     Alias /ln_actions/ "/home/atest/pic/"
   
3. 
   
4.     <Directory "/home/atest/pic">;
   
5.         Options Indexes MultiViews
   
6. #       IndexOptions ScanHTMLTitles
   
7. #       IndexOptions HTMLTable
   
8. #       IndexOptions VersionSort
   
9. #       IndexOptions FoldersFirst
   
10.         IndexIgnore header.html footer.html bepc.jpg actions defects
    
11.         HeaderName /home/atest/pic/header.html
    
12.         ReadmeName /home/atest/pic/footer.html
    
13.         IndexOrderDefault Ascending Date
    
14.         ServerSignature Off
    
15.         DirectoryIndex index.htm
    
16.         AllowOverride None
    
17.         Order allow,deny
    
18.         Allow from all
    
19.     </Directory>;
    
20. 
    

复制代码

但当我想对apache发布的根目录加header 和 footer的时候总是不成功。
加的option都是一样的。为什么就不行呢？

1. 
   
2. <Directory />;
   
3.         Options Indexes FollowSymLinks Includes MultiViews
   
4.         IndexIgnore header.html footer.html bepc.jpg actions defects
   
5.         HeaderName /home/atest/pic/header.html
   
6.         ReadmeName /home/atest/pic/footer.html
   
7.         IndexOrderDefault Ascending Date
   
8.         ServerSignature Off
   
9.         DirectoryIndex index.htm
   
10.         AllowOverride None
    
11.         Order allow,deny
    
12.         Allow from all
    
13. 
    
14. </Directory>;
    

复制代码

不好意思！已经知道了！
是HeaderName和ReadmeName的位置。写的不对，应该是相对于http的根，而不是文件系统的根。
上边的那个之所以没有问题是因为做了alias同时文件系统的路径和http的路径一样，所以才没有问题。 8-）
无论如何谢谢HQ老大的分享！ 8-）

RTDT

原帖由 "HonestQiao" 发表：
拜托那个文问题的兄弟，我写得很清楚了，你可不可以多看看我写得东西啊，拜托多看看清楚在问问题，。


如果实在不想的话，那么找我定制好了

嘿嘿，不好意思啊，俺已经明白了，就是几个网页的组合，多谢，   

abel

到 google 找個叫 mod_layout 的 dso
除了像 Indexes 功能,自動補頭尾,每一個網頁(cgi/php/jsp..)
都可以自動幫你補頁首頁尾,不用在那 include 的半死

aspbiz

右边的那个图片，应该可以有Header和Footer里做文章，

haohaoo

好长一段时间没来看了，老大又有新东西，不错