详解springboot和vue前后端分离开发跨域登陆问题

前后端分离开发中,一般都会遇到请求跨域问题。而且一般也会遇到登陆失效问题。今天就以springboot和vue为例来看如何解决上述问题

成都创新互联公司-专业网站定制、快速模板网站建设、高性价比思茅网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式思茅网站制作公司更省心,省钱,快速模板网站建设找我们,业务覆盖思茅地区。费用合理售后完善,10年实体公司更值得信赖。

增加过滤器

@WebFilter
@Component
public class CorsFilter implements Filter {
 @Override
 public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
  HttpServletRequest request = (HttpServletRequest) req;
  HttpServletResponse response = (HttpServletResponse) res;
  response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
  response.setHeader("Access-Control-Allow-Credentials", "true");
  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");
  System.out.println("**************************跨域过滤器被使用**************************");
  chain.doFilter(req, res);
 }
}

注意Access-Control-Allow-Origin这个属性不要用 * ,因为用 * 的话是可以解决跨域问题,但是无法解决登陆失效的问题。

axios属性设置

在Vue中使用axios来发送请求,我们增加如下设置

axios.defaults.withCredentials = true;

如果没有配置为true,默认为false则向后台发送的请求当中不携带cookie信息,如此每一次sessionID自然会不同。因此获取不到登陆信息。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持创新互联。

标题名称:详解springboot和vue前后端分离开发跨域登陆问题
文章网址:https://www.cdcxhl.com/article0/jgosio.html

成都网站建设公司_创新互联,为您提供服务器托管全网营销推广网站建设网站设计自适应网站网站改版

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

h5响应式网站建设