解决关于HTML+JS + Servlet 实现前后端请求Session不一致的问题

1、前后端不分离情况

在处理session过程中,如果前后端项目在一个容器中,session是可以被获取的。例如如下项目结构:

结构

后端的代码是基本的设置值、获取值、销毁值的内容:

运行结果

由此可见,在前后统一的项目中,session通道不会直接断掉,除非是在关闭浏览器或者session超时后才会变化。


2、前后端分离情况

结构

将对应的session_demo.html放到了前端的项目当中

运行结果(因安全策略,跨域错误)

这里对三个跨域请求的后台设置允许跨域的请求头即可。

跨域运行后获取的Session不一致

也会导致其他按钮使用服务时产生新的通道:

3、原因与解决思路

问题原因

Session的工作原理:当用户首次访问服务器时,服务器会创建一个session,并生成一个唯一的session ID。这个ID通常存储在cookie中,并随请求一起发送回客户端。后续的请求中,客户端将携带这个session ID,服务器通过这个ID来识别用户的会话,并保持状态。

1、Session 是一种服务器端的存储方式,用于存储用户的状态信息。它允许服务器在多个页面请求或访问周期中保持状态。在 HTTP 协议中,默认是无状态的,意味着每次请求都是独立的,服务器不保留任何关于客户端的信息。Session 机制通过在服务端维护状态信息,使得服务器能够在多次请求之间识别同一个客户端,当 Session 超时或被显式销毁时,服务器会停止跟踪用户的状态。如果用户关闭浏览器,客户端的 Cookie 可能会丢失,但服务器端的 Session 数据可能仍然存在,直到超时或被服务器清理。

2、在前后端分离的架构中,前端发起请求和服务端响应确实涉及到多个独立的HTTP请求,因为每次HTTP请求都是无状态的。因此该demo中也是出现了每次访问sessionId不一致的情况。

可以配置为将session ID存储在cookie中,并随每个请求发送。这样,即使请求是独立的,服务器也能够通过session ID来识别和维持用户的会话状态。

解决思路

我们需要通过Cookie来帮助我们解决前后端分离时session不一致的问题。

解决方法

每次使用session时在头部中携带cookie信息,用于保证每次请求和响应都通过cookie携带的sessionId找到对应的Session。

操作步骤

