很早之前,就看到过很多网站,除了本身某个地址可以显示html网页之外,其他有些网站路径下面的子路径:
http://docbook.sourceforge.net/release/website/current/
就像本地电脑中的子文件夹一样,可以以列表形式显示文件:
设置有些还可以添加对应的不同类型的文件,显示对应不同的图标:
(其实之前看到过更好的例子,但是暂时找不到了,所以只能用上面这个不是很爽的作为例子了。。。)
因此,相对于FTP服务器的下载来说,对应的就可以实现了http模式的下载。
因为直接点击对应文件,即可下载或直接在线用浏览器打开并查看文本类型的文件。
【解决过程】
1. 之前对于这些东西,一直不知道实现的原理。
后来在自己建了个wordpress的网站:crifan.com后,无意间发现,貌似“自带”的已经实现了此基本的http下载的功能了:
而且还是不知道如何实现的,不知道内部的原理是啥。
也一直想要弄个和别的那些网站一样的,带图标的,带文件日期,大小显示的效果。
2.无意间,去google搜了:
apache file list view
结果,就找到了梦寐以求的,文件列表的实现原理,原来是通过:
来实现的。
所以,剩下的事情就好办多了,只是模块的安装和配置了。
3.然后暂时去本地的基于apache的wordpress中看了看当前apache所用的模块。
找到了
httpd-2.2.19-win64\httpd-2.2-x64\conf\httpd.conf
中的相关模块:
1
|
LoadModule autoindex_module modules
/mod_autoindex
.so
|
很明显,其当前已经启用了。
所以,前面所说的,建立好的wordpress网站,内置已经支持了文件列表显示,其实就是,wordpress所基于的apache,默认就已经打开了mod_autoindex了。
所以,剩下的,就是搞懂,如何去配置,实现对应的显示文件的修改日子,大小,图标等效果了。
4.另外,也专门测试了一下,去把该模块去掉:
1
|
#LoadModule autoindex_module modules/mod_autoindex.so
|
然后重启apache,再登陆某个wordpress网站下面的某个文件夹,结果就会出现HTTP 404的错误:
而开启了autoindex模块:
1
|
LoadModule autoindex_module modules
/mod_autoindex
.so
|
就可以正常显示文件列表的:
再一次证明了,文件列表的功能,就是通过autoindex控制的。
5.接着继续去配置autoindex。
把
httpd-2.2.19-win64\httpd-2.2-x64\conf\httpd.conf
中的
1
2
|
# Fancy directory listings
#Include conf/extra/httpd-autoindex.conf
|
改为:
1
2
|
# Fancy directory listings
Include conf
/extra/httpd-autoindex
.conf
|
重启apache,效果变为:
可以看到,添加了最后修改时间,文件夹图标,大小。
只是图标暂时还没有,大小也没有显示。
6. 先去折腾图标。
在
\httpd-2.2.19-win64\httpd-2.2-x64\icons
中找到了apache自带的N多个icon。
接着在
\httpd-2.2.19-win64\httpd-2.2-x64\conf\extra\httpd-autoindex.conf
的确也找到了对应的配置:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
|
# We include the /icons/ alias for FancyIndexed directory listings. If
# you do not use FancyIndexing, you may comment this out.
#
Alias
/icons/
"/httpd-2.2-x64/icons/"
<Directory
"/httpd-2.2-x64/icons"
>
Options Indexes MultiViews
AllowOverride None
Order allow,deny
Allow from all
<
/Directory
>
#
# AddIcon* directives tell the server which icon to show for different
# files or filename extensions. These are only displayed for
# FancyIndexed directories.
#
AddIconByEncoding (CMP,
/icons/compressed
.gif) x-compress x-
gzip
AddIconByType (TXT,
/icons/text
.gif) text/*
AddIconByType (IMG,
/icons/image2
.gif) image/*
AddIconByType (SND,
/icons/sound2
.gif) audio/*
AddIconByType (VID,
/icons/movie
.gif) video/*
AddIcon
/icons/binary
.gif .bin .exe
AddIcon
/icons/binhex
.gif .hqx
AddIcon
/icons/tar
.gif .
tar
AddIcon
/icons/world2
.gif .wrl .wrl.gz .vrml .vrm .iv
AddIcon
/icons/compressed
.gif .Z .z .tgz .gz .zip
AddIcon
/icons/a
.gif .
ps
.ai .eps
AddIcon
/icons/layout
.gif .html .shtml .htm .pdf
AddIcon
/icons/text
.gif .txt
AddIcon
/icons/c
.gif .c
AddIcon
/icons/p
.gif .pl .py
AddIcon
/icons/f
.gif .
for
AddIcon
/icons/dvi
.gif .dvi
AddIcon
/icons/uuencoded
.gif .uu
AddIcon
/icons/script
.gif .conf .sh .shar .csh .ksh .tcl
AddIcon
/icons/tex
.gif .tex
AddIcon
/icons/bomb
.gif core
AddIcon
/icons/back
.gif ..
AddIcon
/icons/hand
.right.gif README
AddIcon
/icons/folder
.gif ^^DIRECTORY^^
AddIcon
/icons/blank
.gif ^^BLANKICON^^
#
# DefaultIcon is which icon to show for files which do not have an icon
# explicitly set.
#
DefaultIcon
/icons/unknown
.gif
|
但是想要去改/icons/的Alias为自己想要的值,却不知道当前路径该写成什么。
先去试了试:
1
2
|
#Alias /icons/ "/httpd-2.2-x64/icons/"
Alias
/icons/
"../../../icons/"
|
结果还是不行。而且去看了下实际生成的结果,对应的图标的路径,都是变成了在网站主路径下面的地址了:
即,folder.gif对应地址是http://localhost/icons/folder.gif
而此处比较麻烦的是,当前apache下面的icons的路径,是www基地址,即apache下面的htdocs,所并列的地址,所以,网站的地址:
下面的任何子路径,都是无法访问到对应的icon图片的。
后来想了想,觉得还是把对应图标都拷贝到网站子路径下面,比较合适。
然后把icons拷贝到
\httpd-2.2.19-win64\httpd-2.2-x64\htdocs\files\res\apache\icons
然后配置再改为:
1
2
|
#Alias /icons/ "/httpd-2.2-x64/icons/"
Alias
/icons/
"/files/res/apache/icons/icons/"
|
重启apache试试效果。
7.结果却发现上述文件夹图标还是原来的地址:
http://localhost/icons/folder.gif
看起来感觉像是apache的conf中的Alias没有起作用啊。
后来网上找了apache的alias的官网介绍:
才知道:
A。原来Alias这个指令,是先要确保模块mod_alias启用了,才能有效的
B。本身Alias正常工作后,对于上述的配置
Alias /icons/ "/files/res/apache/icons/icons/"
其将/files/res/apache/icons/icons/映射为/icons/胡,那么网站上所看到的路径,也仍旧是http://localhost/icons/,所以,很明显,上面所显示出来的地址
http://localhost/icons/folder.gif
本身就是符合逻辑的。
只是自己的内部映射配置错误,导致图片没法显示的。
然后又看到一个别人的配置:
所以就去改为:
1
|
Alias
/icons/
"D:/tmp/WordPress/DevRoot/httpd-2.2.19-win64/httpd-2.2-x64/icons/"
|
然后再重启apache看看效果如何。
8.结果还是不行。
不过后来注意到,别人该Alias同时,也去改后面的那个Directory的,所以就又去改为:
1
2
3
4
5
6
7
8
9
10
11
12
13
|
# We include the /icons/ alias for FancyIndexed directory listings. If
# you do not use FancyIndexing, you may comment this out.
#
#Alias /icons/ "/httpd-2.2-x64/icons/"
Alias
/icons/
"D:/tmp/WordPress/DevRoot/httpd-2.2.19-win64/httpd-2.2-x64/icons/"
#<Directory "/httpd-2.2-x64/icons">
<Directory
"D:/tmp/WordPress/DevRoot/httpd-2.2.19-win64/httpd-2.2-x64/icons/"
>
Options Indexes MultiViews
AllowOverride None
Order allow,deny
Allow from all
<
/Directory
>
|
然后重启apache,最后终于图标可以正确显示了:
顺便说一句,
上述路径是windows的绝对路径,且分隔符为斜杠’/’,而不是反斜杠’\’。
如果是在线的网站,服务器是linux的话,那么对应地址就该改为对应耳朵linux的路径了,比如
/xxx/xxx/httpd-2.2/icons
之类的了。
9.接着折腾文件大小的显示。
此处本以为是文件大小的显示是有问题的呢,结果无意间点击某个子文件夹,发现里面的文件的确是显示大小的:
然后才想起来,正常的逻辑也的确是:
文件夹是不显示大小的
文件是显示大小的
所以,此处关于文件大小的显示方面,本身已经可以正常工作了,无需再折腾。
另外,
\httpd-2.2.19-win64\httpd-2.2-x64\htdocs\files\res\apache\icons
也不需要了。
10.但是xml文件格式还是没有图标。
然后就去网上找常见的windows的文件图标资源。
结果是,找了很长时间,竟然没有找到windows/xp/win7等常用文件类型所对应的图标或图片。
很是无语,看来只能抽空去用软件把常见的图标都提取出来了。
不过,刚发现,暂时可以先把xml等格式,设置为txt的:
1
|
AddIcon
/icons/text
.gif .txt .css .xsl .xml .ini
|
这样至少显示出来,不会是未知类型,多少好看点。
11。另外,对于此处文件列表显示,再去优化一下。
最终的配置如下:
1
2
|
#IndexOptions FancyIndexing HTMLTable VersionSort FoldersFirst Charset=UTF-8 NameWidth=* XHTML
IndexOptions FancyIndexing VersionSort FoldersFirst Charset=UTF-8 NameWidth=* XHTML
|
效果如下:
【仍存问题】
1. 希望可以在支持文件名的宽度自动扩展的同时:
NameWidth=*
另外还支持多列之间,即图标,文件名,修改时间,大小,这几列之间能够设置padding,这样使得各列更好的能够区分开来。
2.最底部,之前的apache那个说明文字变没了。
而之前是有类似于“Apache Server at www.crifan.com Port 80”的说明文字的,现在没了。
不知道怎么弄才能让其再次出现。此处好像是开启了FancyIndexing,说明文字就消失了。