Vue2.0 axios 前后端登陆拦截器

vue更新到2.0之后，作者就宣告不再对vue-resource更新，而是推荐使用axios。前段时间第一次在项目里用到vue，关于登陆问题，这里写一下心得。

首先后端：

import org.springframework.web.servlet.handler.HandlerInterceptorAdapter;

import com.lemon.gateway.system.po.Users;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class LoginInterceptor extends HandlerInterceptorAdapter{

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {

        Users existUser =  (Users)request.getSession().getAttribute("user");
        if(existUser == null){
        response.sendError(401);
            return false;
        }else
            return true;
    }
}

这里做的处理就是：如果session里面没有user了，就向前端返回401错误。

前端：

import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
import App from './App'
import router from './router'
import axios from 'axios'


// http response 拦截器
axios.interceptors.response.use(
    response => {
        return response;
    },
    error => {
        if (error.response) {
            if (error.response.status == 401) {
                    store.commit(types.LOGOUT);
                    router.replace({
                        path: 'login',
                        query: {redirect: router.currentRoute.fullPath}
                    })
            }
        }
        return Promise.reject(error.response.data)   // 返回接口返回的错误信息
    }
);

注意，这里的拦截器写在main.js中。