.首先要知道ajax请求的核心是JavaScrip对象和XmlHttpRequest,而浏览器请求的核心是浏览器我的个人博客(基于SSM,Redis,Tomcat集群的后台架构)

github:https://github.com/liqianggh

ajax请求

浏览器请求

场景一:使用ajax获取session中的user(跨域)

从上图可知,ajax每次访问服务器时都没有携带cookie,所以服务器每次都会分配一个新的session对象,所以ajax默认请求是直接获取不了session中的数据的。因此,如果我们想要通过ajax获取当前浏览器的session,我们必须保证每次发送请求都要携带cookie以确保获取的事统一个session。

解决方法:step1.服务器设置接收ajax发送的cookie

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.web.servlet.handler.HandlerInterceptorAdapter;
//HandlerInterceptorAdapter
//跨域设置
public class CrossInterceptor extends HandlerInterceptorAdapter {
  
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
response.addHeader("Access-Control-Allow-Origin","http://localhost:8080");
response.addHeader("Access-Control-Allow-Methods","*");
response.addHeader("Access-Control-Max-Age","100");
response.addHeader("Access-Control-Allow-Headers", "Content-Type");
//允许客户端发送cookies true表示接收,false不接受 默认为false?
response.addHeader("Access-Control-Allow-Credentials","true");
return super.preHandle(request, response, handler);
} }

step2 。设置ajax请求携带cookie

    $.ajax({
url: url+'/checkout.action',
type: 'GET',
dataType: '',
data: {verifyCode: VerificationCodeInput.value},
//添加跨域
async: false,
xhrFields: {
withCredentials: true
},
crossDomain: true,
success:function(data){
console.log(data);
}
});

注: xhrFields: { withCredentials: true }, crossDomain: true, 一定要加上!!!!

这样就可以愉快的玩耍了!

场景二:当用户需要校验session是否登陆(没有登陆跳转到登陆页面)

基于场景一,已经解决了回话问题但是在使用SpringMVC中

