欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Vue路由为history,开启Vue gzip 模式的nginx配置

程序员文章站 2022-03-29 16:08:31
...

按照官网配置发现前端访问不了,原因是启用了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;
    }

}