H5W3
当前位置:H5W3 > JavaScript > Vue相关 > 正文

【Vue】vue spa nginx 如何配置,能够让index.html不缓存呢(微信公众号),求解答。。真心感谢

spa是vue脚手架npm run build 出来的一套静态资源
/home/nodeuser/apps/hcz-weichat/source/dist这个目录存放着静态资源

nginx配置文件如下

/etc/nginx/conf.d/hcz_weichat.conf
server {
listen 80;
server_name domain;
location /favicon.ico {
root /home/nodeuser/apps/hcz-weichat/source/dist;
}
location / {
root /home/nodeuser/apps/hcz-weichat/source/dist;
index index.html;
try_files $uri /index.html;
}
}

回答

location = /index.html {
    add_header Cache-Control "no-cache, no-store";
}

no-cache, no-store可以只设置一个
no-cache浏览器会缓存,但刷新页面或者重新打开时 会请求服务器,服务器可以响应304,如果文件有改动就会响应200
no-store浏览器不缓存,刷新页面需要重新下载页面

# vue 的路由页面
location / {
    add_header Cache-Control "no-cache, no-store";
    root    /root/html/dist;
    index    index.html index.htm;
    try_files $uri $uri/ /index.html;
}
# vue编译后的静态资源地址
location /static/ {
     root    /root/html/dist;
     # ToDo
}

配置webpack的output,给build出来的文件加上hash后缀。

filename: '[name].js?[hash]'

本文地址:H5W3 » 【Vue】vue spa nginx 如何配置,能够让index.html不缓存呢(微信公众号),求解答。。真心感谢

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址