Nginx 優化靜態文件訪問

時間 2019-11-17

標籤 nginx 優化靜態文件訪問欄目 Nginx 简体版

原文原文鏈接

簡介

Web 開發中須要的靜態文件有：CSS、JS、字體、圖片，能夠經過web框架進行訪問，可是效率不是最優的。javascript

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

1、開啓 gzip

配置介紹和參數以下，建議使用時刪掉註釋。html

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

2、擴展壓縮類型

修改 /etc/nginx/mime.types 文件，增長鬚要壓縮的文件對應 type 到上述 gzip 配置中。下面幾乎涵蓋了全部靜態文件對應的類型：java

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;
}

3、開啓超時時間

經過設置Expires，開啓緩存。nginx

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;
}