HTML静态页面引入公共html文件(ssi服务器端指令详解)

你是否曾经或正在为如何能够在最短的时间内完成对一个包含上千个页面的网站的修改而苦恼?

那么可以看一下本文的介绍,或许能够对你有所帮助。

什么是SSI? 

SSI是英文Server Side Includes的缩写,翻译成中文就是服务器端包含的意思。从技术角度上说,SSI就是HTML文件中,可以通过注释行调用的命令或指针。

SSI 具有强大的功能,只要使用一条简单的SSI 命令就可以实现整个网站的内容更新,动态显示时间和日期,以及执行shell和CGI脚本程序等复杂的功能。SSI 可以称得上是那些资金短缺、时间紧张、工作量大的网站开发人员的最佳帮手。

SSI最初在NCSA服务器平台上推出,在Apache服务器中得到扩展和加强,目前已经可以在几乎所有的服务器上运行。本文将主要结合Apache服务器介绍SSI的使用方法。

如何启动SSI? 

在Apache服务器下,可以通过直接编辑服务器配置文件或者在需要使用SSI的目录中创建.htaccess文件启动SSI。具体来说,过程如下:

1.服务器配置文件 

如果用户具有对服务器配置文件的访问权限,可以通过编辑文件access.conf和srm.conf启动SSI。 
首先使用Telnet远程登录服务器,找到配置文件的存放目录。

一般来说,Apache服务器的配置文件都被保存在“/usr/local/etc/httpd/conf”目录下。

使用任何一种文字编辑器打开文件srm.conf,找到以下几行:

# If you want to use server side includes, or CGI outside
# ScriptAliased directories, uncomment the following lines.
#AddType text/x-server-parsed-html .shtml
#AddType application/x-httpd-CGI .CGI

用户的配置文件中可能没有上述的注释指令行,但是只要找到以AddType开头的两行并且去掉每一行最前面的“#”符号即可。 
保存所做的修改,然后再打开文件access.conf。用户需要在文件中找到设置DocumentRoot(根文件)的部分。一般来说该段文本如下,但是不排除<Directory>和</Directory>标签之间还包含其它设置内容。

# This should be changed to whatever you set DocumentRoot to.
<Directory /usr/local/etc/httpd/htdocs>
# This may also be "None", "All", or any combination of "Indexes",
# "Includes", or "FollowSymLinks"
Options Indexes FollowSymLinks Includes
</Directory>

如果用户不希望执行脚本或shell命令,可以在options选项行中加入关键字IncludesNOEXEC,这样可以允许SSI,但是不能执行CGI或脚本命令。

(注:最新版本的Apache服务器只有一个配置文件httpd.conf,以上所提到的内容都已经被包含在该文件中)

2.创建文件.htaccess 

如果用户不能直接访问服务器配置文件,可以使用文件编辑器创建一个名为.htaccess的文件。注意,文件名前一定要有符号“.”,这样服务器才能知道该文件是隐藏文件,从而提高文件的安全性,避免错误操作。在.htaccess文件中需要加入以下三行文字:

Options Indexes FollowSymLinks Includes
AddType application/x-httpd-CGI .CGI
AddType text/x-server-parsed-html .shtml

完成之后可以把.htaccess文件上传到服务端的相应目录,该文件对所有子目录有效。如果用户希望在目录级上禁止CGI或shell命令,可以在.htaccess文件中的Options选项行加入关键字IncludesNOEXEC。

3.使用.shtml还是.html? 

任何包含SSI的文件在下传到客户端之前,都必须经过服务器的解析过程。

虽然从某种程度上这样会增加服务器的负载,但是除非用户的网站每天有几百万的访问用户,某则服务器的性能不会有明显的下降。

不过,如果不是需要在每个页面都使用SSI的话,确实没有必要让服务器解析每一个页面。如果用户只希望在几个特殊页面中使用SSI,可以将文件的后缀名改为.shtml,这样服务器就可以只解析包含SSI的.shtml文件。

