03-解决header(‘Access-Control-Allow-Origin:*‘)失效问题

已于 2023-08-31 16:06:16 修改
阅读量2.3k 收藏 1
点赞数
分类专栏： 01_bug回收站 文章标签： javascript html 前端
于 2023-03-23 16:56:02 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/q506174602/article/details/129734062
版权

bug介绍

已经在所调用函数中，添加header('Access-Control-Allow-Origin:*');的前提下，

报错：No 'Access-Control-Allow-Origin' header is present on the requested resource.

bug分析 

出现此bug的情况主要有两种:

1.axios的请求方式有问题

2.跨域访问的设置项不全面

 bug解决 

针对第一种情况：

找到axios的请求方法 ---> 将method : "post"设置好

针对第二种情况:

打开tp创建的项目 ---> 打开app文件夹 ---> 打开middleware.php ---> 在return中添加

\think\middleware\AllowCrossDomain::class

然后,打开app文件夹 ---> 打开BaseController.php ---> 在__construct中添加 --->

header('Access-Control-Allow-Origin:*');

彻底解决跨域问题 

七色的天空
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
Access-Control-Allow-Origin跨域问题，使用Nginx配置来解决
begefefsef的博客
08-01 940
以上就是今天要讲的内容，本文仅仅简单介绍了用nginx来解决Access-Control-Allow-Origin跨域问题；先自我介绍一下，小编13年上师交大毕业，曾经在小公司待过，去过华为OPPO等大厂，18年进入阿里，直到现在。深知大多数初中级java工程师，想要升技能，往往是需要自己摸索成长或是报班学习，但对于培训机构动则近万元的学费，着实压力不小。自己不成体系的自学效率很低又漫长，而且容易碰到天花板技术停止不前。...
Access-Control-Allow-Origin:*不生效
ssk0411的博客
11-18 1万+
前端附带身份凭证的请求，所以服务器Access-Control-Allow-Origin 不能设为* 附带身份凭证的请求与通配符 对于附带身份凭证的请求，服务器不得设置 Access-Control-Allow-Origin 的值为“*”。 这是因为请求的首部中携带了 Cookie 信息，如果 Access-Control-Allow-Origin 的值为“*”，请求将会失败。而将 Access-Control-Allow-Origin 的值设置为 http://foo.example，则请求将成功执行。
Nginx配置跨域请求Access-Control-Allow-Origin * 详解
09-09
主要给大家介绍了关于Nginx配置跨域请求Access-Control-Allow-Origin * 的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用Nginx具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
解决跨域nginx增加Access-Control-Allow-Origin设置无效问题
xiandaomao5643的博客
03-15 1107
查看Response Headers中是否返回多个Access-Control-Allow-Origin， 如果后台和nginx同时都设置了，会有多个，就会跨域失败。
正确解决No ‘Access-Control-Allow-Origin’ header is present on the requested resource异常的有效解决方法
wbajsjhhhhh的博客
05-03 7570
正确解决No ‘Access-Control-Allow-Origin’ header is present on the requested resource异常的有效解决方法
Nginx跨域设置Access-Control-Allow-Origin无效的解决办法
01-10
nginx 版本 1.11.3 使用大家说的以下配置，验证无效，跨域问题仍然存在 add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Credentials' 'true'; add_header 'Access-Control-Allow-Methods' 'GET,POST'; 使用以下配置，生效。 if ($request_method = 'OPTIONS') { add_header 'Access-Control-Allow-Origin' '*';
VUE axios 跨域问题 No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.
热门推荐
王小二的博客
01-07 5万+
开发环境中，使用axios调用接口时，出现跨域的时候会被浏览器拦截，故而造成请求失败，并且在控制台中显示No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access....
Axios 跨域
hongkid的专栏
01-10 2098
如果你的系统依赖cookie，则withCredentials还是需要开启为true，但服务端就需要修改Access-Control-Allow-Origin配置到支持ajax请求的域，然后再配置上"Access-Control-Allow-Credentials", "true"如果你的系统不依赖cookie，则只需要把withCredentials关掉，注释即可，服务端还是按配置Access-Control-Allow-Origin:"*"
VUE2：关于axios的跨域问题（No ‘Access-Control-Allow-Origin‘ ）以及解决方案（亲测有用，全流程配图文版，建议收藏）
jialuosi的博客
10-07 9181
其原理大致就是我刚刚添加了Axios.defaults.baseURL = '/api'，其每次发送请求都会加一个/api的前缀，这里拦截器拦截api前缀后将其替换为 target。今天在开发中新写了一个前端的项目作为集成，公司是保密项目所以公司代码肯定是不能粘贴了，回家之后还是觉得记录一下比较好，所以自己模拟了一个来给大家解决一下。接下来再看vue.config.js文件，没有就自己创建一个，但是一般都会有，名字不能错。
解决 Axios 跨域问题，轻松实现接口调用
LiamHong_的博客
09-15 1万+
Axios 跨域常用的解决方法有 CORS、JSONP、代理等，开发环境可通过代理服务器实现跨域，CORS 需要服务端设置 Access-Control-Allow-Origin 响应头，JSONP 只支持 GET 请求。选择适合项目需求的解决方案能够很好地解决跨域问题，保障应用的正常运行。FastAPI 与 Flask：Python Web 两大流行框架综合对比Axios 怎么通过 FormData 对象上传文件？跨源资源共享（CORS） - HTTP | MDN。
'Access-Control-Allow-Origin' 报错
AKIM一枚
04-29 1722
问题 浏览器控制台出现以下报错 Failed to load xxxxxxxxxxxxxx : The value of the ‘Access-Control-Allow-Origin’ header in the response must not be the wildcard ‘*’ when the request’s credentials mode is ‘include’. O...
前Vue，后Express的'Access-Control-Allow-Origin'问题
nzyalj的博客
05-06 2万+
起因都知道如果使用 vue-cli 快速构建Vue（版本：2.0）开发环境的话都会有一个webpack-server 为你打开一个 localhost 端口展示结果。但是毕竟构建一个单页面应用肯定需要再写一个后端服务器，那么首选就是用Express（版本：4.0），而这个服务器会开启另一个 localhost 端口（比如webpack-server使用的是localhost:8080，而Expres
SpringBoot跨域Access-Control-Allow-Origin实现解析
08-25
SpringBoot 跨域 Access-Control-Allow-Origin 实现解析是指在 SpringBoot 框架中解决跨域问题的方法。跨域是指不同域名之间相互访问，浏览器不能执行其他网站的脚本，这是由浏览器的同源策略所造成的安全限制策略。...
TOMCAT 跨域 CORS Access-Control-Allow-Origin cors-filter
06-20
标题“TOMCAT 跨域 CORS Access-Control-Allow-Origin cors-filter”提及的是在Tomcat服务器上实现CORS策略的一种方式，主要涉及到`Access-Control-Allow-Origin`这个关键的响应头。 `Access-Control-Allow-Origin`...
header('Access-Control-Allow-Origin:*')，理解跨域
一只不正经的程序猿的博客
11-11 5155
1.什么是跨域 跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。 所谓同源是指，域名，协议，端口均相同，不明白没关系，举个例子： http://www.123.com/index.html 调用 http://www.123.com/server.php （非跨域） http://www.123.com/index.html 调用 http:...
Vue之用户登录功能（六）使用axios解决‘Access-Control-Allow-Origin’跨域
慎独
08-03 1万+
文章目录引入axios发送Ajax请求解决’Access-Control-Allow-Origin’跨域问题总结 引入axios 1、回到vue脚手架工程，输入命令 npm i axios 2、在src/axios/目录下创建index.js import Vue from 'vue' import axios from 'axios' axios.defaults.baseURL = 'http://127.0.0.1:3000' Vue.prototype.$ajax = axios 3、在mai
vue axios 配置上服务器后报错'Access-Control-Allow-Origin' header]（亲测）
gb4215287的博客
05-06 6147
vue项目配置到服务器后，请求能够成功，返回的数据也能在浏览器中看见，但是报错： Failed to loadhttp://pre.api.jmxy.mockuai.c...: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the r...
axios springboot 跨域问题解决 Access-Control-Allow-Origin Access-Control-Allow-Credentials
tang_jian_dong的博客
09-03 4745
这是本地环境解决用的， 部署服务器测试或生产环境时必须注释掉， 服务器环境下有nginx可以解决跨域问题。 最终解决为步骤 5。 1：403 前端访问后端controller 403 , 代表跨域无权限访问 2: 后端类加上 @CrossOrigin 放开权限的注解， 3：@CrossOrigin 为 * ， 下图图片Access-Control-A...
header("Access-Control-Allow-Origin:*");
最新发布
05-16
header("Access-Control-Allow-Origin:*")是HTTP响应头的一部分，它允许当前网站的资源被其他域名下的网站所访问。例如，如果你在网站A中使用AJAX请求获取网站B的数据，当B网站的服务器返回数据时，如果B网站设置了header("Access-Control-Allow-Origin:*")，那么A网站就可以正常获取到数据并处理。这个HTTP响应头在跨域资源共享（CORS）中非常常见。 注意，header("Access-Control-Allow-Origin:*")是一种开放策略，允许所有域名下的网站访问当前网站的资源，因此在实际应用中需要慎重考虑安全问题，可以考虑设置允许访问的特定域名或者限制访问的HTTP方法等。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

七色的天空

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值