首頁 > 後端開發 > php教程 > 使用 Nginx 部署靜態頁面的方法

使用 Nginx 部署靜態頁面的方法

不言
發布: 2023-03-29 17:24:01
原創
4201 人瀏覽過

這篇文章主要介紹了關於使用Nginx 部署靜態頁面的方法,有著一定的參考價值,現在分享給大家,有需要的朋友可以參考一下

Nginx 介紹

Nginx 是俄羅斯人編寫的十分輕量級的HTTP 伺服器, Nginx,它的發音為“ engine X ”,是一個高效能的HTTP 和反向代理伺服器,同時也是一個IMAP/ POP3/ SMTP 代理伺服器。 Nginx 是由俄羅斯人 Igor Sysoev 為俄羅斯訪問量第二的 Rambler.ru 站點開發的,它已經在該站點運行超過兩年半了。 Igor Sysoev 在建立的專案時,使用基於 BSD 許可。

Nginx 作為 HTTP 伺服器,有以下幾個基本特性:

  1. #處理靜態文件,索引檔案以及自動索引;開啟檔案描述符緩衝。

  2. 無快取的反向代理加速,簡單的負載平衡和容錯。

  3. FastCGI,簡單的負載平衡和容錯。

  4. 模組化的結構。包括 gzipping, byte ranges, chunked responses,以及 SSI-filter 等 filter。如果由 Fast CGI 或其它代理伺服器處理單頁中存在的多個 SSI,則這項處理可以並行運行,而不需要相互等待。

  5. 支援 SSL 和 TLSSNI。

即 Nginx 的優點:輕量、高效能、並發能力強。用來部署靜態頁面也是相當便捷。

這種高效能得益於 Nginx 的框架。在 Nginx 啟動後,會有一個 master 進程和多個 worker 進程。 master 進程主要用來管理worker 進程,包含:接收來自外界的訊號,向各worker 進程發送訊號,監控worker 進程的運作狀態,當worker 進程退出後(例外),會自動重新啟動新的worker 進程。而基本的網路事件,則是放在 worker 進程中來處理的。多個 worker 進程之間是對等的,他們同等競爭來自客戶端的請求,各進程相互之間是獨立的。一個請求,只可能在一個 worker 進程中處理,一個 worker 進程,不可能處理其它進程的請求。 worker 進程的數量是可以設定的,一般我們會設定與機器 cpu 核數一致,這與 Nginx 的進程模型以及事件處理模型有關。

為何選用Nginx

#說到Nginx,可能第一個反應就是反向代理人與負載均衡了。那什麼是 反向代理,什麼又是 負載平衡 呢?

反向代理

首先了解什麼是 前向代理 。代理(Proxy) 也稱網路代理,是一種特殊的網路服務,通俗來講,就是在客戶端和目標伺服器之間的充當中間人,接收客戶端的請求,再根據客戶端請求向目標伺服器發起相應的請求,從目標伺服器取得指定資源後傳回給客戶端。且代理伺服器可以對目標伺服器的資源下載至本機緩存,如果客戶端所要取得的資源在代理伺服器的快取之中,則代理伺服器並不會再向目標伺服器發起請求,而是直接傳回快取的資源。

其實代理伺服器非常常見,就例如因為 GWF 而存在的一些科學上網的代理商,就是利用國外伺服器作為代理伺服器,從而正確解析網域名稱來實現科學上網。代理伺服器也可以實現隱藏真實 IP,例如著名的 Tor (洋蔥路由器)就是透過多重代理和一些加密技術來實現匿名交流。

而 反向代理 則是在伺服器端作為代理使用,而不是客戶端。也就是說,前向代理是代理內部網路使用者存取網路上伺服器的連線請求,反向代理程式是以代理伺服器來接受Internet 上的連線請求,然後將請求轉送給內部網路上的伺服器,並將從伺服器上得到的結果傳回給Internet 上請求連線的客戶端,此時的代理伺服器對外就表現為一個伺服器。

負載平衡

反向代理負載平衡技術是將將來自Internet 上的連接請求以反向代理的方式動態地轉發給內部網路上的多台伺服器進行處理,從而達到負載平衡的目的。

真巧, Nginx 都做到了

Nginx 作為一個優秀的代理伺服器,反向代理和負載平衡必然是都具備的。想要更詳細得了解這方面的知識和使用方法,可參考文末給予的參考資料: Nginx 入門指南。

Nginx 安裝

本人使用的是騰訊雲端的伺服器,版本為: Ubuntu Server 14.04.1 LTS 32 位元。

$ apt-get install nginx
登入後複製

Mac OS 系統參考這篇文章:Installing Nginx in Mac OS X

##Nginx 設定

簡單地設定Nginx 的設定文件,以便在啟動Nginx 時去啟用這些配置。而本文的重點也是於此。

Nginx 的配置系统由一个主配置文件和其他一些辅助的配置文件构成。这些配置文件均是纯文本文件,一般地,我们只需要配置主配置文件就行了。例如在我的服务器上是在:/etc/nginx/nginx.conf

指令上下文

nginx.conf 中的配置信息,根据其逻辑上的意义,对它们进行了分类,也就是分成了多个作用域,或者称之为配置指令上下文。不同的作用域含有一个或者多个配置项。

其中每个配置项由配置指令和指令参数构成,形成一个键值对,# 后面地为注释,理解起来也非常容易。

一般配置文件的结构和通用配置如下:

user www-data;  # 运行 nginx 的所属组和所有者
worker_processes 1;  # 开启一个 nginx 工作进程,一般 CPU 几核就写几
pid /run/nginx.pid;  # pid 路径

