Bug 解决 无法正常登录或获取不到用户信息

目录

1、跨域问题

2、后端代码问题

3、前端代码问题


我相信登录这个功能是很多人做项目时候遇到第一个槛!

**看起来好像很简单的登录功能,实际上还是有点坑的,比如明明账号密码都填写正确了,**为什么登录后请求接口又说我没登录?为什么我登录成功跳转了页面却拿不到用户信息?

这篇文章,我列举常见的几种情况和解决方案,供大家参考。

1、跨域问题

报错如上所示,所谓的跨域****指的是:比如前端的域名是 aaa.com,访问后端服务域名 bbb.com,此时的行为就是跨域。

更专业一点的描述就是:在****不同域(域名、协议、端口号任何一个不同)之间进行通信时,就是跨域

注意哦,是域名、协议、端口号任何一个!协议包括 http 和 https 的区别!

实际上跨域是浏览器的限制,它是出于安全考虑阻止这种行为,这种安全策略称为同源策略(Same-Origin Policy),没错它是好心的,但是确实因为它伤害了很多刚入门的同学心。

那跨域问题和登录有什么关系呢?

实际上我们很多登录场景都得用到 cookie,比如我们把 session 存在 cookie 里面或者把 token 存 cookie 里,这存的不就是我们的用户凭证信息吗?

而 cookie 是跟域名走的!根据同源策略,不同域名之间的 cookie 是不通的,这一举措是为了确保网站的敏感数据不会被其他域名的网站恶意获取。

所以不同域之间的 cookie 不互通,导致登录的用户凭证信息不互通,导致前端请求后端的时候无法带上用户凭证,或者后端回种用户凭证的时候前端拿不到。

综上使得大家登录失效!无法获取用户信息!

那怎么解决这个问题呢?

1)保持域名一致

这个应该很好理解,既然浏览器限制不同域之间的信息不互通,那么我们在一个域下操作就好了。

可以让前端和后端接口域名保持一致,用 Nginx 进行端口转发

2)后端设置

后端有跨域的配置,指定允许跨域的域名,这样浏览器就知道了这个源是被允许的,大家就可以友好的互通了!

比如我后端的域名是 bbb.com,此时我允许 aaa.com 来调用我,那么就可以这样配置:

@Configuration
public class CorsConfig {@Beanpublic FilterRegistrationBean<CorsFilter> corsFilter() {UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();CorsConfiguration config = new CorsConfiguration();config.setAllowCredentials(true);// 填写前端域名config.addAllowedOrigin("http://aaa.com");config.addAllowedHeader("*");config.addAllowedMethod("*");source.registerCorsConfiguration("/**", config);FilterRegistrationBean<CorsFilter> bean = new FilterRegistrationBean<>(new CorsFilter(source));bean.setOrder(Ordered.HIGHEST_PRECEDENCE);return bean;}
}

或者只是某个 Controller 上需要配置跨域:

import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.RestController;@RestController
@CrossOrigin(origins = "http://aaa.com")
public class MyController {// 控制器方法
}

或者只是 Controller 上的某个方法需要配置:

import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;@RestController
public class MyController {@GetMapping("/data")@CrossOrigin(origins = "http://aaa.com")public String getData() {// 处理方法return "Data";}
}

然后再补充一下常用的这个注解的相关属性的含义:

origins:允许的来源域,可以是一个字符串数组。

methods:允许的 HTTP 方法,如 GET、POST 等。

allowedHeaders:允许的请求头。

exposedHeaders:暴露给浏览器的响应头。

allowCredentials:是否允许发送身份验证信息(如 Cookie)。

maxAge:预检请求的有效期。

如果项目里用了@CrossOrigin注解还是报错,可以试试在后端的 @CrossOrigin 注解加 allowCredentials=“true”。

2、后端代码问题

如果我们确认没有跨域问题,那么就得看看是不是代码层面的bug了。

首先我们得怀疑后端的逻辑,确保我们正常的返回了用户凭证或者一些用户信息。

比如通过 F12 确认后端登录接口是否正常返回数据,通过控制台或者服务器查看日志,看看登录接口被调用时是否有报错,有时候可能是因为报错被 try catch 导致没有异常信息等等

3、前端代码问题

确定没有跨域问题,且后端接口正常返回用户信息后,此时我们需要把怀疑的目光转向前端代码逻辑!

1)正常登录后发现获取不到用户的信息?

可能是前端的用户数据取值和后端返回数据结构不匹配

2)点击一个页面,发现登录态竟然失效了?

