解决方案1:
在ajax提交的代码前面加一句sth = sth.toUpperCase();转化一下。
不分大小写。根据vue相关信息查询,vue统一路由目录下不区分大小写,统一转换成小写处理。以上便是我们制定的自动化路由规则。
【问题原因】
标准的head,认证名字叫做Authorization,A要大写,但是在vue用axios跨域请求时,传的head名称为authorization,是小写,所以即使是设置Access-Control-Allow-Headers为*,也无法识别。
【解决办法】
后台服务器设置Access-Control-Allow-Headers为'authorization,Authorization,DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type',强制包含一个authorization头即可。
App.vue为父,引入componetA组件之后,则可以在App.vue中使用标签(注意驼峰写法要改成componet-a写法,因为html对大小写不敏感,componenta与componentA对于它来说是一样的,不好区分,所以使用小写-小写这种写法)。
打印出后台从数据库中查询出的数据,发现字段是完整的,并无缺失;打印JSON字符串,发现缺少字段,定位到问题入口;查看JSON.toJSONString()方法后,并未发现异常;将该模块的所有文件重新审阅一遍后发现,实体类User.java中有个布尔类型的成员变量的get方法不对头;这就导致JSON将User对象转换成json字符串时,无法通过反射获取到其state字段,最终给前端的json数据也就没有该字段。
处理方法,重写实体类User的get、set方法并检验,确保不再出错。重启后,测试显示正常。查看后台支持的编码格式和前端axios发送过去的的编码格式是否一致。不一致就会出现跨域问题。至于为什么也不明白,可能是浏览器认为不一致的编码就是跨域也可能就是浏览器的bug。Vue请求后端数据的方法,首先在api文件夹下,建立接口js文件;然后确定baseURL和url后缀;最后输入需要获取数据的代码即可。千锋教育截止目前已在北京、深圳、上海、广州、郑州、成都、大连等20余个核心城市建立直营校区,服务近20万学员、近千所高校和数万家企业。