另一方面,如果有多个页面使用了SSI,但是用户不希望使用.shtml的后缀名时,可以在.htaccess文件中使用以下命令行: 
AddType text/x-server-parsed-html .html 

SSI语法 

SSI在使用时遵循以下格式:

<!--#directive parameter="value"--> 

其中,directive是向服务器发送的指令名称,parameter是指令的操作对象,而value则是用户希望得到的指令处理结果。  
所有的SSI命令都是以“<!--#”开始,其中“<!—”和“#”之间不能有任何空格,否则服务器会把SSI命令当称普通的文件注释处理,不会显示出任何结果,也不会产生错误提示。

此外,SSI命令中的“=”两边不能有空格,右边的值必须包含在双引号内,后面可以跟空格,最后是结束标签“-->”。

SSI命令包含六大类指令以及各自的参数,具体如下:

directives parameters 
Config errmsg, timefmt, sizefmt 
include virtual, file 
echo var 
fsize file 
flastmod file 
exec cmd, cgi

下面我们将逐一进行介绍。

1.Config命令 

Config命令主要用于修改SSI的默认设置。其中:

Errmsg:设置默认错误信息。为了能够正常的返回用户设定的错误信息,在HTML文件中Errmsg参数必须被放置在其它SSI命令的前面,否则客户端只能显示默认的错误信息,而不是由用户设定的自定义信息.

<!--#config errmsg="Error! Please email webmaster@mydomain.com --> 

Timefmt:定义日期和时间的使用格式。Timefmt参数必须在echo命令之前使用。

<!--#config timefmt="%A, %B %d, %Y"--> 

<!--#echo var="LAST_MODIFIED" --> 

显示结果为:

Wednesday, April 12, 2000 

也许用户对上例中所使用的%A %B %d感到很陌生,下面我们就以表格的形式总结一下SSI中较为常用的一些日期和时间格式。 
格式 说明 实例

%% %  
%a 一周七天的缩写形式 Thu  
%A 一周七天 Thursday  
%b 月的缩写形式 Apr  
%B 月 April  
%d 一个月内的第几天 13  
%D mm/dd/yy日期格式 04/13/00  
%H 小时(24小时制,从00到23) 01  
%I 小时(12小时制,从00到11) 01  
%j 一年内的第几天,从01到365 104  
%m 一年内的第几个月,从01到12 04  
%M 一小时内的第几分钟,从00到59 10  
%p AM或PM AM  
%r 12小时制的当地时间,格式为 01:10:18 AM  
%I:%M:%S AM | PM  
%S 一分钟内的第几秒,从00到59 18  
%T 24小时制的%H:%M:%S时间格式 01:10:18  
%U 一年内的第几个星期,从00到 15   52,以星期天作为每个星期的第一天 
%w 一星期内的第一天,从0到6 4  
%W 一年内的第几个星期,从00 15   到53,以星期一作为每个星期的第一天  
%y 年的缩写形式,从00到99 00  
%Y 用四位数字表示一年 2000  
%Z 时区名称 MDT

Sizefmt:决定文件大小是以字节、千字节还是兆字节为单位表示。如果以字节为单位,参数值为“bytes”;对于千字节和兆字节可以使用缩写形式。同样,sizefmt参数必须放在fsize命令的前面才能使用.

<!--#config sizefmt="bytes" --> 
<!--#fsize file="index.html" -->  

2.Include命令 

Include命令可以把其它文档中的文字或图片插入到当前被解析的文档中,是整个SSI的关键所在。通过Include命令只需要改动一个文件就可以瞬间更新整个站点!

Include命令具有两个不同的参数,如果使用错误的参数更新站点的话,不仅达不到初衷,反而会得到一大堆的错误信息。

Virtual:给出到服务器端某个文档的虚拟路径。例如:

<!--#include virtual="/includes/header.html" --> 