1、我们在前端进行请求的时候添加以下内容,意味传输的时候携带Cookie信息

 $.ajax({...//新增 对cookie的携带xhrFields: {withCredentials: true},...})

2、后端需要设置对应的跨域ip,以及同意携带cookie的方法

@WebServlet("/setSession")
public class SetSessionServlet extends HttpServlet {@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//       获取sessionHttpSession session = req.getSession();String user = req.getParameter("user");//新增 限制的访问地址String host = "http://localhost:5500";resp.setHeader("Access-Control-Allow-Origin",host);//新增 允许携带cookieresp.setHeader("Access-Control-Allow-Credentials","true");resp.setContentType("text/html;charset=UTF-8");if (user == null){resp.getWriter().println("session未存放数据!");}else {//session中设置属性session.setAttribute("user",user);resp.getWriter().println("session已存放数据,sessionId为:"+req.getSession().getId()); //获取session的唯一id}}
}

4.优化后运行结果


5、附件

前端项目代码:

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>5500 前端</title>
</head><body><button id="getSession" onclick="getSession()">获取session</button><button id="setSession" onclick="setSession()">存放session</button><button id="rmSession" onclick="removeSession()">移除session</button><script src="./js/jQuery-3.7.1.js"></script><script>function getSession() {$.ajax({url: 'http://localhost:8081/Java_Web_Servlet_war_exploded/getSession',//新增 对cookie的携带xhrFields: {withCredentials: true},method: 'GET',success: function (resp) {alert(resp)}})}function setSession() {$.ajax({url: 'http://localhost:8081/Java_Web_Servlet_war_exploded/setSession',//新增 对cookie的携带xhrFields: {withCredentials: true},data: { 'user': 'admin' },method: 'POST',success: function (resp) {alert(resp)}})}function removeSession() {$.ajax({url: 'http://localhost:8081/Java_Web_Servlet_war_exploded/removeSession',//新增 对cookie的携带xhrFields: {withCredentials: true},method: 'GET',success: function (resp) {alert(resp)}})}</script>
</body></html>

后端项目结构:

后端代码-1:

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;@WebServlet("/getSession")
public class getSessionServlet extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//       获取sessionHttpSession session = req.getSession();String user = (String) session.getAttribute("user");String host = "http://localhost:5500";resp.setHeader("Access-Control-Allow-Origin",host);resp.setHeader("Access-Control-Allow-Credentials","true");        resp.setContentType("text/html;charset=UTF-8");if (user == null) {resp.getWriter().println("你的session没有存放数据!");} else {resp.getWriter().println("sessionId为"+session.getId()+",存放的数据为:" + user);}}
}

后端代码-2:

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.*;
import java.io.IOException;@WebServlet("/setSession")
public class SetSessionServlet extends HttpServlet {@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//       获取sessionHttpSession session = req.getSession();String user = req.getParameter("user");String host = "http://localhost:5500";resp.setHeader("Access-Control-Allow-Origin",host);resp.setHeader("Access-Control-Allow-Credentials","true");resp.setContentType("text/html;charset=UTF-8");if (user == null){resp.getWriter().println("session未存放数据!");}else {//session中设置属性session.setAttribute("user",user);resp.getWriter().println("session已存放数据,sessionId为:"+req.getSession().getId()); //获取session的唯一id}}
}

后端代码-3:

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;@WebServlet("/removeSession")
public class RemoveServlet extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {String username = (String)req.getSession().getAttribute("user");req.getSession().removeAttribute("user");resp.setCharacterEncoding("UTF-8");resp.setContentType("text/hml;charset=UTF-8");String host = "http://localhost:5500";resp.setHeader("Access-Control-Allow-Origin",host);resp.setHeader("Access-Control-Allow-Credentials","true");resp.getWriter().println("你的sessionId是:"+req.getSession().getId()+",移除了user:"+username);}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/56466.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Redis 配置小插曲

前言&#xff1a;当今&#xff0c;我们进行后端部署redis时候&#xff0c;总是会遇到各种问题&#xff0c;这不今天就发现了&#xff0c;redis在下载下来的时候&#xff0c;redis.windows.conf&#xff0c;文件中&#xff0c;默认是没有为redis配置密码才被允许进行登录的&…

《Linux从小白到高手》综合应用篇:详解Linux系统调优之服务器硬件优化

List item 本篇介绍Linux服务器硬件调优。硬件调优主要包括CPU、内存、磁盘、网络等关键硬件组。 1. CPU优化 选择适合的CPU&#xff1a; –根据应用需求选择多核、高频的CPU&#xff0c;以满足高并发和计算密集型任务的需求。CPU缓存优化&#xff1a; –确保CPU缓存&#x…

Go语言反射机制详解:通过反射获取结构体的字段和方法

在Go语言中&#xff0c;反射&#xff08;Reflection&#xff09; 是一种强大的工具&#xff0c;允许我们在程序运行时动态地检查和修改变量的类型、 反射在很多场景中都有广泛的应用&#xff0c;如ORM&#xff08;对象关系映射&#xff09;框架、序列化与反序列化工具等。 一、…

SAP导出excel报错:发现“EXPORT.XLSX“中的部分内容有问题。是否让我们尽量尝试恢复?如果您信任此工作簿的源,请单击“是”。

1.问题描述&#xff1a;SAP报表程序导出excel的时报错 2.问题原因 文本信息中包含了非法符号&#xff08;SAP不认识的符号&#xff09; 比如&#xff1a;NLSY10 3.解决方式&#xff0c;把这个文本信息特殊符号去掉&#xff0c;就可以恢复正常了。 怎么找这个特殊符号&#…

2019年计算机网络408真题解析

第一题&#xff1a; 解析&#xff1a;OSI参考模型第5层完成的功能 首先&#xff0c;我们需要对OSI参考模型很熟悉&#xff1a;从下到上依次是&#xff1a;物理层-数据链路层-网络层- 运输层-会话层-表示层-应用层&#xff0c;由此可知&#xff0c;题目要问的是会话层的主要功能…

第十五章 RabbitMQ延迟消息之延迟插件

目录 一、引言 二、延迟插件安装 2.1. 下载插件 2.2. 安装插件 2.3. 确认插件是否生效 三、核心代码 四、运行效果 五、总结 一、引言 上一章我们讲到通过死信队列组合消息过期时间来实现延迟消息&#xff0c;但相对而言这并不是比较好的方式。它的代码实现相对来说比…

嵌入式开发:STM32 硬件 CRC 使用

测试平台&#xff1a;STM32G474系列 STM32硬件的CRC不占用MCU的资源&#xff0c;计算速度快。由于硬件CRC需要配置一些选项&#xff0c;配置不对就会导致计算结果错误&#xff0c;导致使用上没有软件计算CRC方便。但硬件CRC更快的速度在一些有时间资源要求的场合还是非…

编程的魅力

在数字时代的浪潮中&#xff0c;编程已成为连接现实与虚拟世界的桥梁&#xff0c;它不仅塑造了我们的生活方式&#xff0c;还深刻影响着科技进步的每一步。编程&#xff0c;这一看似复杂而神秘的领域&#xff0c;实则蕴含着无限的创造力和可能性。本文将深入探讨编程的魅力、基…

R语言中,.RData 和 .rds 的区别

.RData 和 .rds 是 R 语言中两种不同的数据保存格式&#xff0c;二者有一些关键的区别&#xff1a; 1. 存储内容的类型&#xff1a; .RData 文件&#xff1a;可以同时保存多个对象&#xff08;如数据框、向量、列表等&#xff09;&#xff0c;当你加载 .RData 文件时&#xf…

使用python批量替换文件夹文件名(已亲测)

1. 需要使用高版本的python,本机版本 3.12.4 2. 配置国内Python镜像源 常用的国内Python镜像源&#xff1a; 清华大学TUNA镜像源&#xff1a;这是非常受欢迎的一个镜像源&#xff0c;提供了高速且稳定的服务。 地址&#xff1a;https://pypi.tuna.tsinghua.edu.cn/simple 临时…

基于DCGM+Prometheus+Grafana的GPU监控方案

目录 前言一、指标导出器1、DCGM&#xff1a;获取远程节点的信息 2、 DCGM-Exporter收集多节点信息更改收集指标 二、 Prometheus - From metrics to insight修改配置文件查看收集结果 三、Grafana仪表板展示导入数据源创建仪表板更多仪表板 前言 基于DCGM&#xff08;NVIDIA …

DNS安全概述

一、DNS的解析过程 1.递归解析 递归解析是一种由DNS客户端&#xff08;通常是用户的应用程序&#xff0c;如一个浏览器&#xff09;向本地DNS解析器发出解析请求&#xff0c;然后本地DNS解析器负责查询最终结果并将结果返回给客户端&#xff0c;而中间的所有查询请求都由本地D…

LabVIEW空间相机测控系统

空间相机是遥感技术中的核心设备&#xff0c;其在太空中的性能对任务的成功至关重要。为了确保空间相机能够在极端环境下稳定工作&#xff0c;地面模拟测试成为必不可少的环节。LabVIEW开发的空间相机测控系统&#xff0c;通过对温度、应力和应变等参数进行高精度测量&#xff…

云贝教育 |【技术文章】OpenTenBase_V2.6基于麒麟V10源码编译安装

本文为云贝教育 刘老师 原创&#xff0c;请尊重知识产权&#xff0c;转发请注明出处&#xff0c;不接受任何抄袭、演绎和未经注明出处的转载。 前言&#xff1a;什么是OpenTenBase OpenTenBase 是一个提供写可靠性&#xff0c;多主节点数据同步的关系数据库集群平台。你可以…

LabVIEW智能可变温循环PCT测试系统

随着全球能源危机的加剧和环境保护需求的提升&#xff0c;开发和利用清洁能源已成为全球必然趋势。氢能作为一种高效的替代能源&#xff0c;正逐步受到关注。然而&#xff0c;储氢技术的研究至关重要&#xff0c;尤其是储氢材料的PCT&#xff08;Pressure-Composition-Temperat…

Python数据分析库pandas高级接口dt的使用

文章目录 Pandas介绍使用示例dt.date()Pandas介绍 Pandas是一个强大的数据分析库,其中dt是Pandas的一个高级接口,用于处理日期和时间数据。dt提供了许多实用的方法和属性,可以轻松地处理日期和时间。 使用示例 下面是一些常用的dt方法和属性的使用示例: 获取日期和时间组…

iTOP-3A5000主控板龙芯自主指令系统外加机箱就是一台电脑主机

性能强采用全国产龙芯3A5000处理器&#xff0c;基于龙芯自主指令系统 (LoongArch)的LA464微结构&#xff0c;并进一步提升频率&#xff0c;降低功耗&#xff0c;优化性能。桥片采用龙芯 7A2000&#xff0c;支持PCIE 3.0、USB 3.0和 SATA 3.0.显示接口2 路、HDMI 和1路 VGA&…

sql数据库命令行操作(数据库的增删改查)

查询数据库 查询电脑里面所有数据库 SHOW DATABASES;查询当前所处的数据库 SELECT DATABASE();应用场景&#xff1a;当我使用了USE命令后不知道自己所在哪个数据库时&#xff0c;可以使用这个命令查询自己所在数据库 创建数据库 创建 CREATE DATABASE [IF NOT EXISTS] 数据…

超好看PC管理门户及手机移动管理门户的模版,可方便快速二次开发

Web 开发中几乎的平台都需要一个后台管理&#xff0c;但是从零开发一套管理后台模版并不容易&#xff0c;幸运的是有很多开源免费的管理后台模版可以给开发者使用。那么有哪些优秀的开源免费的管理后台模版呢&#xff1f; 以下是一些超火和超好看的管理后台模板&#xff0c;它们…

怎么快速获得cnas认证证书

要快速获得CNAS&#xff08;中国合格评定国家认可委员会&#xff09;证书&#xff0c;关键在于充分准备、高效沟通和积极响应评审要求。以下是一些建议&#xff0c;帮助您加快获得CNAS证书的进程&#xff1a; 全面了解和准备&#xff1a; 深入研读CNAS的认可准则、规则及指南&…