【前后端整合跨域拦截】...No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.

最新推荐文章于 2024-03-16 20:12:23 发布
最新推荐文章于 2024-03-16 20:12:23 发布
阅读量239 收藏
点赞数 2
文章标签： 前端 http 网络协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_56450993/article/details/125239956
版权

文章目录


今天第一次尝试前后端整合，出现了如下报错：

报错详情

Access to XMLHttpRequest at ‘http://localhost:8080/index’ from origin ‘http://127.0.0.1:5501’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

报错原因

前端的端口是5501，而后端的端口是8080，前端请求后端时后端会检查request的origin，发现是8080，跟自己的5501不一致，就会有跨域拦截。

在这里插入图片描述

跨域请求

跨域请求就是指：当前发起请求的域与该请求指向的资源所在的域不同时的请求。即“协议 + 域名 + 端口号” 有不相同，那么就是跨域。

>>> 快速导航【解决办法】

在网上找到了很多解决办法，我用的是最简单粗暴的解决方式，直接在对应Controller上添加@CrossOrigin注解
在这里插入图片描述

由于今天是第一次尝试前后端整合，所以那些别的解决方式都还看不明白。之后搞明白了会及时在博客补充，欢迎关注忻辰～

忻辰i
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
静态文件访问不到报No Access-Control-Allow-Origin处理办法
06-11
静态文件访问不到报No 'Access-Control-Allow-Origin' header is present on the requested resource处理办法
Nginx跨域设置Access-Control-Allow-Origin无效的解决办法
01-10
add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Credentials' 'true'; add_header 'Access-Control-Allow-Methods' 'GET,POST'; 使用以下配置，生效。 if ($request_method = '...
No 'Access-Control-Allow-Origin' header is present on the requested resource. 跨域问题！
开心就好~~~专栏
01-23 18万+
跨域问题项目背景车祸现场解决问题总结 项目背景 前端：VUE 后端：Java JDK 1.8 Springboot 1.5.12 maven 3.3.9 服务器环境：Linux nginx 数据库：mysql 车祸现场 1、废话不说直接上干货 仔细一点可以看出，No ‘Access-Control-Allow-Origin’ header is present on the requested...
解决CORS : No ‘Access-Control-Allow-Origin’ header is present on the requested问题 ，Nginx跨域配置。
最新发布
bk_陈龙伟
03-16 2799
解决CORS : No ‘Access-Control-Allow-Origin’ header is present on the requested问题 ，Nginx跨域配置。
No 'Access-Control-Allow-Origin' header is present on the requested resource'， 跨域访问的解决方法
热门推荐
木子叶的奔跑
11-13 32万+
当请求不在同一域名下的资源文件（ip地址+端口号）时，会报如下错误： “No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8080’ is therefore not allowed access.”，翻译下，因为被请求的资源没有设置 ‘A...
完美解决：No ‘Access-Control-Allow-Origin‘ header is present on the requested resource
white0718的博客
07-24 1万+
分析：当我们请求一个接口的时候，出现如：Access-Control-Allow-Origin 字眼的时候说明请求跨域了。前端是vue,后端是springcloud，完全的前后端分离的项目，前端在向后端发送请求的时候出现如下的错误。把我工作中遇到的问题和解决的问题的过程记录下来，同时希望也可以帮到大家！文件，在该文件内新增配置。
No ‘Access-Control-Allow-Origin‘ header is present on the requested resource关于vue跨域问题
qq_42212557的博客
12-06 2万+
No 'Access-Control-Allow-Origin' header is present on the requested resource关于vue跨域问题
Nginx配置跨域请求Access-Control-Allow-Origin * 详解
09-09
主要给大家介绍了关于Nginx配置跨域请求Access-Control-Allow-Origin * 的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用Nginx具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
已解决：No 'Access-Control-Allow-Origin'跨域问题
08-19
主要介绍了已解决：No 'Access-Control-Allow-Origin' 跨域，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
异常 AJAX 跨域请求报：No ‘Access-Control-Allow-Origin‘ header is present
01-15
测试代码
处理 No 'Access-Control-Allow-Origin' header is present on the requested resource 问题
qq_37647296的博客
04-19 6万+
在开发中，前端同事调用后端同事写好的接口，在地址中是有效的，但在项目的ajax中，浏览器会报 "No 'Access-Control-Allow-Origin' header is present on the requested resource"的错误。 这是由于浏览器禁止ajax请求本地以外的资源，解决办法如下： 后端同事在Controller层的类上增加@CrossOrign注解，当前...
跨域 No 'Access-Control-Allow-Origin' header is present on the requested resource.
小花生编程
01-13 18万+
什么是跨域访问 在A网站中，我们希望使用Ajax来获得B网站中的特定内容。如果A网站与B网站不在同一个域中，那么就出现了跨域访问问题。你可以理解为两个域名之间不能跨过域名来发送请求或者请求数据，否则就是不安全的。跨域访问违反了同源策略， 同源策略规定，浏览器的ajax只能访问跟它的HTML页面同源（相同域名或IP）的资源。 跨域 ...
后台解决跨域问题
m1s2q3l4的博客
02-18 448
出现的问题 解决办法： 1.创建工具类 2.进行实现 package com.shoppingbackstage.config; import org.springframework.context.annotation.Bean; import org.springframework.context.annotation.Configuration; import org.springframework.web.cors.CorsConfiguration; import org.springframew
解决跨域问题：No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.
一起加油吧！
12-10 5388
CORS，全称Cross-Origin Resource Sharing，是一种允许当前域（domain）的资源（比如html/js/web service）被其他域（domain）的脚本请求访问的机制，通常由于同域安全策略（the same-origin security policy）浏览器会禁止这种跨域请求。
No Access-Control-Allow-Origin header is present on the requested resource.解决
是日已过，命亦随减的博客
06-10 1万+
出现此问题的原因是 所请求的资源上没有“ Access-Control-Allow-Origin”标头。 这个是域名的问题，比如你本地域名跟测试站域名冲突，因为在代码中已经设置成某个固定的域名了，所以请求接口的时候本地无法访问到测试站域名，所以要找到config文件最初配置域名的地方把他改成本地的域名就可以了 了。 解决跨域问题也很简单，在PHP代码中增加头部即可。 $header['Access-Control-Allow-Origin'] = '*'; $header['Access-Contr
No 'Access-Control-Allow-Origin' header is present on the requested resource.
小猿备忘录
03-29 2936
(1)错误描述：这是在做前后端分离项目跨域时候遇到的，错误的大致意思是没有Access-Control-Allow-Origin 这个头。 Access to XMLHttpRequest at 'http://***.***.**.com/**/**?fromDate=&toDate=&currentPage=1&pageSize=100' from origin ...
跨域请求常见错误及解决：No ‘Access-Control-Allow-Origin‘ header is present on the requested resource
二饭的博客
12-14 1万+
我的项目是Vue+Boot前后端分离项目。出现标题的错误信息的可能如下： 第①种情况 后端没有设置跨域，这里以Boot项目为例，在类上使用如下注解：表示这个类中的方法都可以进行跨域 @RestController @RequestMapping("client/recruit") @CrossOrigin public class RecruitClient { } 第②种情况 后端拦截器或过滤器中没有允许该请求方法通过，正确写法如下：拦截器示例 response.setHeader("Access-
spring has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
09-09
浏览器就会拦截该请求，并报错"Access to XMLHttpRequest at 'http://....' from origin 'http://....' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested ...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值