File:给出到当前目录的相对路径,其中不能使用"../",也不能使用绝对路径。例如:

<!--#include file="header.html" -->

这就要求每一个目录中都包含一个header.html文件。

为了更加合理的组织站点的内容,用户可以在根目录下创建includes子目录来存放所有的包含文件。Virtual参数可以通知服务器所要包含的是一个虚拟文件,即文件和当前被解析的文档不是位于同一个目录,而是存放在其它目录中。

服务器会根据该参数的值找到根目录下的includes子目录。使用这种方法,用户可以把所有HTML文档包含的文件放在一个目录中,而根据相互之间的关系把不同的页面保存在不同的目录或子目录中。

无论服务器解析哪一个文档都可以找到所包含的文件,不会产生任何错误。 
不过这里有一个小问题需要解决。一般我们都会在页面中加入一些TITLE和META标签,如果我们规定所有的页面都调用相同的页眉文件的话,就显得很不灵活。

用户碰到这样的问题时,可以使用两个包含文件,一个设置TITLE标签前的内容,另一个设置META标签后的部分,而在两个包含文件之间则可以添加任何定制内容。例如:

<!--#include virtual="/includes/header1.html" -->
<TITLE>Your Page Title</TITLE>
<LINK rel = STYLESHEET href = "http://domain.com/styles/my.css" Type = "text/css" >
<META NAME = "Description" CONTENT = " Description of page">
<META NAME = "Keywords" CONTENT = "keywords for page" >
<!--#include virtual="/includes/header2.html" --> 

这里放置页面内容

<!--#include virtual="/includes/footer.html" --> 

从上我们可以看出通过在页面中包含页眉和页脚可以大大减少站点更新的工作量。但是如果我们希望动态显示一些内容,例如页面的最后更新时间等该怎么办呢?没问题,我们可以把包含文件使用.html后缀保存,这样就可以在包含文件中调用其它的包含文件。

File:给出到当前目录的相对路径,其中不能使用“../”,也不能使用绝对路径。例如:

<!--#include file="header.html" --> 

这就要求每一个目录中都包含一个header.html文件。当然,采用这样的方法并不比更新每一个页面简单多少,但是如果用户只更新一、两个文件的话还是很方便的。例如,如果我们不希望让一个对HTML不熟悉的人直接改动网站中的新闻页面的话,可以只让他更新一个单独的文本文件,然后再把该文件包含到HMTL文档中,这样即不会破坏原页面,同时又更新了内容,两全其美

3.Echo: 

Echo命令可以显示以下各环境变量:

DOCUMENT_NAME:显示当前文档的名称。

<!--#echo var="DOCUMENT_NAME" --> 

显示结果为:

index.html 

DOCUMENT_URI:显示当前文档的虚拟路径。例如:

<!--#echo var="DOCUMENT_URI" --> 

显示结果为: 
/YourDirectory/YourFilename.html 

随着网站的不断发展,那些越来越长的URL地址肯定会让人头疼。如果使用SSI,一切就会迎刃而解。因为我们可以把网站的域名和SSI命令结合在一起显示完整的URL,即:

http://YourDomain<!--#echo var="DOCUMENT_URI" --> 

QUERY_STRING_UNESCAPED:显示未经转义处理的由客户端发送的查询字串,其中所有的特殊字符前面都有转义符“\”。例如:

<!--#echo var="QUERY_STRING_UNESCAPED" --> 

DATE_LOCAL:显示服务器设定时区的日期和时间。用户可以结合config命令的timefmt参数,定制输出信息。例如:

<!--#config timefmt="%A, the %d of %B, in the year %Y" -->  
<!--#echo var="DATE_LOCAL" --> 

显示结果为:

Saturday, the 15 of April, in the year 2000 

DATE_GMT:功能与DATE_LOCAL一样,只不过返回的是以格林尼治标准时间为基准的日期。例如:

<!--#echo var="DATE_GMT" --> 

