跳转到主要内容

VUE前端缓存不刷新问题

nginx配置增加

    location / {
        # 不缓存首页,解决VUE单页面发版后不生效
        add_header Cache-Control "no-cache no-store must-revalidate proxy-revalidate,max-age=0";
        add_header Last-Modified $date_gmt;
        # 这个有顺序,需要加在最后面
        etag off; 
    }


index.html增加

    <meta http-equiv="Cache-Control" content="no-store" />

增加一个新的入口页面,并在APP或者微信公众号设置入口为这个新的页面,例如取名为root.html

<!DOCTYPE html>
<html lang="en">

<head>
    <title>数字营业厅</title>
    <script type="text/javascript">

        function generateRandomChar() {
            const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
            return chars[Math.floor(Math.random() * chars.length)];
        }

        function generateRandomString() {
            const length = 3;
            let str = '';
            for (let i = 0; i < length; i++) {
                str += generateRandomChar();
            }
            return str;
        }

        var rnd = generateRandomString();

        // 需要根据前端项目是URL模式还是history模式自行修改
        location.assign(`./?${rnd}`);


    </script>
</head>

<body>

</body>

</html>