nginx的autoindex,目录浏览,配置和美化,美观的xslt_stylesheet

Nginx custom autoindex with XSLT

转载注明来源: 本文链接 来自osnosn的博客，写于 2019-04-11.

需要在浏览器页面中浏览服务器的目录。Apache2很容易配置，还能通过配置让目录浏览显示比较美观。

Nginx也很容易配置，Nginx提供了相应的ngx_http_autoindex_module 模块，该模块提供了我们想要的功能。

例如，要让/bt/目录能显示，nginx的配置这样写:

location ^~ /bt/ {

   autoindex on;

   autoindex_format html;

   #autoindex_localtime off;

   charset utf-8;

   include /etc/nginx/default.d/php71w-fpm.conf;

}

文件修改时间，可用参数autoindex_localtime设置为utc或当地时间。

效果如下图，可惜不太美观：

那再用上 ngx_http_xslt_module 模块。

长文件名溢出自动显示省略号。效果如下：

nginx配置如下：

location ^~ /bt/ {

   autoindex on;

   autoindex_format xml;

   xslt_stylesheet /data/www/html/autoindex.xslt cpath="$uri";

   include /etc/nginx/default.d/php71w-fpm.conf;

}

autoindex.xslt 这个文件有点大。

似乎ngx_http_xslt_module只支持stylesheet-1.0，不支持2.0。但支持libexslt，可以使用EXSLT函数。

xml中只提供UTC时间。不能通过nginx的配置修改。

时区修改在xslt文件中，TIMEDIFF变量。

改为PT0H时间不变，PT8H加8小时，-PT6H减6小时。

autoindex.xslt文件如下：

<?xml version="1.0" encoding="UTF-8"?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

   xmlns:date="http://exslt.org/dates-and-times"

   extension-element-prefixes="date" >

  <xsl:output method="html" encoding="UTF-8"/>

  <xsl:param name="cpath"/>

  <xsl:variable name="TIMEDIFF" select="'PT8H'"/><!-- 'PT0H' '-PT6H' -->

  <xsl:template match="/">

  <xsl:text disable-output-escaping="yes">&lt;!DOCTYPE html&gt;</xsl:text>

 <html>

 <head>

   <title>IndexOf <xsl:value-of select="$cpath"/></title>

   <meta charset="utf-8"/>

   <meta name="viewport" content="width=device-width, initial-scale=1"/>

   <xsl:text disable-output-escaping="yes">

&lt;!--

   ========= config in nginx: ===============

    autoindex  on;

    autoindex_format  xml;

    xslt_stylesheet  /..path_to.../html/autoindex.xslt  cpath="$uri";

   ========= config in nginx: ===============

    modify variable "TIMEDIFF".

