当前位置: 首页 > news >正文

AxiosError: Network Error

 不知怎么的,项目还在开发阶段,之前还好好的,玩儿了两天再一打开发现页面无法显示数据了,报错如下:

 我以为是后端出问题了,但是后端控制台无报错,又用postman测试了一下,可以获取到数据。

后来检查了一下请求,发现是跨域请求换端口的问题,前端是5137,后端是8080,之前是可以的一直没问题

server: {port: 5173,proxy:{'/api':{target:'http://localhost:8080',//后端接口的域名 changeOrigin:true,//是否改变源rewrite:(path)=>path.replace(/^\/api/,''),//重写路径,去掉路径中的/api}}}

 就是换源然后重写路径嘛,之前一直没问题,后来查了资料,有一种说法是前端做了处理还不够,后端也要设置接受这种处理。解决方法如下:

在后端的每一个controller添加@CrossOrigin注解

@CrossOrigin 是 Spring Framework 提供的一个注解,用于解决跨域资源共享(CORS)的问题。当您在后端服务中使用这个注解时,它允许您的后端服务接受来自不同源(即不同域名、协议或端口)的请求。

为什么需要 @CrossOrigin 注解?

在Web开发中,出于安全考虑,浏览器默认会限制从一个源发起的脚本对不同源的资源的访问。这称为同源策略(Same-Origin Policy)。如果后端服务和前端应用不在同一个源上,那么直接发起请求会遭到浏览器的阻止,从而导致跨域请求失败。

@CrossOrigin 注解的作用

  1. 允许跨域请求:使用 @CrossOrigin 注解可以告诉Spring框架,该接口允许跨域请求。这意味着来自不同源的请求将被接受。

  2. 配置CORS响应头@CrossOrigin 注解会自动配置响应头,如 Access-Control-Allow-Origin,以允许跨域请求。您可以在注解中指定允许哪些源访问您的后端服务。

  3. 简化配置:使用 @CrossOrigin 注解可以简化跨域请求的配置,无需手动设置响应头,注解会自动处理这些细节。

相关文章:

AxiosError: Network Error

不知怎么的,项目还在开发阶段,之前还好好的,玩儿了两天再一打开发现页面无法显示数据了,报错如下: 我以为是后端出问题了,但是后端控制台无报错,又用postman测试了一下,可以获取到数…...

CDefFolderMenu_MergeMenu函数分析之添加了分割线和属性菜单项两项

CDefFolderMenu_MergeMenu函数分析之添加了分割线和属性菜单项两项 第一部分: void CDefFolderMenu_MergeMenu(HINSTANCE hinst, UINT idMainMerge, UINT idPopupMerge, QCMINFO *pqcm) { UINT idMax pqcm->idCmdFirst; if (idMainMerge) { HME…...

mysql的源码包安装

安装方式一:(编译好的直接安装) 1.添加一块10G的硬盘,给root逻辑卷扩容 (下面安装方式二有,一模一样的装就行,我就不写了,再写的话篇幅就太长了) 2.下载编译好的源码包…...

win11系统无法打开软件_组策略无法打开_gpedit.msc不生效_为了对电脑进行保护,已经阻止此应用---Windows工作笔记057

碰到这个问题挺麻烦的,要用的软件打不开了. 其实解决方法就是去组策略中修改一个策略就可以了,但是: 先来说: 而且,使用cmd输入的gpedit.msc也打不开了. 这个怎么解决? @echo off pushd "%~dp0"dir /b C:\Windows\servicing\Packages\Microsoft-Windows-GroupPo…...

【JAVA】io流之缓冲流

①BufferedInputStream、BufferedOutputStream(适合读写非普通文本文件) ②BufferedReader、BufferedWriter(适合读写普通文本文件。) 缓冲流的读写速度快,原理是:在内存中准备了一个缓存。读的时候从缓存中…...

from flask_session import Session 为什么是Session(app)这么用?

在 Flask 中,from flask_session import Session 和 Session(app) 的用法是为了配置和使用 Flask-Session 扩展,将用户的会话(Session)数据存储到服务器端(如 Redis、数据库或文件系统),而不是默…...

AI赋能的未来城市:如何用智能化提升生活质量?

这会是我们憧憬的未来城市吗? 随着技术的不断进步和城市化进程的加速,现代城市面临着诸多挑战——交通拥堵、环境污染、能源消耗、人口老龄化等问题愈发突出。为了应对这些挑战,建设智慧城市已成为全球发展的重要趋势。在这一进程中&#xf…...

【Go】Go wire 依赖注入

1. wire 简介 wire 是一个 Golang 的依赖注入框架(类比 Spring 框架提供的依赖注入功能) ⭐ 官方文档:https://github.com/google/wire 这里关乎到编程世界当中一条好用的设计原则:A用到了B,那么B一定是通过依赖注入的…...

深度集成DeepSeek与Java开发:智能编码新纪元全攻略 [特殊字符]

一、DeepSeek:Java开发者的第二大脑 🧠 1.1 传统开发痛点VS智能开发体验 传统开发DeepSeek智能辅助效率提升对比手动编写重复代码一键生成模板代码代码量减少70%↑调试全靠断点日志智能定位缺陷根源问题排查时间缩短60%↓文档维护耗时费力自动生成更新…...

WEB前端将指定DOM生成图片并下载最佳实践(html2canvas)

前言: html2canvas 是一个 JavaScript 库,其主要作用是将 HTML 元素或其部分内容渲染为 Canvas 图像。通过它,开发者可以将网页中的任意 DOM 元素(包括文本、图片、样式等)转换为图片格式(如 PNG 或 JPEG&…...

掌握.NET Core后端发布流程,如何部署后端应用?

无论你是刚接触.NET Core的新手还是已有经验的开发者,在这篇文章中你将会学习到一系列实用的发布技巧与最佳实践,帮助你高效顺利地将.NET Core后端应用部署到生产环境中 目录 程序发布操作 Docker容器注册表 文件夹发布 导入配置文件 网站运行操作 …...

深度学习学习笔记(34周)

目录 摘要 Abstracts 简介 Hourglass Module(Hourglass 模块) 网络结构 Intermediate Supervision(中间监督) 训练过程细节 评测结果 摘要 本周阅读了《Stacked Hourglass Networks for Human Pose Estimation》&#xf…...

C++ 设计模式-备忘录模式

游戏存档实现&#xff0c;包括撤销/重做、持久化存储、版本控制和内存管理 #include <iostream> #include <memory> #include <deque> #include <stack> #include <chrono> #include <fstream> #include <sstream> #include <ct…...

TOGAF之架构标准规范-信息系统架构 | 应用架构

TOGAF是工业级的企业架构标准规范&#xff0c;信息系统架构阶段是由数据架构阶段以及应用架构阶段构成&#xff0c;本文主要描述信息系统架构阶段中的应用架构阶段。 如上所示&#xff0c;信息系统架构&#xff08;Information Systems Architectures&#xff09;在TOGAF标准规…...

第一届网谷杯

统计四场的所有题目&#xff08;共计12题&#xff0c;四场比赛一共上了21题【包括换题】&#xff09; 随便记记&#xff0c;以免老题复用&#xff08;已经复用了&#xff09; Web 文件包含 1 伪协议 http://120.202.175.143:8011/?cphp://filter/convert.base64-encode/reso…...

Linux(ubuntu) GPU CUDA 构建Docker镜像

一、创建Dockerfile FROM ubuntu:20.04#非交互式&#xff0c;以快速运行自动化任务或脚本&#xff0c;无需图形界面 ENV DEBIAN_FRONTENDnoninteractive# 安装基础工具 RUN apt-get update && apt-get install -y \curl \wget \git \build-essential \software-proper…...

mysql -DQL语句和DCL语句

DQL 数据查询语言&#xff08;Data Query Language&#xff0c;DQL&#xff09;是数据库操作语言的重要组成部分&#xff0c;主要用于从数据库中检索数据&#xff0c;核心关键字为SELECT。以下从语法结构、常见操作及示例等方面详细介绍&#xff1a; 语法结构 DQL 的标准语法…...

掌握 ElasticSearch 组合查询:Bool Query 详解与实践

掌握 ElasticSearch 组合查询&#xff1a;Bool Query 详解与实践 一、引言 (Introduction)二、Bool 查询基础2.1 什么是 Bool 查询&#xff1f;2.2 Bool 查询的四种子句2.3 语法结构 三、Bool 查询的四种子句详解与示例3.1 must 子句3.2 filter 子句3.3 should 子句3.4 must_no…...

C++ 类和对象(友元、内部类、匿名对像)

目录 一、前言 二、正文 1.友元 1.1友元函数的使用 1.1.1外部友元函数可访问类的私有成员&#xff0c;友员函数仅仅是一种声明&#xff0c;他不是类的成员函数。 1.1.2一个函数可以是多个类的友元函数 2.友元类的使用 2.1什么是友元类 2.2 友元类的关系是单向的&#x…...

PostgreSQL 常用函数

PostgreSQL 常用函数 在数据库管理系统中&#xff0c;函数是执行特定任务的基本构建块。PostgreSQL 是一个功能强大的开源关系数据库管理系统&#xff0c;提供了丰富的内置函数&#xff0c;这些函数极大地增强了数据库操作的能力。以下是一些在 PostgreSQL 中常用的函数&#…...

多场景 OkHttpClient 管理器 - Android 网络通信解决方案

下面是一个完整的 Android 实现&#xff0c;展示如何创建和管理多个 OkHttpClient 实例&#xff0c;分别用于长连接、普通 HTTP 请求和文件下载场景。 <?xml version"1.0" encoding"utf-8"?> <LinearLayout xmlns:android"http://schemas…...

如何将联系人从 iPhone 转移到 Android

从 iPhone 换到 Android 手机时&#xff0c;你可能需要保留重要的数据&#xff0c;例如通讯录。好在&#xff0c;将通讯录从 iPhone 转移到 Android 手机非常简单&#xff0c;你可以从本文中学习 6 种可靠的方法&#xff0c;确保随时保持连接&#xff0c;不错过任何信息。 第 1…...

图表类系列各种样式PPT模版分享

图标图表系列PPT模版&#xff0c;柱状图PPT模版&#xff0c;线状图PPT模版&#xff0c;折线图PPT模版&#xff0c;饼状图PPT模版&#xff0c;雷达图PPT模版&#xff0c;树状图PPT模版 图表类系列各种样式PPT模版分享&#xff1a;图表系列PPT模板https://pan.quark.cn/s/20d40aa…...

ABAP设计模式之---“简单设计原则(Simple Design)”

“Simple Design”&#xff08;简单设计&#xff09;是软件开发中的一个重要理念&#xff0c;倡导以最简单的方式实现软件功能&#xff0c;以确保代码清晰易懂、易维护&#xff0c;并在项目需求变化时能够快速适应。 其核心目标是避免复杂和过度设计&#xff0c;遵循“让事情保…...

初探Service服务发现机制

1.Service简介 Service是将运行在一组Pod上的应用程序发布为网络服务的抽象方法。 主要功能&#xff1a;服务发现和负载均衡。 Service类型的包括ClusterIP类型、NodePort类型、LoadBalancer类型、ExternalName类型 2.Endpoints简介 Endpoints是一种Kubernetes资源&#xf…...

算法:模拟

1.替换所有的问号 1576. 替换所有的问号 - 力扣&#xff08;LeetCode&#xff09; ​遍历字符串​&#xff1a;通过外层循环逐一检查每个字符。​遇到 ? 时处理​&#xff1a; 内层循环遍历小写字母&#xff08;a 到 z&#xff09;。对每个字母检查是否满足&#xff1a; ​与…...

RabbitMQ入门4.1.0版本(基于java、SpringBoot操作)

RabbitMQ 一、RabbitMQ概述 RabbitMQ RabbitMQ最初由LShift和CohesiveFT于2007年开发&#xff0c;后来由Pivotal Software Inc.&#xff08;现为VMware子公司&#xff09;接管。RabbitMQ 是一个开源的消息代理和队列服务器&#xff0c;用 Erlang 语言编写。广泛应用于各种分布…...

【Linux】自动化构建-Make/Makefile

前言 上文我们讲到了Linux中的编译器gcc/g 【Linux】编译器gcc/g及其库的详细介绍-CSDN博客 本来我们将一个对于编译来说很重要的工具&#xff1a;make/makfile 1.背景 在一个工程中源文件不计其数&#xff0c;其按类型、功能、模块分别放在若干个目录中&#xff0c;mak…...

CVPR2025重磅突破:AnomalyAny框架实现单样本生成逼真异常数据,破解视觉检测瓶颈!

本文介绍了一种名为AnomalyAny的创新框架&#xff0c;该方法利用Stable Diffusion的强大生成能力&#xff0c;仅需单个正常样本和文本描述&#xff0c;即可生成逼真且多样化的异常样本&#xff0c;有效解决了视觉异常检测中异常样本稀缺的难题&#xff0c;为工业质检、医疗影像…...

Kubernetes 网络模型深度解析:Pod IP 与 Service 的负载均衡机制,Service到底是什么?

Pod IP 的本质与特性 Pod IP 的定位 纯端点地址&#xff1a;Pod IP 是分配给 Pod 网络命名空间的真实 IP 地址&#xff08;如 10.244.1.2&#xff09;无特殊名称&#xff1a;在 Kubernetes 中&#xff0c;它通常被称为 “Pod IP” 或 “容器 IP”生命周期&#xff1a;与 Pod …...