1.路由拦截器router.beforeEach 运行在vue路由切换的时候
router.afterEacher
beforeRouteEnter、beforeRouteUpdate、beforeRouteLeave

router.beforeEach((to,from,next)=>{
if(to.path=='/login' || localStorage.getItem('token')){
next();
}else{
alert('请重新登录');
next('/login');
}
})

2.请求拦截器Vue.http.interceptors 运行在你http请求的时候

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://unpkg.com/ajax-hook@2.0.3/dist/ajaxhook.min.js"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <title>Document</title>
</head>
<body>
    <a href="http://www.baidu.com"></a>
    <script>
        ah.proxy({
            onRequest: (config, handler) => {
                config.headers[ 'aaaaaaaaaatoken' ] = 'dhk'
                // if (config.url === 'https://aa/' || config.url === 'https://bb/') {
                //     console.log('aaa.com')
                //     handler.resolve({
                //         config: config,
                //         status: 200,
                //         headers: {'content-type': 'text/text'},
                //         response: 'aa hi world'
                //     })
                // } else {
                //     handler.next(config);
                // }
                handler.next(config);
            },
            onError: (err, handler) => {
                if (err.config.url === 'https://bb/') {
                    handler.resolve({
                        config: err.config,
                        status: 200,
                        headers: {'content-type': 'text/text'},
                        response: 'bb hi world'
                    })
                } else {
                    handler.next(err)
                }
                handler.next(err)
            },
            onResponse: (response, handler) => {
                if (response.config.url === location.href) {
                    handler.reject({
                        config: response.config,
                        type: 'error'
                    })
                } else {
                    handler.next(response)
                }
            }
        })
    
        // 使用jQuery发起网络请求
        // function testJquery(url) {
        //     $.get(url).done(function (d) {
        //         console.log('success:' ,d)
        //     }).fail(function (e) {
        //         console.log('fail')
        //     })
        // }
        
        // //测试
        // testJquery('https://aa/');
        // // testJquery('https://suggest.taobao.com/');
        // testJquery('https://bb/');
        // testJquery(location.href)

        // axios请求
        // axios.post('/user', {
        //     firstName: 'Fred',
        //     lastName: 'Flintstone'
        // })
        // .then(function (response) {
        //     console.log(response);
        // })
        // .catch(function (error) {
        //     console.log(error);
        // });


        // axios请求多个
        function getUserAccount() {
        return axios.get('/user/12345');
        }

        function getUserPermissions() {
        return axios.post('/user/12345/permissions');
        }

        axios.all([getUserAccount(), getUserPermissions()])
        .then(axios.spread(function (acct, perms) {
            // 两个请求现在都执行完成
        }));
    </script>l
</body>
</html>

点击相同路由菜单，报错，可以加这段
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location) {
return originalPush.call(this, location).catch(err => err)
}
const originalReplace = VueRouter.prototype.replace;
VueRouter.prototype.replace = function replace(location) {
return originalReplace.call(this, location).catch(err => err);
};

# vue.js # javascript
Logo
魔乐社区

魔乐社区（Modelers.cn) 是一个中立、公益的人工智能社区，提供人工智能工具、模型、数据的托管、展示与应用协同服务，为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作，由全产业链共同建设、共同运营、共同享有，推动国产AI生态繁荣发展。

更多推荐

cover

替你试过了，消费级显卡可以跑的开源文生图SOTA模型，顶级渲染、高密度文本绘图

avatar 魔乐社区
cover

量化挑战赛冠军专访：4小时啃下W4A8量化，我靠的是这些经验

avatar 魔乐社区

小参数・大码力・易部署 | Qwen3.6-27B上线魔乐社区，基于昇腾的部署教程来了

继一周前模型开源发布后，千问再度开源Qwen3.6-27B —— 一个拥有270亿参数的稠密多模态模型，也是社区呼声最高的模型规格。Qwen3.6-27B 依然支持多模态思考与非思考模式，在智能体编程方面达到了旗舰级表现，全面超越前代开源旗舰 Qwen3.5-397B-A17B（总参数397B / 激活参数17B的MoE模型）。作为稠密架构，它无需MoE路由即可部署，是开发者在实用、可广泛部署规模

avatar 魔乐社区