跨域问题403/Network Error

HTTP403使用Ajax的POST方法向后台传输数据出现的问题的解决方案 使用Java MVC,结合前端Ajax代码,传输json串。 需求:通过前端的Ajax方法,向后台POST一个JSON串。 之前使用的是GET方法,但是需要传输的数据太长,GET已经无法满足需求,因此改成POST方法。 在这种情况下,403错误的原因十有八九可能是csrf的缘故。 GET为什么能成功呢?因为GET方法不需要CSRF,而POST必须需要它! 在jsp页面需要加上这样一行代码: &lt... 阅读详情

1 什么是跨域

1.1 问题出现

403/Network Error
出现跨域问题

1.2 跨域分析

网址url组成
协议://域名:port/uri
协议:HTTP/HTTPS
域名:由一串字符+域名后缀组成
port:端口号,定位服务器
uri:资源路径

跨域,顾名思义,即跨域名访问。
跨域的几种情况:

  • 域名不同
    www.baidu.com 与 www.csdn.com
  • 域名相同,端口号不同
    www.baidu.com:1001 与 www.baidu.com:1030
  • 二级域名不同
    pan.baidu.com 与 zhidao.baidu.com

其中,域名和端口都相同,但是请求路径不同,**不**属于跨域,如:

www.jd.com/item

www.jd.com/goods

跨域并不一定就有跨域问题,跨域问题是浏览器针对Ajax请求的一种安全限制。
即:

一个页面发起的ajax请求,只能适用于当前页同域名的路径,能有效的阻止跨站攻击。

2 解决办法

解决方案有很多,比如:JsonP、nginx反向代理(部署)、CORS等,我这儿采用CORS方案解决。

CORS:W3C标准,跨域资源共享(Cross-origin resource sharing)

SpringMVC在底层已经帮我们实现了CORS的跨域原理,并提供了相应的跨域过滤器:CorsFilter。

/**
 * 解决跨域问题
 */

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

@Configuration
public class GlobalCorsConfig {
    @Bean
    public CorsFilter corsFilter() {
        //1.添加CORS配置信息
        CorsConfiguration config = new CorsConfiguration();
        //1) 允许的域,不要写*,否则cookie就无法使用了
        config.addAllowedOrigin("http://127.0.0.1:8080");
        //2) 是否发送Cookie信息
        config.setAllowCredentials(true);
        //3) 允许的请求方式
        config.addAllowedMethod("OPTIONS");
        config.addAllowedMethod("HEAD");
        config.addAllowedMethod("GET");
        config.addAllowedMethod("PUT");
        config.addAllowedMethod("POST");
        config.addAllowedMethod("DELETE");
        config.addAllowedMethod("PATCH");
        // 4)允许的头信息
        config.addAllowedHeader("*");
        //2.添加映射路径,我们拦截一切请求
        UrlBasedCorsConfigurationSource configSource = new
                UrlBasedCorsConfigurationSource();
        configSource.registerCorsConfiguration("/**", config);
        //3.返回新的CorsFilter.
        return new CorsFilter(configSource);
    }
}
java解决跨域问题时的403报错 什么是跨域问题?当一个请求的url的协议,域名,端口三者之间任意一个与当前页面url不同 即为跨域。 阅读详情

相关推荐

Vue CLI 4.x 开发环境跨域配置:3步配置 proxyTable 解决 Axios 请求 403

本文详细介绍了Vue CLI 4.x开发环境中如何通过3步配置proxyTable解决Axios请求403跨域问题。从理解跨域本质到实战配置,涵盖代理原理、Axios基础URL设置及高级疑难解答,帮助开发者高效解决前后端分离开发中的跨域限制。

weixin_33725239的博客 436

Spring 处理跨域请求

Spring 处理跨域请求

weixin_42683274的博客 881

前端图片加载失败排查指南:从路径到跨域的完整解决方案

在Web开发中,静态资源加载是基础且关键的技术环节。其核心原理涉及浏览器解析、HTTP请求响应、服务器文件系统与安全策略的协同。理解这一流程的技术价值在于,它能确保用户体验的流畅性,并直接影响网站性能与SEO表现。常见的应用场景包括网页图片展示、图标渲染、媒体内容加载等。当资源加载失败时,开发者需要系统性地排查路径、服务器配置、网络策略及跨域问题。本文聚焦于图片加载失败这一典型场景,结合浏览器开发者工具的使用与服务器端配置,提供一套从现象到根源的完整诊断思路,帮助开发者高效解决常见的404、403及CORS

优快云头条 916

请求接口报错net::ERR_FAILED

