跨域请求错误: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource
今天在学习Angular 的HttpInterceptor 拦截器时,发现添加了新的headers键值之后总是报跨域错误。后台使用的是asp.net core。
检查发现,在添加了新的header之后,每次请求之前都会先发送一个options请求,这个请求被后台拒绝了,所以导致报错。我的后台跨域代码只启用了 AllowAnyOrigin()
方法,所以拒绝了options请求。
为什么会产生options请求呢?参考以下文章,原来是添加了header之后产生非简单请求,所以浏览器会先发送一个options请求到服务器判断一下。
跨域之由Request Method:OPTIONS初窥CORS

由于是被后台拒绝的,所以修改后台代码就可以了。有两种方法
1.修改startup里的ConfigureServices 和 Configure方法
ConfigureServices:
services.AddCors(options =>
{ options.AddPolicy("cors", p =>
{ p.AllowAnyOrigin();
p.AllowAnyHeader();
p.AllowAnyMethod();
p.AllowCredentials();
});
});
Configure:
app.UseCors("cors");
2.仅修改Configure方法:
app.UseCors(cfg =>
{
cfg.AllowAnyOrigin(); //对应跨域请求的地址
cfg.AllowAnyMethod(); //对应请求方法的Method
cfg.AllowAnyHeader(); //对应请求方法的Headers
cfg.AllowCredentials(); //对应请求的withCredentials 值
});
注意对于非简单请求,前三个Allow方法都是必须的。
跨域请求错误: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource的更多相关文章
- .Net Core 处理跨域问题Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource
网页请求报错: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Or ...
- Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' heade
XMLHttpRequest cannot load http://10.164.153.37:8050/WebService/WebService.asmx/wsGetStreetData. Res ...
- java、ajax 跨域请求解决方案('Access-Control-Allow-Origin' header is present on the requested resource. Origin '请求源' is therefore not allowed access.)
1.情景展示 ajax调取java服务器请求报错 报错信息如下: 'Access-Control-Allow-Origin' header is present on the requested ...
- 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.
前端显示: has been blocked by CORS policy: Response to preflight request doesn't pass access control che ...
- Webapi 跨域 解决解决错误No 'Access-Control-Allow-Origin' header is present on the requested resource 问题
首先是web端(http://localhost:53784) 请求 api(http://localhost:81/api/)时出现错误信息: 查看控制台会发现错误:XMLHttpRequest c ...
- js跨域访问,No 'Access-Control-Allow-Origin' header is present on the requested resource
js跨域访问提示错误:XMLHttpRequest cannot load http://...... No 'Access-Control-Allow-Origin' header is prese ...
- (转)AJax跨域:No 'Access-Control-Allow-Origin' header is present on the requested resource
在本地用ajax跨域访问请求时报错: No 'Access-Control-Allow-Origin' header is present on the requested resource. Ori ...
- ABP PUT、DELETE请求错误405.0 - Method Not Allowed 因为使用了无效方法(HTTP 谓词) 引发客户端错误 No 'Access-Control-Allow-Origin' header is present on the requested resource
先请检查是否是跨域配置问题,请参考博客:http://www.cnblogs.com/donaldtdz/p/7882225.html 一.问题描述 ABP angular前端部署后,查询,新增都没问 ...
- No 'Access-Control-Allow-Origin' header is present on the requested resource——Web Api跨域问题
最近使用C#写了一个简单的web api项目,在使用项目中的.cshtml文档测试的时候没有任何问题,但是在外部HBuilder上面编写.html通过Ajax调用web api路径时报错: No 'A ...
- As.net WebAPI CORS, 开启跨源访问,解决错误No 'Access-Control-Allow-Origin' header is present on the requested resource
默认情况下ajax请求是有同源策略,限制了不同域请求的响应. 例子:http://localhost:23160/HtmlPage.html 请求不同源API http://localhost:228 ...
随机推荐
- vscode 基本知识以及如何配置 C++ 环境
参考: 在用VSCode? 看完这篇文章, 开发效率翻倍!最后一条厉害了~ Visual Studio Code(VS code)你们都在用吗?或许你们需要看一下这篇博文 按下 ctrl+K,再按下 ...
- Echarts配置项详解
1.图表标题 title: { x: 'left', // 水平安放位置,默认为左对齐,可选为: // 'center' ¦ 'left' ¦ 'right' // ¦ {number}(x坐标,单位 ...
- Ubuntu安装rpm
# sudo apt-get install alien # sudo alien xxx.rpm # sudo dpkg -i xxx.deb
- c#模拟鼠标左键单击
[System.Runtime.InteropServices.DllImport("user32.dll")] private static extern int mouse_e ...
- C语言程序经过编译链接后形成二进制映像文件的组成
C语言程序经过编译链接后形成二进制映像文件由栈,堆,数据段,代码段组成,其中数据段又分为:只读数据段,已经初始化读写数据段,未初始化数据段(BSS段).如下图所示: 1.栈区(stack):由编译器自 ...
- MYSQL8.0以上版本ROOT密码报错及修改
在登录数据库过程中,如果遇到忘记root密码时,该如何解决? 1.使用管理员权限打开命令提示符,在命令行中输入: net stop mysql 2.待mysql服务停止后,输入: mysqld -- ...
- PAT Advanced 1022 Digital Library (30 分)
A Digital Library contains millions of books, stored according to their titles, authors, key words o ...
- Python实现神经网络算法识别手写数字集
最近忙里偷闲学习了一点机器学习的知识,看到神经网络算法时我和阿Kun便想到要将它用Python代码实现.我们用了两种不同的方法来编写它.这里只放出我的代码. MNIST数据集基于美国国家标准与技术研究 ...
- replace函数实现
##replace函数,跟split函数处理类似,比split简单 #coding=gbk ss='** *axx* *bv** *ctt** **dff***' print(ss) result=[ ...
- python3 基础二——基本的数据类型三
一.字符串str 1.创建字符串,为变量分配一个值 word='字符串' sentence="字符串\n" #python中单引号和双引号使用完全相同 paragraph=&quo ...