LAST_MODIFIED:显示当前文档的最后更新时间。同样,这是SSI中非常实用的一个功能,只要在HTML文档中加入以下这行简单的文字,就可以在页面上动态的显示更新时间。

<!--#echo var="LAST_MODIFIED" --> 

CGI环境变量 

除了SSI环境变量之外,echo命令还可以显示以下CGI环境变量: 
SERVER_SOFTWARE:显示服务器软件的名称和版本。例如: 
<!--#echo var="SERVER_SOFTWARE" --> 
SERVER_NAME: 显示服务器的主机名称,DNS别名或IP地址。例如: 
<!--#echo var="SERVER_NAME" --> 
SERVER_PROTOCOL:显示客户端请求所使用的协议名称和版本,如HTTP/1.0。例如: 
<!--#echo var="SERVER_PROTOCOL" --> 
SERVER_PORT:显示服务器的响应端口。例如: 
<!--#echo var="SERVER_PORT" --> 
REQUEST_METHOD:显示客户端的文档请求方法,包括GET, HEAD, 和POST。例如: 
<!--#echo var="REQUEST_METHOD" --> 
REMOTE_HOST:显示发出请求信息的客户端主机名称。 
<!--#echo var="REMOTE_HOST" --> 
REMOTE_ADDR:显示发出请求信息的客户端IP地址。 
<!--#echo var="REMOTE_ADDR" --> 
AUTH_TYPE:显示用户身份的验证方法。 
<!--#echo var="AUTH_TYPE" --> 
REMOTE_USER:显示访问受保护页面的用户所使用的帐号名称。 
<!--#echo var="REMOTE_USER" -->

4.Fsize:

显示指定文件的大小,可以结合config命令的sizefmt参数定制输出格式。

<!--#fsize file="index_working.html" --> 

5.Flastmod:

显示指定文件的最后修改日期,可以结合config 命令的timefmt参数控制输出格式。

<!--#config timefmt="%A, the %d of %B, in the year %Y" -->  
<!--#flastmod file="file.html" --> 

这里,我们可以利用flastmod参数显示出一个页面上所有链接页面的更新日期。方法如下:

<!--#config timefmt=" %B %d, %Y" -->
<A href="/directory/file.html" rel="external nofollow" >File</A>
<!--#flastmod virtual="/directory/file.html" -->
<A href="/another_directory/another_file.html" rel="external nofollow" >Another File</A>
<!--#flastmod virtual="/another_directory/another_file.html" --> 

显示结果为:

File April 19, 2000  
Another File January 08, 2000

也许有的读者会认为两个链接就这么复杂,一点也不方便。其实,如果页面上有20个或者更多的链接,而且每个链接都定期更新的话,就可以看出使用flastmod显示修改日期的作用。

6.Exec 

Exec命令可以执行CGI脚本或者shell命令。使用方法如下:

Cmd:使用/bin/sh执行指定的字串。如果SSI使用了IncludesNOEXEC选项,则该命令将被屏蔽。

Cgi:可以用来执行CGI脚本。例如,下面这个例子中使用服务端cgi-bin目录下的counter.pl脚本程序在每个页面放置一个计数器: 
<!--#exec cgi="/cgi-bin/counter.pl"--> 

(0)