可能就是前端在请求时没有带上 cookie,需要在 requestConfig.ts 中添加上withCredentials: true

3)app.ts 里配置的是 localhost,用 127.0.0.1 来访问就带不上用户信息?

因为这样 cookie 就种不上,改成 127.0.0.1 即可。


**以上就是本次的学习分享,希望对大家有所帮助,****关注我!**不定期分享有用干货!!!

如果有疑问的可以评论提出来~

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

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

相关文章

论文翻译 | ChunkRAG: Novel LLM-Chunk Filtering Method for RAG Systems

摘要 使用大型语言模型&#xff08;LLM&#xff09;的检索-增强生成&#xff08;RAG&#xff09;系统经常由于检索不相关或松散相关的信息而生成不准确的响应。现有的在文档级别操作的方法无法有效地过滤掉此类内容。我们提出了LLM驱动的块过滤&#xff0c;ChunkRAG&#xff0…

Maven(生命周期、POM、模块化、聚合、依赖管理)详解

Maven构建项目的生命周期 在Maven出现之前&#xff0c;项目构建的生命周期就已经存在&#xff0c;软件开发人员每天都在对项目进行清理&#xff0c;编译&#xff0c;测试&#xff0c;部署等工作&#xff0c;这个过程就是项目构建的生命周期。虽然大家都在不停的做构建工作&…

jenkins harbor安装

Harbor是一个企业级Docker镜像仓库‌。 文章目录 1. 什么是Docker私有仓库2. Docker有哪些私有仓库3. Harbor简介4. Harbor安装 1. 什么是Docker私有仓库 Docker私有仓库是用于存储和管理Docker镜像的私有存储库。Docker默认会有一个公共的仓库Docker Hub&#xff0c;而与Dock…

【Python网络爬虫笔记】10- os库存储爬取数据

os库的作用 操作系统交互&#xff1a;os库提供了一种使用Python与操作系统进行交互的方式。使用os库来创建用于存储爬取数据的文件夹&#xff0c;或者获取当前工作目录的路径&#xff0c;以便将爬取的数据存储在合适的位置。环境变量操作&#xff1a;可以读取和设置环境变量。在…

微信小程序从后端获取的图片,展示的时候上下没有完全拼接,有缝隙【已解决】

文章目录 1、index.wxml2、index.js3、detail.detail为什么 .rich-text-style 样式可以生效&#xff1f;1. <rich-text> 组件的特殊性2. 类选择器的作用范围3. 样式优先级4. line-height: 0 的作用5. 为什么直接使用 rich-text 选择器无效&#xff1f; 总结 上下两张图片…

Linux-apache虚拟主机配置笔记

一、 安装apache 有需要的话&#xff0c;可以去查看具体的apache的安装apache安装https://blog.csdn.net/m0_68472908/article/details/139348739?spm1001.2014.3001.5501 都可以使用本地yum源搭建本地yum源搭建https://blog.csdn.net/m0_68472908/article/details/14385692…

xshell连接虚拟机,更换网络模式:NAT->桥接模式

NAT模式&#xff1a;虚拟机通过宿主机的网络访问外网。优点在于不需要手动配置IP地址和子网掩码&#xff0c;只要宿主机能够访问网络&#xff0c;虚拟机也能够访问。对外部网络而言&#xff0c;它看到的是宿主机的IP地址&#xff0c;而不是虚拟机的IP。但是&#xff0c;宿主机可…

SpringBoot使用Nacos进行application.yml配置管理

Nacos是阿里巴巴开源的一个微服务配置管理和服务发现的解决方案。它提供了动态服务发现、配置管理和 服务管理平台。Nacos的核心功能包括服务发现、配置管理和动态服务管理&#xff0c;使得微服务架构下的服务治理 变得简单高效。 Nacos的设计基于服务注册与发现、配置管理、动…

STM32F103单片机HAL库串口通信卡死问题解决方法

在上篇文章 STM32F103单片机使用STM32CubeMX创建IAR串口工程 中分享了使用cubeMX直接生成串口代码的方法&#xff0c;在测试的过程中无意间发现&#xff0c;串口会出现卡死的问题。 当串口一次性发送十几个数据的时候&#xff0c;串口感觉像卡死了一样&#xff0c;不再接收数据…