request.getRequestDispatcher(xxxx.html").forward(request, response);
     response.sendRedirect("http://www.baidu.com");

会报错。因为当服务器转发或者重定向时返回的是一个页面,因为只有浏览器才能解析显示页面,而ajax的对象却不能,所以会报错错。

解决办法:因为ajax请求对象不能解析显示页面,所以不能直接转发或重定向,这时我们需要绕过服务器,直接使用浏览器跳转页面,但是对于session过期(用户没有登陆)我们要给浏览器一个反馈,我们可以给浏览器一个大于等于600的错误码

      String requestType = request.getHeader("X-Requested-With");
if(requestType != null && "XMLHttpRequest".equalsIgnoreCase(requestType.trim())) {
//如果是ajax请求就设置一个自定义响应头
response.setHeader("sessionStatus", "timeout");
        //设置错误码以及错误码提示
response.sendError(666, "session timeout");
return false;
}

同时要对ajax设置全局options

$.ajaxSetup({
type:'post',
complete:function(xhr, ts){ //XMLHttpRequest, textStatus
var sessionStatus = xhr.getResponseHeader('sessionstatus');
if(sessionStatus == 'timeout') {
alert('用户没有登陆,请登录!');
window.top.location.href = 'Login.html';
}
}
});

这样就可以通过浏览器进行页面跳转了!

SpringMVC处理ajax请求的跨域问题和注意事项的更多相关文章

  1. ajax请求ashx跨域问题解决办法

    ajax请求ashx跨域问题解决办法 https://blog.csdn.net/windowsliusheng/article/details/51583566 翻译windowsliusheng  ...

  2. AJAX请求和跨域请求详解(原生JS、Jquery)

    一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...

  3. 解决ajax请求cors跨域问题

    ”已阻止跨源请求:同源策略禁止读取位于 ***** 的远程资源.(原因:CORS 头缺少 'Access-Control-Allow-Origin').“ ”已阻止跨源请求:同源策略禁止读取位于 ** ...

  4. Ajax请求,跨域小坑

    今天在上班的时候,被坐在旁边项目经理叫过去问了一个Ajax请求跨域的问题,一开始没理解清楚也还有对这个没有理解的透,后面被打击的要死. 当时的需求是需要测试一个已发布的api接口,需要在本地写测试程序 ...

  5. 从零开始学 Web 之 Vue.js(四)Vue的Ajax请求和跨域

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  6. jQuery解决ajax请求的跨域问题

    这两天工作中频繁的遇到JS的跨域问题,都通过绕开ajax请求的方式.特地百度了一下,把跨域问题解决了.在这分析一下 首先贴上js的页面代码: <html> <head> < ...

  7. Asp.Net Core 3.0 学习3、Web Api 文件上传 Ajax请求以及跨域问题

    1.创建Api项目 我用的是VS2019 Core3.1 .打开Vs2019 创建Asp.Net Core Web应用程序命名CoreWebApi 创建选择API 在Controller文件夹下面添加 ...

  8. Ajax请求WebService跨域问题 [转载]

    1.背景 用Jquery中Ajax方式在asp.net开发环境中WebService接口的调用 2.出现的问题 原因分析:浏览器同源策略的影响(即JavaScript或Cookie只能访问同域下的内容 ...

  9. 谷歌扩展程序设置ajax请求允许跨域(极少人知道的解决方案)

    前言: 跨域问题一直是个老生常谈的问题,在实际开发过程中,跨域的问题常常会让开发者非常的头疼. 常用的几种跨域解决方案: 1.代理 2.XHR2 HTML5中提供的XMLHTTPREQUEST Lev ...

随机推荐

  1. hiveserver2连接报错: User: root is not allowed to impersonate anonymous (state=08S01,code=0)

    使用HiveServer2运行时,启动好HiveServer后运行 private static String url = "jdbc:hive2://192.168.213.132:100 ...

  2. python基础4之递归、lambda、深浅copy

    内容概要: 一.递归 二.匿名函数 三.关于python中的深浅拷贝与赋值 一.递归 递归就是函数本身调用自己,直到满足指定条件之后一层层退出函数 递归特性: 必须有一个明确的结束条件 每次进入更深一 ...

  3. 20155235 王玥 《基于Arm实验箱的接口测试和应用》 课程设计报告

    20155235 王玥 <基于Arm实验箱的接口测试和应用> 课程设计报告 一.设计方案及可行性分析 熟悉 Linux 开发环境 多线程应用程序设计 串行端口程序设计 中断实验 二.详细设 ...

  4. VS编程,WPF单独更改TextBlock中部分文字格式的一种方法

    原文:VS编程,WPF单独更改TextBlock中部分文字格式的一种方法 版权声明:我不生产代码,我只是代码的搬运工. https://blog.csdn.net/qq_43307934/articl ...

  5. Android开发——Android中的二维码生成与扫描

    0. 前言 今天这篇文章主要描述二维码的生成与扫描,使用目前流行的Zxing,为什么要讲二维码,因为二维码太普遍了,随便一个Android APP都会有二维码扫描.本篇旨在帮助有需求的同学快速完成二维 ...

  6. STM32一键下载电路设计原理

    先放原理图(补充:图中的BOOT0通过10K的电阻接到地),再解释为什么这么设计: STM32启动方式:BOOT0和 BOOT1用于设置 STM32的启动方式 ,见下表: BOOT0=1,BOOT1= ...

  7. flaskr 报错及其修改

    作者:hhh5460 官网有一个flaskr的例子,按照其8个步骤(包括测试),一步一步照着做,有3个地方报错. 究其原因,可能是flaskr这个例子年代比较久远,而现在python以及flask都有 ...

  8. [CF1007B]Pave the Parallelepiped[组合计数+状态压缩]

    题意 \(t\) 组询问,给你 \(A, B, C\) ,问有多少组三元组 \((a, b, c)\) 满足他们任意排列后有: \(a|A,\ b|B,\ c|C\) . \(A,B,C,t\leq ...

  9. linux下的tar命令详解

    通过SSH访问服务器,难免会要用到压缩,解压缩,打包,解包等,这时候tar命令就是是必不可少的一个功能强大的工具.linux中最流行的tar是麻雀虽小,五脏俱全,功能强大. tar命令可以为linux ...

  10. Flask学习-Flask app启动过程

    因为0.1版本整体代码大概只有350行,比较简单.所以本篇文章会以Flask 0.1版本源码为基础进行剖析Flask应用的启动过程. Flask参考资料flask,官网有一个最简单app: from ...