shtml 是带有服务器端包含指令的网页文件,全称是 server side html,它本质还是 html 网页,普通双击可以用浏览器打开,但是这种直接打开属于本地静态预览,里面的 ssi 服务器包含代码不会执行,只能看到原始页面框架,想要完整正常运行 shtml 里面的包含语句,就必须搭建支持 ssi 解析的 web 服务器,由服务器先处理 shtml 里面的指令,再把拼接完成的网页发送给浏览器显示,这也是很多人双击打开 shtml 之后发现页面缺模块空白的根本原因,很多初学者分不清本地预览和服务器解析的区别,误以为文件损坏,其实是 shtml 特有的服务器预处理机制造成的,shtml 主要早年用于网站公共头部底部统一调用,减少重复代码,现在新项目使用变少,但是老网站源码里依然经常见到这个格式文件。
文件打开两种方式对照
| 打开方式 | 是否执行 ssi 指令 | 适用场景 | 缺点 |
|---|---|---|---|
| 浏览器直接双击打开 | 不执行 | 快速查看页面基础代码框架 | 包含模块不会加载,页面不完整 |
| web 服务器解析访问 | 执行 | 完整运行 shtml 全部功能 | 需要配置服务器环境 |
本地服务器部署打开步骤
第一步 准备支持 ssi 的 web 服务器,常用可选 Apache Nginx,Apache 默认对 shtml 支持比较友好,Nginx 需要手动开启 ssi 模块配置。
第二步 把 shtml 文件以及它依赖的被包含文件,全部放到网站根目录,比如 Apache 的 htdocs 文件夹。
第三步 修改服务器配置,开启 ssi 解析,Apache 一般在配置文件添加 AddType text/html shtml,同时开启 Options Includes。
第四步 启动服务器,在浏览器地址栏输入本机访问地址,一般是localhost加上端口号,后面跟上 shtml 文件名,完成访问。
第五步 测试验证,查看页面是否成功加载 shtml 里面 include 引入的公共部分,如果正常显示就代表解析成功。
其他辅助打开方式
记事本 或者 VSCode 这类代码编辑器可以直接打开 shtml,作用是查看和编辑源代码,这类编辑器不会渲染网页,只能看到原始代码,适合修改 ssi 指令,不能看到最终渲染效果。
深度补充
shtml 里面核心指令一般是 include,作用是把另外一个文件内容嵌入当前页面,服务器收到 shtml 请求之后,先读取 include 对应的文件,把内容合并,再输出给浏览器。本地直接双击的时候,浏览器没有服务器处理能力,所以 include 标签会原样保留,不会合并内容。如果只是学习代码,用代码编辑器查看源码就足够,如果需要测试动态包含效果,必须搭建服务器环境。
【常见问题】
问题 1 shtml 怎么打开才可以正常执行 include 代码
回答 1 shtml 怎么打开才能执行 include 代码,答案是不能直接双击打开,必须部署支持 ssi 的 web 服务器,通过localhost访问,由服务器解析 shtml 里面的 include 指令,完成文件合并渲染。
问题 2 shtml 怎么打开之后页面空白是什么原因
回答 2 shtml 怎么打开之后页面空白,大多是直接双击本地打开,服务器包含指令没有执行,缺少被引入的公共文件,也有可能是被包含文件路径写错,或者服务器没有开启 ssi 解析权限。
问题 3 shtml 怎么打开可以同时编辑代码和预览页面
回答 3 shtml 怎么打开可以兼顾编辑和预览,可以使用 VSCode 打开 shtml 源码进行编辑,同时搭配本地 Apache 服务器,在浏览器访问预览完整解析后的页面,实现代码修改和渲染效果同步查看。
【免责申明】
本内容仅作为技术学习参考,不同服务器版本配置参数存在差异,实际操作请参考对应服务器官方文档,本内容不替代专业运维人员技术指导。


