天天看點

Vue路由為history,開啟Vue gzip 模式的nginx配置

按照官網配置發現前端通路不了,原因是啟用了Vue的zip模式後,第一次通路靜态檔案,在nginx沒有找到,第二次會去找.gzip檔案,然後傳回,但是加了try_files $uri $uri/ /index.html;後,第二次位址就被重寫成/index.html了,導緻前端拿不到靜态資源,是以靜态資源采用不同配置即可:

nginx完整配置:

server
{
    listen       80;
    server_name  localhost;
    charset utf-8;
     keepalive_timeout 300;
     fastcgi_buffers 8 128k;
     send_timeout 300;
     fastcgi_connect_timeout 1200s;#原設定為300s
     fastcgi_send_timeout 1200s;#原設定為300s
     fastcgi_read_timeout 1200s;#原設定為300s
     fastcgi_busy_buffers_size 128k;
     fastcgi_temp_file_write_size 128k;
	 client_max_body_size 30m;
         gzip_static on;
         gzip on;
         gzip_min_length 1k;
         gzip_buffers 4 16k;
         gzip_http_version 1.0;
         gzip_comp_level 2;
         gzip_types text/plain application/x-javascript application/javascript text/css application/xml application/json;
         gzip_vary on;
     #log_format  mylogformat  '$remote_addr - $remote_user [$time_local] "$request" '
     #                 '$status $body_bytes_sent "$http_referer" '
     #                 '"$http_user_agent" "$http_x_forwarded_for" "$upstream_addr"  "$upstream_status"';
    #charset koi8-r;
    #access_log  /var/log/nginx/host.access.log  mylogformat;

   
    location / {
        root   /etc/nginx/html;
        index  index.html;
        try_files $uri  $uri/ /index.html;
    }
    #靜态資源檔案配置
    location ~ .*\.(js|css|ico|jpg|png)$
    {
       root   /etc/nginx/html;
       index  index.html;
    }

}
           

繼續閱讀