使用Vue的axios自定义header时报错处理~

前端Axios的设置处理
当 Content-Type 为 application/json 的时候，会先产生一个 OPTION 请求（如 Network所示）。

可以把 Content-Type 设置为 application/x-www-form-urlencoded。
设置 Auth 请求头，参看官方文档

axios.defaults.baseURL = 'https://api.example.com';
axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

举个栗子~
// 新创建 axios 实例配置
const $axios = axios.create({
    baseURL: 'http://domain.com',
    timeout: 5000,
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
        'sessionId':  Lockr.get("sessionId"),
        'authKey': Lockr.get("authKey"),
    }
});

// 初始化默认post header
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

前端设置成功后可能会遇到以下问题cross 带option的请求不被服务端所允许，所以就需要后台来处理，可能遇到的问题和处理的方法如下：

1.

这个报错后的解决办法是后端配置 以下东西~

    HttpServletRequest request = (HttpServletRequest) req;
            HttpServletResponse response = (HttpServletResponse) res;
            String origin = request.getHeader("Origin");
            response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
            response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
            response.setHeader("Access-Control-Max-Age", "3600");
            response.setHeader("Access-Control-Allow-Headers", "x-requested-with,token");
            response.setHeader("Access-Control-Allow-Credentials", "true"); //是否支持cookie跨域
            chain.doFilter(req, res);
            
            response.setHeader("Access-Control-Allow-Headers", "x-

重点在这里
requested-with,token");这个是配置自定义header内的token appid之类的~~
如果有疑问请在下方进行提问，有时间必作答