出现这个问题的原因: 1:前端域名配置错误 2:后端没有配置这个域名 解决: 确定当前接口请求和后端配置的域名一致,如果不一致,需要前端配置文件中改为和后端域名一致,如果项目中有使用多个域名的配置,除了主域名的接口之外,其他的域名接口需要单独代理调用,我当前的调用方式: getStoreSwitch(options = {}) { // 开关获取 options.baseURL = process.env.VUE_APP_WHALE_API options.url = `/pointma.

weixin_45422787的博客 8万+

若依框架跨域问题解决方案与实战配置

跨域资源共享(CORS)是现代Web开发中的常见问题,它源于浏览器的同源策略安全机制。该机制要求协议、域名和端口完全一致才能进行资源交互,否则会触发跨域限制。在前后端分离架构中,前端应用与API服务往往部署在不同域名或端口,这使得CORS成为必须解决的技术挑战。通过合理配置Access-Control-Allow-Origin等响应头,开发者可以安全地控制跨域访问权限。在若依(Ruoyi)这类企业级快速开发框架中,跨域问题尤为突出,特别是在整合Sa-Token等安全组件时。本文从HTTP协议层出发,详解如何

android_mylove的专栏 343

接口测试、鉴权与跨域:HTTP联调实战排错指南

在前后端分离的开发模式下,HTTP接口是系统间通信的基石,接口的稳定性与安全性直接决定联调效率与线上质量。理解接口测试的层次、鉴权机制的选择以及跨域问题的根源,是每位工程师必备的技能。接口测试不能只看状态码,还需覆盖连通、正确、健壮、安全四个维度,通过断言响应体、异常输入、并发压力等方式确保业务逻辑可靠。鉴权设计需结合场景,在Cookie Session、Token、JWT、OAuth2等方案中合理取舍,并警惕日志、前端存储、代码仓库中的密钥泄露风险。跨域问题本质是浏览器的同源策略,CORS配置、预检请求、

weixin_33782386的博客 154

跨域资源共享 CORS 详解

跨域资源共享 CORS 详解作者:阮一峰日期:2016年4月12日CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sharing)。它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制。本文详细介绍CORS的内部机制。(图片说明:摄于阿联酋艾因(Al Ain)的绿洲公园)一、简介...

weixin_34365417的博客 2573

Nginx反向代理解决前端跨域问题:原理、配置与实战

跨域问题是前端开发中常见的挑战,其根源在于浏览器的同源策略,这是一种重要的安全机制,用于防止恶意网站窃取用户数据。为了解决不同源之间的资源交互问题,W3C制定了CORS(跨源资源共享)规范,它通过预检请求和特定的HTTP头部来实现安全的跨域通信。在工程实践中,直接在应用层处理CORS虽然可行,但在微服务架构和API网关场景下,配置分散且维护成本高。利用Nginx反向代理技术,可以将跨域处理从应用层剥离,部署在基础设施层,实现统一、高效、安全的解决方案。通过配置Nginx的proxy_pass指令和add_h

weixin_34059951的博客 474

Vue Element Admin Network Error vue跨域报错

解决vue请求跨域问题 vue-element-admin关掉mock改为本地后端项目api后报错:Network Error Request URL: http://localhost:8082/api/admin/login Referrer Policy: strict-origin-when-cross-origin Request URL: http://localhost:8082/api/admin/login Request Method: OPTIONS Status Code: 403

weixin_44008257的博客 5344

保姆级教程:手把手教你为STM32F407和W25Q128制作Keil MDK的SPI Flash下载算法(FLM文件)

本文提供了一份详细的教程,指导开发者如何为STM32F407和W25Q128制作Keil MDK的SPI Flash下载算法(FLM文件)。从理解下载算法的核心机制到实现FlashPrg.c的核心操作,再到链接脚本与地址映射实战,手把手教你完成定制化SPI Flash下载算法的开发与优化。

weixin_28716769的博客 408

C#实战:5分钟搞定Modbus RTU通讯(基于NModbus4库)

本文详细介绍了如何使用C#和NModbus4库快速实现Modbus RTU通讯,包括环境配置、核心功能实现、性能优化及常见问题排查。通过代码示例和实用技巧,帮助开发者高效完成工业自动化设备的数据采集与控制任务。

weixin_30689307的博客 468

前端接口抓取与Mock数据实战:Network面板、跨域代理和分页鉴权

在前后端分离项目中,API 请求是前端获取与渲染数据的核心链路;浏览器 Network 面板则把请求方法、请求头、查询参数与响应结构完整暴露出来。受同源策略影响,直接在前端代码中调用跨域接口常被拦截,而通过开发服务器代理或本地中转层,可以复现真实请求并完成字段对齐。它的技术价值在于:让表格、筛选、分页、鉴权、加载与错误状态不再依赖后端排期,用 Mock 数据即可跑通交互与测试。典型场景包括后台管理系统、作品集演示和接口联调。围绕前端、API、抓取与 Mock 数据落地,重点讨论从 Network 抓包、cU

