Nginx ssi合并頁面的具體實(shí)現(xiàn)
在做一個網(wǎng)站時,頁面上會有很多重復(fù)的內(nèi)容,每個頁面寫一遍很冗余,修改時還容易遺漏,所以可以把公共的部分寫好,放在單獨(dú)的HTML中,用時引用就行了。
nginx配置ssi可以將單個頁面拆分成一個一個的小頁面,訪問頁面時將多個子頁面合并渲染輸出,通過cms去管理這些小頁面,實(shí)現(xiàn)當(dāng)要更改部分頁面內(nèi)容時只需要更改具體某個小頁面。
1. 什么是SSI
SSI:Server Side Include,是一種基于服務(wù)端的網(wǎng)頁制作技術(shù),大多數(shù)(尤其是基于Unix平臺)的web服務(wù)器如Netscape Enterprise Server等均支持SSI命令。
它的工作原因是:在頁面內(nèi)容發(fā)送到客戶端之前,使用SSI指令將文本、圖片或代碼信息包含到網(wǎng)頁中。對于在多個文件中重復(fù)出現(xiàn)內(nèi)容,使用SSI是一種簡便的方法,將內(nèi)容存入一個包含文件中即可,不必將其輸入所有文件。通過一個非常簡單的語句即可調(diào)用包含文件,此語句指示 Web 服務(wù)器將內(nèi)容插入適當(dāng)網(wǎng)頁。而且,使用包含文件時,對內(nèi)容的所有更改只需在一個地方就能完成。
2. nginx 配置ssi實(shí)現(xiàn)
以一個頁面為例,將其拆分為
index.html 首頁主體內(nèi)容 include/header.html 頭部區(qū)域 include/banner.html 輪播圖區(qū)域 include/footer.html 頁面尾部區(qū)域
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--#include virtual="/include/header.html"-->
<!--#include virtual="/include/banner.html"-->
<h1>這是主頁面的body</h1>
<!--#include virtual="/include/footer.html"-->
</body>
</html>header.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>這是header區(qū)域</h1>
</body>
</html>banner.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>這是輪播圖區(qū)域</h1>
</body>
</html>footer.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>這是尾部區(qū)域</h1>
</body>
</html>
配置nginx.conf
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
# 開啟ssi
ssi on;
ssi_silent_errors on;
location / {
# 這里路徑記得修改
root D:\\imooc\\test;
index index.html index.htm;
}
}
}
重啟nginx
nginx -t nginx -s reload
訪問頁面如下圖所示

可以看到 在訪問index.html時將其他的幾個頁面中的內(nèi)容也輸出到了index.html
主要步驟如下
1. 編寫子頁面
2. 使用<!--#include virtual="/include/header.html"--> 將子頁面插入到主頁面中
3. 配置nginx 開啟ssi
nginx 中的ssi的配置參數(shù)如下:
ssi on: 開啟ssi支持 ssi_silent_errors on:默認(rèn)為off,設(shè)置為on則在處理SSI文件出錯時不輸出錯誤信息 ssi_types:默認(rèn)為 ssi_types text/html,如果需要支持shtml(服務(wù)器執(zhí)行腳本,類似于jsp)則需要設(shè)置為ssi_types text/shtml
到此這篇關(guān)于Nginx ssi合并頁面的具體實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)Nginx ssi 合并頁面內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
服務(wù)器重啟后寶塔界面打開顯示404 nginx的解決方法
在阿里云服務(wù)器搭建寶塔界面,服務(wù)器重啟之后打開寶塔顯示404 not found nginx,本文給大家介紹了服務(wù)器重啟后寶塔界面打開顯示404 nginx的解決方法,需要的朋友可以參考下2024-02-02
配置nginx保證frps服務(wù)器與web共用80端口的方法
這篇文章主要介紹了frps服務(wù)端與nginx可共用80端口的方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-06-06
nginx配置靜態(tài)資源的訪問的實(shí)現(xiàn)
本文主要介紹了nginx配置靜態(tài)資源的訪問的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2025-05-05
Nginx實(shí)現(xiàn)負(fù)載均衡和反向代理的方法
Nginx是由俄羅斯人研發(fā)的,應(yīng)對Rambler的網(wǎng)站,并且2004年發(fā)布的第一個版本,Nginx功能豐富,可作為HTTP服務(wù)器,也可作為反向代理服務(wù)器,郵件服務(wù)器,本文給大家介紹了Nginx實(shí)現(xiàn)負(fù)載均衡和反向代理的方法,需要的朋友可以參考下2024-02-02
詳解nginx.conf 中 root 目錄設(shè)置問題
這篇文章主要介紹了詳解nginx.conf 中 root 目錄設(shè)置問題,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-09-09

