前端跨域问题的解决方案Access to XMLHttpRequest at ‘http..’ from origin ‘null‘ has been blocked by CORS policy

最新推荐文章于 2024-05-12 14:23:18 发布
最新推荐文章于 2024-05-12 14:23:18 发布
阅读量953 收藏 11
点赞数 10
文章标签： springboot 前端 java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_74930371/article/details/135600011
版权

在前端发出Ajax请求的时候，有时候会产生跨域问题，报错如下:Access to XMLHttpRequest at 'http://localhost:7777/category/getCategoryList' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access 

针对以上问题，本文提供一种解决方案

添加一个实现WebMvcConfigurer实现接口类 进行CORS跨域 配置类

成功解决CORS跨域问题

失眠吐司
关注
  • 10
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Ajax跨域问题及解决方案（jsonp，cors）
10-16
远程服务器上设法动态的把数据装进js格式的文本代码段中，供客户端调用和进一步处理。这篇文章主要介绍了ajax跨域问题解决方案（jsonp，cors） ,需要的朋友可以参考下
解决前端跨域问题方案汇总
09-01
主要介绍了解决前端跨域问题8种方案的相关资料,需要的朋友可以参考下
跨域问题解决办法 (has been blocked by CORS policy:Response……) 原因及解决办法
轻风细雨_林木木
03-20 3万+
参考：https://www.cnblogs.com/wyw0905/p/14990707.html 前端报错 has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. 什么是CORS CORS全称是跨域资源共.
详解ajax跨域问题解决方案
11-30
今天来记录一下关于ajax跨域的一些问题。以备不时之需。 跨域 同源策略限制 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的文档属性。也就是说，受到请求的 URL 的域必须与当前 Web 页面的域相同。这意味着浏览器隔离来自不同源的内容，以防止它们之间的操作。 解决方式 通常来说，比较通用的有如下两种方式，一种是从服务器端下手，另一种则是从客户端的角度出发。二者各有利弊，具体要使用哪种方式还需要具体的分析。 服务器设置响应头 服务器代理 客户端采用脚本回调机制。 方式一 Access-Control-Allow-Origin 关键字只有在服务器端进行设置才 会生效。也就是
SpringBoot—CORS跨域问题详解和解决方案
Andya_net的博客
08-31 1820
关注微信公众号：CodingTechWork，一起学习进步。 引言   在前后端开发过程中，遇到过一种错误，类似于报错： Access to XMLHttpRequest at 'http://127.0.0.1:8080/' from origin 'null' has been blocked by CORS policy! No 'Access-Control-Allow-Origin' header is present on the requested resource. 亦或是 XMLHtt.
AJAX中的跨域(CORS) 问题 （更新于2023.02.04）
D-的博客
08-20 1万+
from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
前端调取.net core webapi 报错：“...CORS policy: Response to preflight request ...“的问题成因和解决办法。
weixin_43710897的博客
03-14 798
将 HTML 页面文件和 Web API 项目文件上传到同一服务器并不会自动解决 CORS 问题，因为 CORS 是浏览器对 AJAX 请求的限制，而不是服务器对请求的限制。要启用 CORS，需要在 Web API 中添加相应的配置，允许来自其他域名的请求。分割线---------------------------------------------------------------------------------------------------------------我不想改api怎么办？
Access to XMLHttpRequest at *** from origin ‘***‘ has been blocked by CORS policy: Response to...
向日葵的专属太阳
04-30 1768
Access to XMLHttpRequest at *** from origin ‘null’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource 当你看到这个错误信息的时候，恭喜你，你遇到了前端攻城狮 .
spring boot允许跨域请求
灵波微布
08-25 278
Ajax发送请求时，浏览器出现这个错误，这是一个跨域请求的问题 from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource
Java 后端彻底解决跨域问题（CORS）
weixin_30409849的博客
08-12 899
接口调用出现跨域问题时，浏览器会报如下提示 XMLHttpRequest cannot load xxx. Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response. 等等信息 直接通过一个过滤器来解决 import j...
PHP Ajax跨域问题解决方案代码实例
01-19
本文通过设置Access-Control-Allow-Origin来实现跨域。 例如：客户端的域名是client.runoob.com，而请求的域名是server.runoob.com。 如果直接使用ajax访问，会有以下错误： XMLHttpRequest cannot load ...
WebApi 跨域问题解决方案：CORS
07-23
同源策略：出于安全考虑，浏览器会限制脚本中发起的跨站请求，浏览器要求JavaScript或Cookie只能访问同域下的内容。...因为我们的WebApi和MVC是两个不同的项目，所以运行起来之后就存在上面说的跨域的问题。
Access to XMLHttpRequest at 'url' from origin 'null' has been blocked by CORS policy: Request header
热门推荐
eriz程序之路
01-24 13万+
Access to XMLHttpRequest at 'url' from origin 'null' has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response. 当跨域请求接口时可能...
Access to XMLHttpRequest at file from origin ‘null‘ has been blocked by CORS policy谷歌浏览器本地打开项目js文件报错
了迹奇有没
02-14 5318
CORS 策略已阻止从源“null”访问“文件路径”处的 XMLHttpRequest：跨源请求仅支持协议方案：http、data、chrome、chrome-extension、https。
has been blocked by CORS policy: Response to preflight request doesn‘t pass access control check
AVATAR
08-26 2万+
如果是自定义Header参数的话，前端发起ajax请求后，浏览器首先会发起一个预检请求（OPTIONS），然后才是业务请求，所以在预检请求的时候浏览器就已经输出跨域报错了，因此针对自定义Header需要把这个预检请求排除掉；/*** 过滤器//... /*** 拦截所有请求，校验url和token//加上校验放行 if(request . getMethod() . equals("OPTIONS")) {} else {} //... }...
使用Ajax时遇到的问题
weixin_45066795的博客
01-21 237
*使用AJAX时遇到的问题 错误一： 报错代码：from origin ‘null’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. 解决方法：在server里将app.get 改为app.all 错误二：
引用import的JS报错：Access to script at 'file:' from origin 'null' has been blocked by CORS policy（3种解决手段）
xiao廸要飞
05-12 3万+
直接引用带有import关键字的JS脚本会报错：Access to script at ‘file:’ from origin ‘null’ has been blocked by CORS policy index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=devic
浏览器预检请求返回400 has been blocked by CORS policy: Response to preflight request doesn’t pass access cont
weixin_53512283的博客
04-02 3万+
这个问题也是很过分头一次遇到，原因是谷歌浏览器在有跨域（CORS）请求时，会先发送一个preflight（预检）请求，之后才会发送fetch请求。 CORS：跨源资源共享(CORS)（或通俗地译为跨域资源共享）是一种基于HTTP头的机制，该机制通过允许服务器标示除了它自己以外的其它origin（域，协议和端口），这样浏览器可以访问加载这些资源。跨源资源共享还通过一种机制来检查服务器是否会允许要发送的真实请求，该机制通过浏览器发起一个到服务器托管的跨源资源的"预检"请求。在预检中，浏览器发...
picoCTF-Web Exploitation-Web Gauntlet
最新发布
huckers的博客
05-12 461
按照提示，需要用admin登录，查看filter.php，这应该是一个SQL注入题，提示我们可以使用无痕浏览器来以便cookie可以不用每次清除。中展示了sql过滤逻辑，可以回味一下，尝试用不同的关键字来注入。提示sql过滤or，我们使用。
Access to XMLHttpRequest at 'file:///D:/vue/vue-first/data.json' from origin 'null' has been blocked by CORS policy
07-28
回答: 这个错误是由于浏览器的CORS策略引起的。CORS是一种安全机制，用于限制跨域请求。当浏览器发现请求的源与目标不在同一个域时，会发送一个预检请求，检查目标服务器是否允许跨域请求。如果目标服务器没有正确配置CORS头部，浏览器就会拒绝该请求，从而导致这个错误。\[1\]\[2\] 对于你提到的具体错误，'file:///D:/vue/vue-first/data.json'是一个本地文件路径，而'null'是请求的源。由于这是一个本地文件请求，而不是通过HTTP协议请求，所以CORS策略不适用于这种情况。因此，你可以通过将数据文件放在与你的应用程序相同的域中，或者使用服务器来提供数据，以避免这个错误。 #### 引用[.reference_title] - *1* [Access to XMLHttpRequest at ‘http://xxx‘ from origin ‘http://xxx‘ has been blocked by CORS ...](https://blog.csdn.net/qq_41470439/article/details/109361842)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [前后端分离跨域问题Access to XMLHttpRequest at ‘http://localhos...has been blocked by CORS policy: ...](https://blog.csdn.net/qq_42416602/article/details/121731774)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [Access to XMLHttpRequest at ‘http://xx‘ from origin ‘http://xx‘ has been blocked by CORS policy](https://blog.csdn.net/weixin_51603038/article/details/129319187)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值