Nginx 優化靜態文件訪問


簡介

Web 開發中需要的靜態文件有:CSS、JS、字體、圖片,可以通過web框架進行訪問,但是效率不是最優的。

Nginx 對於處理靜態文件的效率要遠高於 Web 框架,因為可以使用 gzip 壓縮協議,減小靜態文件的體積加快靜態文件的加載速度、開啟緩存和超時時間減少請求靜態文件次數。
下面就介紹如何通過 Nginx 管理靜態文件的訪問,優化網站的訪問速度。

一、開啟 gzip

配置介紹和參數如下,建議使用時刪掉注釋。

gzip on;
#該指令用於開啟或關閉gzip模塊(on/off)

gzip_buffers 16 8k;
#設置系統獲取幾個單位的緩存用於存儲gzip的壓縮結果數據流。16 8k代表以8k為單位,安裝原始數據大小以8k為單位的16倍申請內存

gzip_comp_level 6;
#gzip壓縮比,數值范圍是1-9,1壓縮比最小但處理速度最快,9壓縮比最大但處理速度最慢

gzip_http_version 1.1;
#識別http的協議版本

gzip_min_length 256;
#設置允許壓縮的頁面最小字節數,頁面字節數從header頭得content-length中進行獲取。默認值是0,不管頁面多大都壓縮。這里我設置了為256

gzip_proxied any;
#這里設置無論header頭是怎么樣,都是無條件啟用壓縮

gzip_vary on;
#在http header中添加Vary: Accept-Encoding ,給代理服務器用的

gzip_types
    text/xml application/xml application/atom+xml application/rss+xml application/xhtml+xml image/svg+xml
    text/javascript application/javascript application/x-javascript
    text/x-json application/json application/x-web-app-manifest+json
    text/css text/plain text/x-component
    font/opentype font/ttf application/x-font-ttf application/vnd.ms-fontobject
    image/x-icon;
#進行壓縮的文件類型,這里特別添加了對字體的文件類型

gzip_disable "MSIE [1-6]\.(?!.*SV1)";
#禁用IE 6 gzip

二、擴展壓縮類型

修改 /etc/nginx/mime.types 文件,增加需要壓縮的文件對應 type 到上述 gzip 配置中。下面幾乎涵蓋了所有靜態文件對應的類型:

types {
    application/atom+xml                atom;
    application/dart                    dart;
    application/gzip                    gz;
    application/java-archive            jar war ear;
    application/javascript              js jsonp;
    application/json                    json;
    application/owl+xml                 owl owx;
    application/pdf                     pdf;
    application/postscript              ai eps ps;
    application/rdf+xml                 rdf;
    application/rss+xml                 rss;
    application/vnd.ms-fontobject       eot;
    application/x-7z-compressed         7z;
    application/x-bittorrent            torrent;
    application/x-chrome-extension      crx;
    application/x-font-otf              otf;
    application/x-font-ttf              ttc ttf;
    application/x-font-woff             woff;
    application/x-opera-extension       oex;
    application/x-rar-compressed        rar;
    application/x-shockwave-flash       swf;
    application/x-web-app-manifest+json webapp;
    application/x-x509-ca-cert          crt der pem;
    application/x-xpinstall             xpi;
    application/xhtml+xml               xhtml;
    application/xml                     xml;
    application/xml-dtd                 dtd;
    application/zip                     zip;

    audio/midi                          kar mid midi;
    audio/mp4                           aac f4a f4b m4a;
    audio/mpeg                          mp3;
    audio/ogg                           oga ogg;
    audio/vnd.wave                      wav;
    audio/x-flac                        flac;
    audio/x-realaudio                   ra;

    image/bmp                           bmp;
    image/gif                           gif;
    image/jpeg                          jpe jpeg jpg;
    image/png                           png;
    image/svg+xml                       svg svgz;
    image/tiff                          tif tiff;
    image/webp                          webp;
    image/x-icon                        cur ico;

    text/cache-manifest                 appcache manifest;
    text/css                            css less;
    text/csv                            csv;
    text/html                           htm html shtml;
    text/mathml                         mml;
    text/plain                          txt;
    text/rtf                            rtf;
    text/vcard                          vcf;
    text/vtt                            vtt;
    text/x-component                    htc;
    text/x-markdown                     md;

    video/3gpp                          3gp 3gpp;
    video/avi                           avi;
    video/mp4                           f4p f4v m4v mp4;
    video/mpeg                          mpeg mpg;
    video/ogg                           ogv;
    video/quicktime                     mov;
    video/webm                          webm;
    video/x-flv                         flv;
    video/x-matroska                    mkv;
    video/x-ms-wmv                      wmv;
}

三、開啟超時時間

通過設置Expires,開啟緩存。

location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|flv|ico)$ {
    expires 30d;
    access_log off;
}

location ~ .*\.(eot|ttf|otf|woff|svg)$ {
    expires 30d;
    access_log off;
}

location ~ .*\.(js|css)?$ {
    expires 7d;
    access_log off;
}

參考


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM