.NET WebAPI 跨域问题(has been blocked by CORS policy:No Access-Control-Allow-Ogigin header is present on the requested resource)

一、什么是跨域

1. 跨域解释

跨域指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器施加的安全限制。
同源指的是:域名,协议,端口均相同。

2. 什么情况下会导致跨域

2.1 不同域名(无论主域名还是子域名)

www.dennis.com 访问 www.dong.com

2.2 不同端口号

www.dennis.com 访问 www.dennis.com:8080

2.3 不同协议

http://www.dennis.com 访问 https://www.dennis.com

2.4 本地指向

localhost 访问 127.0.0.1

二、如何解决跨域

1. .NET 版本

1.1 NuGet包安装Microsoft.AspNet.Cors

搜索Microsoft.AspNet.Cors,下载并安装

1.2 配置 WebApiConfig

打开APP_Start文件夹下的 WebApiConfig,最后面加上 config.EnableCors(); 即可
当然这个有重载,支持固定的域名访问和固定的请求方式,可以自行测试

第一个参数是过滤域名的,多个用英文逗号隔开
第二个参数是过滤header的,没测试过,有兴趣自行测试
第三个参数是过滤请求方式的,多个用英文逗号隔开
如:config.EnableCors(new EnableCorsAttribute("*", "*", "*")); 允许所有域名,所有请求方式的方法
如:config.EnableCors(new EnableCorsAttribute("https://www.dennis.com", "*", "get,post")); 允许www.dennis.com域名,所有get和post请求方式的方法

2. .NET Core 版本

2.1 配置Startup

Startup中声明全局私有常量

    /// <summary>
    /// 跨域配置名称
    /// </summary>
    private const string DefaultCorsPolicyName = "AllowCross";

ConfigureServices方法中添加

    services.AddCors(options =>
    {
        options.AddPolicy(DefaultCorsPolicyName, builder =>
        {
            builder.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader();
        });
    });

Configure方法中的app.UseRouting();//路由后面添加
app.UseCors(DefaultCorsPolicyName);//跨域

posted @ 2021-12-22 15:58  DennisDong  阅读(663)  评论(2编辑  收藏  举报