weixin_33966095的博客 312

OpenCode:终端开源AI编程助手,多模型接入与实战指南

AI编程助手正在从IDE侧边栏走向终端环境。其核心原理是让模型直接读取项目文件、执行命令、查看报错,形成从诊断到修复的完整闭环,从而解决传统插件上下文割裂的问题。技术价值在于开源透明、模型无关,既可接入OpenAI等云端服务,也能通过Ollama连接本地模型,兼顾数据安全与离线场景。在工程实践中,它适用于长时间驻留项目、自动修Bug、团队统一AI工具链等需求。OpenCode正是这样一款终端AI助手,支持灵活配置第三方API密钥,提供免费档与Go套餐,并通过Skills技能系统让模型遵循标准操作流程。同时,

weixin_28745821的博客 327

前端必知:CORS与403错误的那些事儿

部署这个工具时,发现其内置的Web容器自动处理了证书和域名配置,原本需要折腾半天的HTTPS测试环境,现在点个按钮就能搞定。最近在对接第三方API时,又遇到了经典的403 Forbidden错误。作为前端开发者,跨域问题就像打不完的小怪兽,今天就来聊聊如何用Vue3打造一个CORS调试沙盒,从此告别抓狂的排查过程。建议遇到类似问题的同学可以试试这个思路,把复杂的跨域调试过程可视化。排查:在沙盒中查看哪些头触发了预检,检查服务器是否在Access-Control-Allow-Headers中包含该头。

MoonbeamRaven28的博客 435

Qt C++实现HTTP/HTTPS服务器与客户端:从Socket到协议解析全流程

HTTP协议作为Web通信的基础,定义了客户端与服务器之间基于文本的请求-响应模型。其工作原理是通过TCP连接传输结构化的报文,实现资源获取与数据交换。在C++开发中,掌握HTTP协议底层实现具有重要技术价值,能够帮助开发者构建高性能、可深度定制的网络应用,尤其适用于嵌入式设备管理、桌面应用后端等场景。本文聚焦于使用Qt框架的QTcpSocket和QSslSocket组件,从Socket层面手动实现完整的HTTP/HTTPS通信栈,涵盖协议解析、流式处理、路由分发等核心环节,并深入探讨了HTTPS证书验证、

weixin_31292729的博客 332

【事件相机实战】噪声识别与智能滤波技术解析

本文深入解析了事件相机应用中关键的噪声识别与智能滤波技术。针对背景活动噪声、阈值波动噪声、热点噪声及运动边缘尾迹等核心噪声类型,文章剖析了其成因与特征,并详细介绍了从经典的时空相关性滤波、热点像素滤除到前沿的深度学习(如EDnCNN)等实战滤波方法,旨在帮助开发者在保证低延迟的前提下,有效提升事件流数据质量。

weixin_29169899的博客 439

关于Amazon S3; Status Code: 403; Error Code: 403 Forbidden问题

上午可以通过spring boot上传文件到minio,下午就不能上传了,重启了docker和查看权限,还是不行记得人在外面没网的时候一定要关闭虚拟机,有网了再打开。时间不同步这个问题一直没发现。另外我最近在尝试通过内网穿透运维一个自己写的网站。添加链接描述希望能给我一些建议。

he___H的博客 381

YOLOv26全流程实战手册:从yaml配置拆解到训练推理参数调优(附虚拟环境搭建)

以“车辆、行人、小型物体”3类数据集为例,修改# 1. 修改类别数nc: 3# 2. 调整锚框(适配小目标)anchors:- [12,16, 16,24, 33,23] # 增加小锚框# 3. 轻量化调整(边缘部署)depth_multiple: 0.25 # 降低深度系数width_multiple: 0.20 # 降低宽度系数# 其余Backbone/Head结构不变yaml配置:核心是调整nc(类别数)、(轻量化)、anchors(适配目标尺度);虚拟环境。

专注于Python爬虫开发,分享爬虫技巧、项目实战与反爬经验,使用Scrapy、BeautifulSoup等工具,解决数据抓取难题。 879

微服务网关ajax转发跨域的问题解决方案

浏览器端报错: “NetworkError: 403 Forbidden - http://192.168.10.147:8080/mytest/helloworld” helloworld 已阻止跨源请求:同源策略禁止读取位于 http://192.168.10.147:8080/mytest/helloworld 的远程资源。(原因:CORS 头缺少 ‘Access-Control-Al...

韩小文的博客 3746

AgentScope 2.0 API完全指南:构建企业级AI智能体应用的技术实践