--&gt;

   </xsl:text>

   <style type="text/css">

  body {

        margin: 5px;

        background-color: #ddd;

  }

  table {

        font-size: 15px;

        width: 96%;

        min-width:650px;

        table-layout:fixed;

        margin-top: 15px;

        margin-left: 5px;

        margin-right: 5px;

        box-shadow: 0 0 0.5em #999;

        border: none !important;

        margin-bottom: 1em;

        border-collapse: collapse;

        border-spacing: 0;

  }

  th {

        background: #000;

        background: -webkit-linear-gradient(top, #444, #000);

        background: -moz-linear-gradient(top, #444, #000);

        background: -ms-linear-gradient(top, #444, #000);

        background: -o-linear-gradient(top, #444, #000);

        background: linear-gradient(top, #444, #000);

        font-size: 14px;

        line-height: 24px;

        border: none;

        text-align: left;

        color: #fff;

  }

  tr {

        background: rgba(255, 255, 255, 0.8);

  }

  tr:hover {

        background: rgba(255, 255, 255, 0.5);

  }

  .f9 {

        font-size: 9px;

  }

  tr th td {

        overflow:hidden;

        text-overflow:ellipsis;

        white-space:nowrap;

        word-break:keep-all;

  }

  th, td {

        height: 20px;

        vertical-align: middle;

        white-space: nowrap;

        padding: 0.1em 0.5em;

        border: 1px solid #ccc;

  }

  a{text-decoration:none;}

  a:hover{text-decoration:underline;}

  .name{min-width:400px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:15px;}

  .size{min-width:65px;white-space:nowrap;font-size:13px;text-align:right;}

  .mtime{width:115px;white-space:nowrap;font-size:11px;text-align:center;}

   </style>

 </head>

 <body>

   <div style="margin-left:15px;margin-top:10px;font-size:15pt">

   <b>

   Index of <xsl:value-of select="$cpath"/>

   </b>

   </div>

   <center>

    <xsl:apply-templates/>

   </center>

   <div style="margin-left:10px;font-size:9pt">:.end</div>

   <br/>

 </body>

 </html>

 </xsl:template>

  <xsl:template match="list">

   <table style="width:100%;min-width:670px;margin:0;box-shadow:none" cellpadding="0"><tr style="background:none"><td style="padding:0;border:0"><center>

   <table>

   <tr>

     <th>Name</th>

     <th width="80px">Size</th>

     <th width="115px">Modified</th>

   </tr>

   <tr>

     <td><a href="../">../</a></td>

     <td></td>

     <td></td>

   </tr>

    <xsl:for-each select="directory">

      <xsl:sort select="name"/>

    </xsl:for-each>

    <xsl:apply-templates/>

    </table>

    </center></td></tr></table>

  </xsl:template>

  <xsl:template match="file">

      <xsl:variable name="name">

        <xsl:value-of select="."/>

      </xsl:variable>

      <xsl:variable name="size">

        <xsl:if test="string-length(@size) &gt; 0">

          <xsl:if test="number(@size) = 0">

            <xsl:value-of select="@size" /> B

          </xsl:if>

          <xsl:if test="number(@size) &gt; 0">

            <xsl:choose>

              <xsl:when test="round(@size div 1024) &lt; 2"><xsl:value-of select="@size" /> B</xsl:when>

              <xsl:when test="round(@size div 1048576) &lt; 2"><xsl:value-of select="format-number((@size div 1024), '0.0')" /> KB</xsl:when>

              <xsl:when test="round(@size div 1073741824) &lt; 2"><xsl:value-of select="format-number((@size div 1048576), '0.00')" /> MB</xsl:when>

              <xsl:otherwise><xsl:value-of select="format-number((@size div 1073741824), '0.00')" /> GB</xsl:otherwise>

            </xsl:choose>

          </xsl:if>

        </xsl:if>

      </xsl:variable>

   <tr>

     <td class="f11"><div class="name"><a href="{$name}" title="{$name}"><xsl:value-of select="."/></a></div></td>

     <td><div class="size" title="{@size} bytes"><xsl:value-of select="$size"/></div></td>

     <td><div class="mtime">

        <xsl:value-of select="translate(date:add(@mtime,$TIMEDIFF),'TZ','  ')" />

     </div></td>

   </tr>

  </xsl:template>

  <xsl:template match="directory" name="directory">

      <xsl:variable name="name">

        <xsl:value-of select="."/>

      </xsl:variable>

   <tr>

     <td class="f11"><div class="name"><a href="{$name}" title="{$name}/"><xsl:value-of select="."/>/</a></div></td>

     <td><div class="size"> -- </div></td>

     <td><div class="mtime">

        <xsl:value-of select="translate(date:add(@mtime,$TIMEDIFF),'TZ','  ')" />

     </div></td>

   </tr>

  </xsl:template>

</xsl:stylesheet>

转载注明来源: 本文链接 来自osnosn的博客

nginx的autoindex,目录浏览,配置和美化,美观的xslt_stylesheet的更多相关文章

  1. NGINX服务器打开目录浏览功能

    我们做文件服务器的时候,希望打开目录浏览的功能.但是Nginx默认是不允许列出目录功能的.若需要此功能,需要在配置文件中手动开启. 首先需要打开开关.autoindex on;autoindex_ex ...

  2. nginx开启网站目录浏览功能

    一.开启全站目录浏览功能 编辑nginx.conf, 在http下面添加以下内容: autoindex on; # 开启目录文件列表 autoindex_exact_size on; # 显示出文件的 ...

  3. Nginx浏览目录配置及美化

    https://segmentfault.com/a/1190000012606305 在项目中有一个功能需要在浏览器页面中浏览服务器的目录.服务器使用Nginx,而Nginx提供了相应的ngx_ht ...

  4. nginx autoindex 配置目录浏览功能

    Nginx打开目录浏览功能 yum install httpd-tools -y cd /usr/local/openrestry/nginx/conf/ htpasswd -c passwd adm ...

  5. nginx下目录浏览及其验证功能配置记录

    工作中常常有写不能有网页下载东西的需求,在Apache下搭建完成后直接导入文件即可达到下载/显示文件的效果;而Nginx的目录列表功能默认是关闭的,如果需要打开Nginx的目录列表功能,需要手动配置, ...

  6. nginx和apache配置目录浏览功能

    今天工作需要,要给客户提供一个patch的下载地址,于是想用nginx的目录浏览功能来做,需要让客户看到指定一个目录下的文件列表,然后让他自己来选择该下载那个文件: 我们都知道在apache下可以配置 ...

  7. 配置 Nginx 的目录浏览功能

    Nginx 默认是不允许列出整个目录的,需要配置 Nginx 自带的 ngx_http_autoindex_module 模块实现目录浏览功能 . location / { alias /opt/fi ...

  8. nginx下目录浏览及其验证功能、版本隐藏等配置记录

    工作中常常有写不能有网页下载东西的需求,在Apache下搭建完成后直接导入文件即可达到下载/显示文件的效果;而Nginx的目录列表功能默认是关闭的,如果需要打开Nginx的目录列表功能,需要手动配置, ...

  9. Nginx设置目录浏览并配置验证

    Nginx默认是不允许进行列目录的,如果需要使某个目录可以进行浏览,可如下设置:如: 让/var/www/soft 这个目录在浏览器中完成列出. 一.设置目录浏览1.打开/usr/local/ngin ...

随机推荐

  1. Unix代码分析

    世存最早的unix源代码:http://minnie.tuhs.org/cgi-bin/utree.pl?file=PDP7-Unix/sys 世存最早的cc:http://minnie.tuhs.o ...

  2. Python笔记4——字典的一些基本操作

    #字典 key-value #添加 my_family= {"father": "weihaiqing", "mother": " ...

  3. 在Linux系统上安装Oracle数据库

    前期准备:我用的是虚拟机上的CentOS 64位系统.所以需要设置网卡,时间,EPEL源,安装一些必备的软件. 1.1在虚拟机上安装好Linux系统后选择虚拟机设置—>网络适配器—>网络连 ...

  4. dos4章

    批处理中的变量,我把他分为两类,分别为"系统变量"和"自定义变量" 我们现在来详解这两个变量! 一.系统变量 他们的值由系统将其根据事先定义的条件自动赋值,也就 ...

  5. 解构赋值 Destructuring Assignment

    解构赋值 Destructuring Assignment ES6中可以通过一定的模式将数组或对象中的值直接赋值给外部变量,称为解构 对象的解构赋值 // 在ES5中,当需要获取一个对象中的变量值的时 ...

  6. vs2017cpu占用过高解决方案

    最近在开发中,发现机器变得很卡顿.查看资源管理器发现vs的cpu使用率一直在20%-40%之间.占据了大量的系统计算资源. 展开资源管理器发现有很多node的线程,杀死后,他们又会自己起来! 一翻搜索 ...

  7. 如何快速判断一个key是否存在在亿级数据中(bloomFilters)

    面试题 现在有一个非常庞大的数据(亿级),假设全是 int 类型.现在我给你一个数,你需要告诉我它是否存在其中(尽量高效) 分析 采用bloomFilters进行实现(时间&空间尽可能的有效) ...

  8. Windows下网页连接VNC操作手册

    所需软件:tigervnc noVnc(https://github.com/novnc/noVNC) websockify(https://github.com/novnc/websockify) ...

  9. blueprint的使用

    第一步:导入蓝图模块: from flask import Blueprint 第二步:创建蓝图对象: #Blueprint必须指定两个参数,admin表示蓝图的名称,__name__表示蓝图所在模块 ...

  10. CSS学习笔记_day2

    目录 一. css初识 二. 在HTML里面引入css的几种方式 1. 外部引入式 2.文档内嵌式 3. 行内式(元素内嵌式) 三. 选择器 四.盒模型 五.文档标准流 六.浮动 一. css初识 1 ...