selenium自动爬虫工具

一、介绍selenium爬虫工具 selenium 是一个自动化测试工具&#xff0c;可以用来进行 web 自动化测试、爬虫 selenium 本质是通过驱动浏览器&#xff0c;完全模拟浏览器的操作&#xff0c;比如跳转、输入、点击、下拉等&#xff0c;来拿到网页渲染之后的结果&#xff0c;可支持…

Unity开发数字孪生项目

前言&#xff1a;记录下自己用Unity开发数字孪生项目&#xff0c;所用到的知识点、功能点以及对项目认知总结&#xff0c;当然还有开发过程中所遇到的坑。此篇博客也是会随时进行更新。 &#x1f60a;屏幕前看到此片文章的开发者们在此类项目开发过程中少走些弯路&#xff0c;希…

node利用路由搭建web实例

npm init npm i express body-parser cookie-parser 封装web实例 搭建路由 导出web 应用实例注册

硬件设计 | Altium Designer软件PCB规则设置

基于Altium Designer&#xff08;24.9.1&#xff09;版本 嘉立创PCB工艺加工能力范围说明-嘉立创PCB打样专业工厂-线路板打样 规则参考-嘉立创 注意事项 1.每次设置完规则参数都要点击应用保存 2.每次创建PCB&#xff0c;都要设置好参数 3.可以设置默认规则&#xff0c;将…

WebDAV服务不能上传大文件,文件超过50M报错[0x800700DF]怎么办?

这个问题需要分别从服务端和客户端解决。 1.Windows客户端 解除50M文件限制&#xff0c;Windows访问Webdav服务时&#xff0c;大于50M文件提示错误[错误:0x800700DF] 部署了webdav&#xff0c;Windows10映射网络磁盘&#xff0c;传输文件超过大约50MB的文件会弹出“0x800700…

安全基础学习-keil调试汇编代码

初始目的是为了通过汇编编写CRC功能。 但是基础为0&#xff0c;所以目前从搭建工程开始记录。 大佬绕路。 &#xff08;一&#xff09;创建项目 1. 新建项目 打开 Keil uVision。选择 Project -> New uVision Project 创建一个新项目。选择你的目标设备&#xff08;如 AR…

安装qt 5.15.2笔记

撰文是2024年12月 最终实现了 1、用梯子下载了离线包5.14.2&#xff0c;最后没用 2、用内地镜像在线安装5.15.2&#xff0c;3分钟装完 正文开始&#xff0c;qt官方简称官方。 官方包官方自5.15.X起&#xff0c;不再提供的exe/run安装包https://download.qt.io/archive/qt/ …

Redis Java 集成到 Spring Boot

Hi~&#xff01;这里是奋斗的明志&#xff0c;很荣幸您能阅读我的文章&#xff0c;诚请评论指点&#xff0c;欢迎欢迎 ~~ &#x1f331;&#x1f331;个人主页&#xff1a;奋斗的明志 &#x1f331;&#x1f331;所属专栏&#xff1a;Redis &#x1f4da;本系列文章为个人学习笔…

麒麟信安推出支持信创PC的新一代云桌面方案,助力政务信创高效安全运维

12月11日&#xff0c;在第二届国家新一代自主安全计算系统产业集群融通生态大会上&#xff0c;麒麟信安发布了支持信创PC的新一代云桌面方案&#xff0c;该方案是基于国际TCI架构实现国产PC机云化纳管在国内的首次发布&#xff0c;并与银河麒麟桌面操作系统、长城国产PC整机实现…

网络原理04

可靠传输&#xff0c;是TCP最核心的特性 可靠传输不是说数据100%传输给接收方了 1&#xff09;发送方发出数据后&#xff0c;能过知道接收方是否收到数据 2&#xff09;一旦发现对方没收到&#xff0c;可以通过一定的方法”补救” 1. 确认应答 发送方&#xff0c;把数据已…

微信小程序5-图片实现点击动作和动态加载同类数据

搜索 微信小程序 “动物觅踪” 观看效果 感谢阅读&#xff0c;初学小白&#xff0c;有错指正。 一、功能描述 a. 原本想通过按钮加载背景图片&#xff0c;来实现一个可以点击的搜索button&#xff0c;但是遇到两个难点&#xff0c;一是按钮大小调整不方便&#xff08;网上搜索…