如何解决出现AXIOS的Request header field Content-Type

问题描述:html

因为restful接口须要在头部header传递两个字段:vue

Content-Type: application/json
Access-Token: 84c6635800b14e0eba4f7ece65e095a1json

可是,在vue.js里面配置:跨域

执行发送的时候出现:浏览器

意思是预发请求的时候不经过,再也不正式发请求restful

通过反复的测试,发现,header里面包含自定义字段,浏览器是会先发一次options请求,若是请求经过,则继续发送正式的post请求,而若是不经过则返回以上错误app

那这样就只能在服务端配置options的请求返回,代码以下:ide

复制代码

  // TODO 支持跨域访问
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Allow-Credentials", "true");
        response.setHeader("Access-Control-Allow-Methods", "*");
        response.setHeader("Access-Control-Allow-Headers", "Content-Type,Access-Token");
        response.setHeader("Access-Control-Expose-Headers", "*");        if (request.getMethod().equals("OPTIONS")) {
            HttpUtil.setResponse(response, HttpStatus.OK.value(), null);            return;
        }

复制代码

上面代码须要加入容许的头部,content-type和access-token,而且判断请求的方法是options的时候,返回ok(200)给客户端,这样才能继续发正式的post请求。post

修改以后成功发了post请求。测试

PS:

看了网上这么多解释,基本都用不到,关于AXIOS自定义头部字段的问题,貌似只有上述方法可以解决

原地址: https://www.cnblogs.com/caimuqing/p/6733405.html

相关文章
相关标签/搜索