Vue 项目打包上线

vue的项目项目做到最后,一般都要进行打包 ,不过打包之后就可能会出现以往的接口的数据获取不到,或者接口请求不到的情况。可能是因为,我们在vue中代理的接口是依赖于dev,进行启动的然而在打包之后并没有把这个代理配置进去,我们代理的接口便是失去了作用,也就是说生产环境是没有代理的,这个时候我们都是把接口请求的路径改成绝对路径,但是有的时候我们需要和后台对接为了解决跨域问题,使用了代理但是开发环境的代理并不能用到生产环境,但是直接在请求接口是使用服务器地址,可以成功,但是会造成cookie丢失而失去权限验证,解决办法:

前端:请求时增加withCredentials: true
后端:

直接使用*来匹配所有域名只能适用于无需使用cookie的场景
可以将origin的*替换为允许请求的正则表达式
可以加入一个list列表,代表请求白名单
List<String> allowedOrigins = Arrays.asList("http://localhost:8080", "http://localhost:8100", "http://login.stalary.com");
response.setHeader("Access-Control-Allow-Origin", allowedOrigins.contains(origin) ? origin : "");

也可以直接拿到前端的第一次options请求的header来进行跨域处理
String origin = request.getHeader("Origin");
response.setHeader("Access-Control-Allow-Origin", origin);

posted @ 2020-03-02 17:10  鬼鬼丶  阅读(464)  评论(0编辑  收藏  举报