相关推荐

  • Apache下开启SSI配置使html支持include包含的方法

    写页面的同学通常会遇到这样的烦恼,就是页面上的 html 标签越来越多的时候,寻找指定的部分就会很困难,那么能不能像 javascript 一样写在不同的文件中引入呢?答案是有的,apache 能做到. 举个简单的例子,比如有如下的 html 文件(命名为 index.html): <input type='text' /> <input type='button' value='press' /> 一个简单的文本框和按钮,我现在想把按钮部分的 html 写在另一个 .html 的

  • SSI技术—SHTML的解释(生成静态时用的最火)

    什么是shtml SHTML语法 SHTML教程 格式 编写 技术 使用SSI (Server Side Include)技术 想要找到既富有创意的平面设计人员,又有脚本开发经验的人员,实在是太难了.而如果一个百分之百的页面都是php脚本的网站,将为页面维护带来非常大的困难.而且使用了php的自动加头和加尾的方法,使得几乎所有页面都是语义不完整的,不能借助任何一款页面设计工具工作,是另一个弊病. 利用SSI技术,可以有效的将HTML网页和CGI脚本逻辑上分开,也可以将重复的HTML元素抽象和独立

  • IIS SHTML支持设置方法(SSI)

    可执行文件在: C:\WINDOWS\system32\inetsrv\ssinc.dll .扩展名为:shtml/shtm 打开IIS管理器,打开"本地计算机"的属性-->MIME类型-->新建后缀名:.shtmlMIME类型:text/html 后缀名:.shtmMime类型:text/html 然后点击确定.找到Web服务扩展(在IIS下面,与网站平行),把"在服务端的包含文件"扩展启用,就可以了.(必须重新启动IIS,否则还是无法访问!)在IIS

  • 让Apache支持cgi、SSI、shtml的配置方法

    1.首先明确,只能够指定某个确定的目录,支持cgi,即运行该目录执行cgi程序:否则不太安全.寻找: 复制代码 代码如下: #    # "C:/Program Files/Apache Group/Apache/cgi-bin" should be changed to whatever your ScriptAliased    # CGI directory exists, if you have that configured.    #    <Directory &q

  • apache SHTML网页SSI使用详解

    方法一:下面是详细的设置apache支持shtml的设置步骤开启includes模块运行shtml 0.开启php环境安装目录 (我的为D:\wamp\Apache2\conf下) 的httpd.conf 文件中的(大概408-409行处): 1. AddType text/html .shtml AddOutputFilter INCLUDES .shtml 2.(F:/shz 为运行文件存放的地方) DocumentRoot "F:/shz" (大概150处) <Direct

  • 配置Apache支持shtml(SSI)的方法

    打开http.conf文件,搜索shtml 把最前两行的#号去掉,即成如下 如是要想整个服务器配置shtml的话 再搜索Options Indexes FollowSymLinks 在里面添加Includes如下所示:] OK 重庆apache 然后测试,建立两个文件,其实一个叫header.shtml和一个index.shtml header.shtml代码如下: 用了两种形式的包含:如果想要了解,请找相关文档 然后访问: shtml配置成功...很好很强大吧. 下面再说一下如是不是全局配置,

  • HTML静态页面引入公共html文件(ssi服务器端指令详解)

    你是否曾经或正在为如何能够在最短的时间内完成对一个包含上千个页面的网站的修改而苦恼? 那么可以看一下本文的介绍,或许能够对你有所帮助. 什么是SSI?  SSI是英文Server Side Includes的缩写,翻译成中文就是服务器端包含的意思.从技术角度上说,SSI就是HTML文件中,可以通过注释行调用的命令或指针. SSI 具有强大的功能,只要使用一条简单的SSI 命令就可以实现整个网站的内容更新,动态显示时间和日期,以及执行shell和CGI脚本程序等复杂的功能.SSI 可以称得上是那些

  • vue 引入公共css文件的简单方法(推荐)

    如果不想把css写在单文件组件里如这样: <template> <div id="app"> <div class='nav-box'> <ul class='nav'> <li> <a href="#/" rel="external nofollow" rel="external nofollow" >home</a> </li>

  • 对vue2.0中.vue文件页面跳转之.$router.push的用法详解

    vue2.0在使用的过程中, .vue文件之间的跳转,在template中的常见写法是: <router-link to="/miniCard/statement/horizon"> <button class="btn btn-default colorDe">继续</button> </router-link> 但是有时的需求是页面不直接跳转,有确认弹框或者其他事件,此时就需要在js中设置跳转,常用的一种方法是 .

  • web前端vue之vuex单独一文件使用方式实例详解

    Vuex 是什么? Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化.Vuex 也集成到 Vue 的官方调试工具 devtools extension,提供了诸如零配置的 time-travel 调试.状态快照导入导出等高级调试功能. 上次我用了一个加减的例子为大家讲解vuex的基本的使用方式,和在什么样的情况下使用.上次还是在一个组件内把这个例子简单的展示了下,这次我把vuex抽离出来一个

  • 基于js文件加载优化(详解)

    在js引擎部分,我们可以了解到,当渲染引擎解析到script标签时,会将控制权给JS引擎,如果script加载的是外部资源,则需要等待下载完后才能执行. 所以,在这里,我们可以对其进行很多优化工作. 放置在BODY底部 为了让渲染引擎能够及早的将DOM树给渲染出来,我们需要将script放在body的底部,让页面尽早脱离白屏的现象,即会提早触发DOMContentLoaded事件. 但是由于在IOS Safari, Android browser以及IOS webview里面即使你把js脚本放到

  • Django实现web端tailf日志文件功能及实例详解

    这是Django Channels系列文章的第二篇,以web端实现tailf的案例讲解Channels的具体使用以及跟Celery的结合 通过上一篇 <Django使用Channels实现WebSocket--上篇> 的学习应该对Channels的各种概念有了清晰的认知,可以顺利的将Channels框架集成到自己的Django项目中实现WebSocket了,本篇文章将以一个Channels+Celery实现web端tailf功能的例子更加深入的介绍Channels 先说下我们要实现的目标:所有

  • JavaScript 使用Ckeditor+Ckfinder文件上传案例详解

    目录 一.准备工作 二.解压 三.开始集成 一.准备工作 Ckeditor_4.5.7_full + Ckfinder_java_2.6.0 二.解压 1.解压ckeditor,和平常文件解压相同,正常解压即可 2.解压ckfinder,解压完成后进入ckfinder文件夹下,发现有CKFinderJava-2.6.0.war文件,继续解压. 3.注意看红框部分 三.开始集成 1.准备工作完成,将图1中的ckeditor,及图3中的ckfinder文件夹拷贝到我们自己的项目的WebContent

  • 公共Hooks封装文件下载useDownloadFile实例详解

    目录 引言 项目环境 封装前提:各方法对比 封装分解:下载核心代码 封装分解:用户体验设计 useDownloadFile.js完整代码 引言 对于经常需要开发企业管理后台的前端开发来说,必不可少的需要使用表格对于数据进行操作,在对于现有项目进行代码优化时,封装一些公共的Hooks. 本篇文章为useDownloadFile.js 基于个人项目环境进行封装的Hooks,仅以本文介绍封装Hooks思想心得,故相关代码可能不适用他人 项目环境 Vue3.x + Ant Design Vue3.x +

  • ASP.NET页面之间传值的方式之Application实例详解

    Application Application变量在整个应用程序生命周期中都是有效的,类似于使用全局变量一样,所以可以在不同页面中对它进行存取.它和Session变量的区别在于,前者是所有的用户共用的全局变量,后者是各个用户独有的全局变量. 举例来解释: 网站访问的计数器变量一般采用Application变量,多个请求访问时共享这一个变量,均可对它进行操作,该变量可以被整个应用程序的各个页面直接使用. 用户登陆的帐号名一般采用Session变量,多个请求访问时有各自的Session变量,只能对自

  • 利用jQuery异步上传文件的插件用法详解

    现在想实现用ajax来上传文件的功能,但是却发现Jquery自带的ajax方法只能上传文件名,而不能上传文件:用form提交虽然能够上传文件,但是却要刷新页面...多方查找下找到了一个可用的jQuery插件,刚好可以满足异步上传文件的要求. 代码 jquery.form.js 用法 这个插件是基于表单提交的,我们只要正常的写一段提交文件的表单,如: <form id="myForm" action="comment.php" method="post

随机推荐