ajax跨域请求 session,前端后分离Ajax跨域请求保证Session一致

前后端分离的项目,使用Ajax请求一般都出现跨域的问题。

跨域的时候所创建的session是不会被浏览器保存下来的。所以每次进行跨域请求时,服务器都认为不是同一个浏览器所发起的请求,session也会不一样。以下将介绍如何保证session一致。

前端Ajax请求

$.ajax({

url:url,

xhrFields: {

withCredentials: true

},

crossDomain: true,

success:function() {

},

error:function() {

}

});

后端构建一个拦截器,对需要跨域访问的request头部重写

如:

public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {

HttpServletResponse response= (HttpServletResponse) servletResponse;

HttpServletRequest request=(HttpServletRequest)servletRequest;

response.setHeader("Access-Control-Allow-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");

response.setHeader("Access-Control-Allow-Credentials", "true");

response.setHeader("XDomainRequestAllowed","1");

filterChain.doFilter(servletRequest,servletResponse);

}

另外Spring boot的项目可以添加拦截配置,以下:

@Component

@Order(Ordered.HIGHEST_PRECEDENCE)

public class AuthCorsFilter extends CorsFilter {

public AuthCorsFilter() {

super(configurationSource());

}

private static UrlBasedCorsConfigurationSource configurationSource() {

CorsConfiguration config = new CorsConfiguration();

config.setAllowCredentials(true);

config.addAllowedOrigin("*");

config.addAllowedHeader("*");

config.addAllowedMethod("*");

config.setAllowCredentials(true);

UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();

source.registerCorsConfiguration("/**", config);

return source;

}

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前后端分离时,前端与后端是通过网络进行通信的。由于安全原因,浏览器限制了不同域名之间的直接通信,这就是跨域问题。 在前后端分离的架构中,前端是通过Ajax请求与后端进行数据交互的。解决跨域问题有几种常见的方法: 1. JSONP(JSON with Padding):这是一种利用动态创建<script>标签实现跨域请求的方法。前端通过创建一个<script>标签,设置其src属性为后端接口地址,并在url中传递一个回调函数名。后端将返回数据包装在该回调函数中返回,前端通过执行该回调函数来获取数据。 2. CORS(Cross-Origin Resource Sharing):这是一种更为现代化的解决跨域问题的方法。后端在响应头中添加Access-Control-Allow-Origin字段,指定允许访问的域名或通配符"*"表示允许任意域名访问。 3. 代理服务器:前端可以通过配置代理服务器来实现跨域请求前端将请求发送给代理服务器,代理服务器再将请求转发给后端,然后将后端的响应返回给前端。这样前端与代理服务器之间是同源的,就不会有跨域问题了。 4. WebSocket:WebSocket是HTML5提供的一种双向通信协议,它可以与任意域名建立连接,不存在跨域问题。前端可以通过WebSocket与后端进行通信。 需要注意的是,以上方法都需要后端进行一定的配置或处理。选择哪种方法取决于具体的场景和技术栈。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值