events {
    worker_connections 768;  # 一个进程能同时处理 768 个请求
    # multi_accept on;
}

# 与提供 http 服务相关的配置参数,一般默认配置就可以,主要配置在于 http 上下文里的 server 上下文
http {
    ##
    # Basic Settings
    ##

    ... 此处省略通用默认配置

    ##
    # Logging Settings
    ##
    ... 此处省略通用默认配置

    ##
    # Gzip Settings
    ##

    ... 此处省略通用默认配置

    ##
    # nginx-naxsi config
    ##

    ... 此处省略通用默认配置

    ##
    # nginx-passenger config
    ##

    ... 此处省略通用默认配置

    ##
    # Virtual Host Configs
    ##

    ... 此处省略通用默认配置

    # 此时,在此添加 server 上下文,开始配置一个域名,一个 server 配置段一般对应一个域名
    server {
        listen 80;        # 监听本机所有 ip 上的 80 端口
        server_name _;      # 域名:www.example.com 这里 "_" 代表获取匹配所有
        root /home/filename/;  # 站点根目录

        location / {       # 可有多个 location 用于配置路由地址
            try_files index.html =404;
        }
}

# 邮箱的配置,因为用不到,所以把这个 mail 上下文给注释掉
#mail {
#    # See sample authentication script at:
#    # http://wiki.nginx.org/ImapAuthenticateWithApachePhpScript
#    
#    # auth_http localhost/auth.php;
#    # pop3_capabilities "TOP" "USER";
#    # imap_capabilities "IMAP4rev1" "UIDPLUS";
#   
#    server {
#        listen   localhost:110;
#        protocol  pop3;
#        proxy    on;
#    }
#
#    server {
#        listen   localhost:143;
#        protocol  imap;
#        proxy    on;
#    }
#}
登入後複製

这里需要注意的是 http 上下文里的 server 上下文。

server {
    listen 80;        # 监听本机所有 ip 上的 80 端口
    server_name _;      # 域名:www.example.com 这里 "_" 代表获取匹配所有
    root /home/filename/;  # 站点根目录

    location / {       # 可有多个 location 用于配置路由地址
      try_files index.html =404;
    }
}
登入後複製

这里的 root 字段最好写在 location 字段的外边,防止出现无法加载 css、js 的情况。因为 css、js 的加载并不是自动的,nginx 无法执行,需要额外的配置来返回资源,所以,对于静态页面的部署,这样做是最为方便的。

这里对 root 作进一步解释,例如在服务器上有 /home/zhihu/ 目录,其下有 index.html 文件和 css/ 以及 img/ , root /home/zhihu/; 就将指定服务器加载资源时是在 /home/zhihu/ 下查找。

其次, location 后的匹配分多种,其各类匹配方式优先级也各不相同。这里列举一精确匹配例子:

server {
    listen 80;        
    server_name _;      
    root /home/zhihu/;  

    location = /zhihu {
      rewrite ^/.* / break;
      try_files index.html =404;
    }
}
登入後複製

此时,访问 www.example.com/zhihu 就会加载 zhihu.html 出来了。由于 location 的精确匹配,只有访问 www.example.com/zhihu 这个路由时才会正确响应,而且此时要通过 rewrite 正则匹配,把 /zhihu 解析替换成原来的 / 。关于更多 location 字段用法,可以在文章最后给出的参考资料中查看。

关于使用 nginx 部署静态页面,最简单便捷的配置方法

上面说了挺多关于配置的说明,下面推荐一种个人认为最为便捷的配置方法。(特此感谢 guyskk 学长的答疑解惑)

首先创建一个目录,例如: /home/ubuntu/website 然后在这个 website 文件夹下可以放置你需要部署的静态页面文件,例如 website 下我有 google、zhihu、fenghuang 这三个文件夹,其中 server 字段配置如下:

server {
    listen 80;
    server_name _;
    root /home/ubuntu/website;
    index index.html;
}
登入後複製

这里每个文件夹下面的静态页面文件名都是 index.html ,我以前有个很不好的习惯,比如 zhihu 页面就喜欢命名为 zhihu.html ,但就从前端来看,这也是不符合规范的。

这样配置的话,例如当你访问 www.showzeng.cn/google/ 时,nginx 就会去 website 目录下的 google 文件夹下寻找到 index.html 并把 google 页面返回,同理,访问 www.showzeng.cn/zhihu/ 时,会寻找到 zhihu 文件夹下的 index.html 并把 zhihu 页面返回。

而在 zhihu、google 、fenghuang 文件夹的同级目录上,再添加你的域名首页 index.html 时,访问 www.example.com 时就会返回了。

这里唯一美中不足的是,访问域名中 www.showzeng.cn/zhihu 末尾会自动加上 / ,在浏览器中按 F12 调试会发现 www.showzeng.cn/zhihu 为 301 状态码,因为 index.html 是在 zhihu/ 文件夹下,所以在搜索过程中会重定向到 www.showzeng.cn/zhihu/ ,起初我是接受不了的,那一 / 看起来太难受了,但是只要一想到要一个一个 location 字段去匹配,我一下子就接受了。不知道你怎么看,反正我是接受了。

Nginx 启动运行

$ sudo nginx -s reload
登入後複製

使用 reload 方法不用重启服务,直接重新加载配置文件,客户端感觉不到服务异常,实现平滑切换。当然你也可以重新启动 nginx 服务。

$ sudo service nginx restart
登入後複製

Nginx 停止运行

$ sudo nginx -s stop
登入後複製

相关推荐:

nginx应用:使用nginx进行负载均衡

使用nginx搭建高可用,高并发的wcf集群

以上是使用 Nginx 部署靜態頁面的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板