最新消息:20181230 VPS服务器已从Linode换到腾讯云香港,主题仍用朋友推荐的大前端D8

【已解决】实现基于HostMonster中的Apache的WordPress的在线网站crifan.com的文件列表显示,即mod_autoindex中的FancyIndexing

WordPress crifan 903浏览 0评论

【问题】

之前折腾过:【已解决】基于Apache服务器的文件列表,即文件的http下载模式,

可以实现了本地localhost的文件列表显示了。

现在想要把此功能应用到在线的HostMonster下的crifan.com。

【解决过程】

1.所以,首先就想到要去修改对应的httpd.conf文件。

关于具体折腾过程,参考:

【基本解决】在哪里才能找到HostMonster中的Linux的Apache服务器中的httpd.conf

最终,虽然没有开启SSL以访问修改httpd.conf,但是找到了.htacess文件。

2.所以接着,就是去折腾.htaccess文件了。

【通过配置.htaccess文件而达到修改httpd.conf的效果,以实现开启文件列表的功能】

所以,就通过FileZilla下载下来,参考之前的见过的httpd-autoindex.conf中的配置,添加了

IndexOptions FancyIndexing

变成:

# Use PHP5 Single php.ini as default
AddHandler application/x-httpd-php5s .php

IndexOptions FancyIndexing

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ – [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

然后去刷新了下某个页面,惊喜的发现,竟然真的生效了:

IndexOptions FancyIndexing take effect_thumb

所以,那就接着去添加参数。

另外,也注意到,此时最底端,是显示了那个说明文字“Apache Server at www.crifan.com Port 80”的。

3.经过一番折腾,发现如果在.htaccess中添加:

# Fancy directory listings
Include httpd-autoindex.conf

然后再去把httpd-autoindex.conf文件放到wordpress根目录,结果会出现错误的:

The server encountered an internal error or misconfiguration and was unable to complete your request.

Please contact the server administrator, webmaster@crifan.com and inform them of the time the error occurred, and anything you might have done that may have caused the error.

More information about this error may be available in the server error log.

Additionally, a 500 Internal Server Error error was encountered while trying to use an ErrorDocument to handle the request.

500 internal server error_thumb

因此,只能手动把httpd-autoindex.conf中的配置,一点点拷贝到.htaccess中去。

4.然后经过测试,发现把.htaccess改为:

# Use PHP5 Single php.ini as default
AddHandler application/x-httpd-php5s .php

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

# Fancy directory listings
#Include httpd-autoindex.conf


#
# Directives controlling the display of server-generated directory listings.
#
# Required modules: mod_autoindex, mod_alias
#
# To see the listing of a directory, the Options directive for the
# directory must include "Indexes", and the directory must not contain
# a file matching those listed in the DirectoryIndex directive.
#

#
# IndexOptions: Controls the appearance of server-generated directory
# listings.
#
#IndexOptions FancyIndexing HTMLTable VersionSort
IndexOptions FancyIndexing VersionSort FoldersFirst Charset=UTF-8 NameWidth=* XHTML

#
# 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

此时已经可以正常显示文件图标了:

can show icon_thumb

而无需把关于icon的路径的配置:

# We include the /icons/ alias for FancyIndexed directory listings.  If
# you do not use FancyIndexing, you may comment this out.
#
Alias /icons/ "c:/Apache2/icons/"

<Directory "c:/Apache2/icons">
    Options Indexes MultiViews
    AllowOverride None
    Order allow,deny
    Allow from all
</Directory>

添加进去。

所以,剩下的就是有空把各种类型的文件对应的图标,都放到合适位置,然后再配置后缀名映射到对应的图标即可。

5.不过在折腾图标之前,还是先把常见文件类型,都使用已有的合适的图标再说.

6.后来又抽空把常见的文件类型所对应的图标/图片,都通过自己截图抠了出来。

然后上传到对应位置并修改.htaccess,最后的内容为:

# Use PHP5 Single php.ini as default
AddHandler application/x-httpd-php5s .php

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress


# Fancy directory listings
#Include httpd-autoindex.conf


#
# Directives controlling the display of server-generated directory listings.
#
# Required modules: mod_autoindex, mod_alias
#
# To see the listing of a directory, the Options directive for the
# directory must include "Indexes", and the directory must not contain
# a file matching those listed in the DirectoryIndex directive.
#

#
# IndexOptions: Controls the appearance of server-generated directory
# listings.
#
#IndexOptions FancyIndexing HTMLTable VersionSort
IndexOptions FancyIndexing VersionSort FoldersFirst Charset=UTF-8 NameWidth=* XHTML

#
# 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 .rar
#AddIcon /icons/a.gif .ps .ai .eps
#AddIcon /icons/layout.gif .html .shtml .htm .pdf
#AddIcon /icons/text.gif .txt .rtf .chm .php
#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 https://www.crifan.com/files/res/apache/icons/20x22/7z.png .7z
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/accdb.png .accdb
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/avi.png .avi
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/c.png .c
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/chm.png .chm
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/cpp.png .cpp
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/dll.png .dll
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/doc.png .doc .rtf
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/docx.png .docx
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/exe.png .exe .bin
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/gif.png .gif
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/h.png .h
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/htm.png .htm .shtml
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/html.png .html .svg
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/ini.png .ini .css
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/iso.png .iso
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/jpg.png .jpg
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/js.png .js
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/mdb.png .mdb
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/mht.png .mht
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/mp3.png .mp3
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/msi.png .msi
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/patch.png .patch
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/pdf.png .pdf
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/png.png .png
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/ppt.png .ppt
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/pptx.png .pptx
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/py.png .py
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/pyo.png .pyo
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/rar.png .rar .tar .gz .bz2
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/tif.png .tif
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/torrent.png .torrent
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/txt.png .txt
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/xls.png .xls
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/xlsx.png .xlsx
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/xml.png .xml
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/zip.png .zip


#AddIcon /icons/back.gif ..
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/back.png ..
AddIcon /icons/hand.right.gif README
#AddIcon /icons/folder.gif ^^DIRECTORY^^
AddIcon https://www.crifan.com/files/res/apache/icons/20x22/folder.png ^^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
DefaultIcon https://www.crifan.com/files/res/apache/icons/20x22/unknown.png


#
# AddDescription allows you to place a short description after a file in
# server-generated indexes.  These are only displayed for FancyIndexed
# directories.
# Format: AddDescription "description" filename
#
#AddDescription "GZIP compressed document" .gz
#AddDescription "tar archive" .tar
#AddDescription "GZIP compressed tar archive" .tgz

#
# ReadmeName is the name of the README file the server will look for by
# default, and append to directory listings.
#
# HeaderName is the name of a file which should be prepended to
# directory indexes. 
ReadmeName README.html
HeaderName HEADER.html

#
# IndexIgnore is a set of filenames which directory indexing should ignore
# and not include in the listing.  Shell-style wildcarding is permitted.
#
IndexIgnore .??* *~ *# HEADER* README* RCS CVS *,v *,t

 

然后效果如图:

custom icon effect

 

【总结】

给在线的网站添加这类东西,还是比本地麻烦些,涉及到修改在线主机中的一些配置。

目前是通过修改HostMonster中的.htaccess来实现添加FancyIndexing支持的。

转载请注明:在路上 » 【已解决】实现基于HostMonster中的Apache的WordPress的在线网站crifan.com的文件列表显示,即mod_autoindex中的FancyIndexing

发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
60 queries in 0.082 seconds, using 9.44MB memory