本文系统梳理AgentScope 2.0框架的完整API体系,涵盖智能体核心引擎、统一模型适配层、工具系统、消息协议、权限控制与工作空间管理等七大核心模块。通过深入的源码级分析与架构图示,详细解读Agent类的推理-行动循环、ChatModelBase的多模型抽象、Toolkit的工具管理机制、ContentBlock的多模态内容表达、PermissionEngine的安全决策流程,以及Local/Docker/E2B三种工作空间实现。文章还提供了智能客服系统的完整实战案例,展示从自定义工具开发到流式服务部

program哲学 474

华为OD机试 - 机器人活动区域(Python/JS/C/C++ 双机位C卷 200分)

本专栏收录于《华为OD机试真题(Python/JS/C/C++)》。刷的越多,抽中的概率越大,私信哪吒,备注华为OD,加入华为OD刷题交流群,每一题都有详细的答题思路、详细的代码注释、3个测试用例、为什么这道题采用XX算法、XX算法的适用场景,发现新题目,随时更新。现有一个机器人,可放置于 M × N的网格中任意位置,每个网格包含一个非负整数编号。当相邻网格的数字编号差值的绝对值小于等于 1 时,机器人可在网格间移动问题:求机器人可活动的最大范围对应的网格点数目。说明:1)网格左上角坐标为 (0, 0),右

学Java,找哪吒 1434

彻底解决x-ui跨域难题:CORS配置与前端请求实战

你是否在使用x-ui时频繁遇到"Access to XMLHttpRequest at 'http://xxx' from origin 'http://yyy' has been blocked by CORS policy"错误?作为基于Gin框架开发的代理管理面板,x-ui的跨域问题常常让用户在集成第三方系统或开发自定义前端时头疼不已。本文将通过3个实战步骤,结合[x-ui源代码](http

gitblog_00815的博客 961

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

WebSocket不是新协议?借HTTP握手讲透原理、跨域与排查

实时通信场景中,WebSocket 是绕不开的技术方案。很多人以为它是一门需要从零学的新协议,实际上它先借 HTTP 完成一次协议升级:通过标准的 GET 请求携带 Upgrade 头,服务端返回 101 后,连接才切换为 WebSocket 帧通信。理解这个握手过程,是掌握连接建立、Origin 校验、跨域限制以及 Nginx 代理配置的关键。基于 HTTP 基础设施的升级机制,让 WebSocket 天然复用端口、TLS 和运维体系,广泛应用于聊天、推送、协同编辑等低延迟场景。遇到连接失败,优先排查握手

weixin_33795806的博客 400

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

jre9下载 jdk9

(Java SE Runtime Environment 9.0) 9.0u175 官方最新版 【x86|x64】

前后端分离项目由于同源策略导致的跨域问题

同源策略跨域问题

画个圆圆的地球 749

lwip-2.0.3

lwip是瑞典计算机科学院(SICS)的Adam Dunkels 开发的一个小型开源的TCP/IP协议栈。实现的重点是在保持TCP协议主要功能的基础上减少对RAM 的占用。

Spring Security 跨域问题全解析:从过滤器链到 CORS 正确配置

同源策略是浏览器安全机制的基石,它约束了不同源之间的资源访问,当页面与接口协议、域名或端口不一致时,便产生跨域请求。为解除这一限制,服务端通常通过 CORS 响应头告知浏览器放行,而处理 CORS 的方式多种多样:从 Controller 上的 @CrossOrigin 注解,到 WebMvcConfigurer 全局配置,再到过滤器链级别的统一拦截。理解这些方案的核心差异,需要先区分简单请求与预检请求,同时认清 Spring Security 作为 Servlet 过滤器链的前置特性——如果认证授权早于

WGH100817的博客 458

WebSocket跨域与Nginx反代排查:从原理到生产实战

实时通信场景下,WebSocket以其全双工、低延迟的特性成为即时通讯、在线协作的首选方案。但WebSocket的跨域机制与普通HTTP接口截然不同,传统CORS配置对它并不生效,真正的控制权在服务端对Origin头的校验。同时,Nginx反向代理若未正确透传Upgrade头,握手请求会被静默降级为普通HTTP,导致连接频繁掉线。理解握手阶段基于HTTP、后续切换为WS协议的本质,是排查连接问题的关键。从浏览器同源策略的边界到服务端白名单校验,从心跳保活到断线重连的状态机设计,每个环节都直接影响生产环境的稳

weixin_34122604的博客 427
上一篇: 浅学ElasticSearch分布式全文搜索引擎
下一篇: 异步查询工具axios的简单应用
dieuking
博客等级 码龄8年 16粉丝 13原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值