问题：

如何配置角6与。NET Core 2允许来自任何主机的CORS？

狄富

2023-03-14

我有一个简单的Angular应用程序在4200本地运行，我正在测试一个网络应用程序接口在5000本地运行，使用. net核心。我的startup.csCORS配置正确，允许我相信的一切。

在配置服务部分，我有：服务。addCors（）；

在配置部分，我有：

app。UseCors（选项）=

然而，当我尝试点击我的webapi时，我仍然可以在浏览器中看到它。

从源头http://localhost:4200已被CORS策略阻止：对起飞前请求的响应不通过权限改造检查：起飞前请求不允许重定向。

我看过其他答案，它们似乎都有这种或类似的变化，我没有改变。不知道我还需要做什么？

共有3个答案

武卓

2023-03-14

在服务中注册COR

services.AddCors(options =>
            {
                options.AddPolicy("CorsPolicy",
                    builder => builder
                    .SetIsOriginAllowed((host) => true)
                    .AllowAnyMethod()
                    .AllowAnyHeader()
                    .AllowCredentials());
            });

添加cors中间件

app.UseCors("CorsPolicy");

周高畅

2023-03-14

在方法ConfigureServices中添加以下代码段。编辑此项仅允许自定义标题。

// Add service and create Policy with options
        services.AddCors(options =>
        {
            options.AddPolicy("CorsPolicy",
                builder => builder.AllowAnyOrigin()
                .AllowAnyMethod()
                .AllowAnyHeader()
                .AllowCredentials()
                );
        });

在Configure方法中添加以下内容

app.UseCors("CorsPolicy");

将“EnableCors”属性添加到控制器。

[EnableCors("CorsPolicy")]

景凌

2023-03-14

在启动中。反恐精英。Configure（）。使用cors（）preforeapp。是否使用MVC（）
Http请求URL是否包含尾部斜杠（/）
Http请求是否包含凭据
浏览器是否从API接收Http响应
响应是否包含“访问控制允许来源”标题
当您从邮递员发送请求时，Http响应是否包括“Access Control Allow Origin”标头以及包含数据的正文

Firefox要求为您的API安装证书，以便使用HTTPS协议发送Http请求。

使用Postman和浏览器开发工具测试API。注意2个Http请求。Http 200是一个“飞行前”程序，用于查看哪些CORS选项可用。

如果您的API（.NET）抛出一个HTTP 500（内部服务器错误），它将返回一个开发人员异常页面，邮递员将显示一条“请求的资源上不存在“访问控制允许源代码”标题”消息-这是错误引导
这种情况下的实际问题是，无法将开发人员异常页面从服务器返回到运行在不同来源上的客户端（浏览器）

CORS规范规定，如果存在访问控制允许凭据标头，则将源设置为“*”（所有源）无效

ASP. NET Core 2.2不允许允许凭据与AllowAnyOrigin（）

在ASP中启用跨源请求（COR）。网芯

CORS中间件必须位于应用配置中任何定义的endpoint之前。
指定的URL必须没有尾随斜杠（/）。
如果浏览器发送凭据，但响应不包括有效的访问控制允许凭据头，浏览器不会向应用公开响应，跨源请求失败。
CORS规范还规定，如果存在访问控制允许凭据头，则将起源设置为*（所有起源）无效。
如果浏览器支持CORS，它会自动为跨源请求设置这些标头。
如果响应不包括访问控制允许起源头，跨起源请求失败。

创建Visual Studio解决方案

md c:\s\a
cd c:\s\a
c:\s\a>dotnet new sln -n solutionName

创建ASP. NET Core项目

c:\s\a>md s
c:\s\a>cd s
c:\s\a\s>dotnet new webapi -o api -n api

API启动设置和CORS配置

启动设置。json

克隆开发概要到分期概要

{
"$schema": "http://json.schemastore.org/launchsettings.json",
"iisSettings": {
"windowsAuthentication": false,
"anonymousAuthentication": true,
"iis": {
    "applicationUrl": "http://localhost:myIISApiPortNumber",
    "sslPort": myIISApiSSLPortNumber
},
"iisExpress": {
    "applicationUrl": "http://localhost:myIISExpressApiPortNumber",
    "sslPort": myIISExpressApiSSLPortNumber
}
},
"profiles": {
"Development (IIS Express)": {
    "commandName": "IISExpress",
    "launchBrowser": true,
    "launchUrl": "api/values",
    "environmentVariables": {
    "ASPNETCORE_ENVIRONMENT": "Development"
    }
},
"Staging (IIS Express)": {
    "commandName": "IISExpress",
    "launchBrowser": true,
    "launchUrl": "api/values",
    "applicationUrl": "https://localhost:myIISExpressApiSSLPortNumber;http://localhost:myIISExpressApiPortNumber",
    "environmentVariables": {
    "ASPNETCORE_ENVIRONMENT": "Staging"
    }
},
"Production (IIS)": {
    "commandName": "IIS",
    "launchBrowser": true,
    "launchUrl": "api/values",
    "environmentVariables": {
    "ASPNETCORE_ENVIRONMENT": "Production"
    },
    "applicationUrl": "https:localhost:myIISApiSSLPortNumber;http://localhost:myIISApiPortNumber"
}
}
}

startup.cs

添加CORS配置

public class Startup
{
    public IConfiguration Configuration { get; }

    public IServiceCollection _services { get; private set; }

    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public void ConfigureServices(IServiceCollection services)
    {
        _services = services;
        RegisterCorsPolicies();
        services.AddMvc()
                .SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
    }

    public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseCors("DevelopmentCorsPolicy");
            app.UseDeveloperExceptionPage();
        }
        else if (env.IsStaging())
        {
            app.UseCors("StagingCorsPolicy");
        }
        else
        {
            app.UseCors("ProductionCorsPolicy");
            app.UseHsts();
        }

        app.UseHttpsRedirection();
        app.UseMvc(); // CORS middleware must precede any defined endpoints
    }

    private void RegisterCorsPolicies()
    {
        string[] localHostOrigins = new string[] {
        "http://localhost:4200", "http://localhost:3200"};

        string[] stagingHostOrigins= new string[] {
        "http://localhost:4200"};

        string[] productionHostOrigins = new string[] {
        "http://yourdomain.net", "http://www.yourdomain.net",
        "https://yourdomain.net", "https://www.yourdomain.net"};

        _services.AddCors(options =>    // CORS middleware must precede any defined endpoints
        {
            options.AddPolicy("DevelopmentCorsPolicy", builder =>
            {
                builder.WithOrigins(localHostOrigins)
                        .AllowAnyHeader().AllowAnyMethod();
            });
            options.AddPolicy("StagingCorsPolicy", builder =>
            {
                builder.WithOrigins(stagingHostOrigins)
                        .AllowAnyHeader().AllowAnyMethod();
            });
            options.AddPolicy("ProductionCorsPolicy", builder =>
            {
                builder.WithOrigins(productionHostOrigins)
                        .AllowAnyHeader().AllowAnyMethod();
            });
        //options.AddPolicy("AllowAllOrigins",
        //    builder =>
        //    {
        // WARNING: ASP.NET Core 2.2 does not permit allowing credentials with AllowAnyOrigin() 
        // cref: https://docs.microsoft.com/en-us/aspnet/core/migration/21-to-22?view=aspnetcore-2.2&tabs=visual-studio
            //        builder.AllowAnyOrigin()
            //               .AllowAnyHeader().AllowAnyMethod();
            //    });
            //options.AddPolicy("AllowSpecificMethods",
            //    builder =>
            //    {
            //        builder.WithOrigins(productionHostOrigins)
            //               .WithMethods("GET", "POST", "HEAD");
            //    });
            //options.AddPolicy("AllowSpecificHeaders",
            //    builder =>
            //    {
            //        builder.WithOrigins(productionHostOrigins)
            //               .WithHeaders("accept", "content-type", "origin", "x-custom-header");
            //    });
            //options.AddPolicy("ExposeResponseHeaders",
            //    builder =>
            //    {
            //        builder.WithOrigins(productionHostOrigins)
            //               .WithExposedHeaders("x-custom-header");
            //    });
            //options.AddPolicy("AllowCredentials",
            // WARNING: ASP.NET Core 2.2 does not permit allowing credentials with AllowAnyOrigin() cref: https://docs.microsoft.com/en-us/aspnet/core/migration/21-to-22?view=aspnetcore-2.2&tabs=visual-studio
            //    builder =>
            //    {
            //        builder.WithOrigins(productionHostOrigins)
            //               .AllowCredentials();
            //    });
            //options.AddPolicy("SetPreflightExpiration",
            //    builder =>
            //    {
            //        builder.WithOrigins(productionHostOrigins)
            //               .SetPreflightMaxAge(TimeSpan.FromSeconds(2520));
            //    });
        });
    }
}

在值控制器上设置断点。Get（）

与邮递员一起测试API：

https://localhost:myApiPortNumber/api/values

访问-控制-允许-起源头和值应该在响应

创建角度应用程序

c:\s\a\s>ng new Spa1 --routing (will automatically create Spa folder)

启动Spa1应用程序

c:\s\a\s>cd Spa1
c:\s\a\s\Spa1>Ng serve

浏览到http://localhost:4200/

Spa1应该成功启动

在Spa1中实现CORs

应用程序。单元ts

导入HttpClientModule

import { HttpClientModule } from '@angular/common/http';

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    HttpClientModule,
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

应用程序。组成部分ts

导入HttpClient

使用CORS请求添加getValue（）方法

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})

export class AppComponent implements OnInit {
  title = 'Spa1';
  values: any;
  apiUrl: string = environment.apiUrl;
  valuesUrl = this.apiUrl + "values";

  constructor(private http: HttpClient) { }

  ngOnInit() {
    this.getValues();
  }
  getValues() {
    this.http.get(this.valuesUrl).subscribe(response => {
      this.values = response;
  }, error => {
  console.log(error);
});
}
}

app.component.html

<div style="text-align:center">
  <h1>
    Welcome to {{ title }}!
  </h1>
</div>
<h2>Values</h2>
<p *ngFor="let value of values">
  {{value}}
</p>
<router-outlet></router-outlet>

environment.ts

export const environment = {
  production: false,
  apiUrl: 'https://localhost:myApiPortNumber/api/'
};

启动Spa1应用程序

c:\s\a\s\Spa1>Ng serve

浏览到http://localhost:4200/

Chrome

修正Firefox块的一种方法：

FireFox|选项|隐私

证书管理器|[添加异常]：

   add localhost

克隆Spa1

c:\s\a\s>xcopy /s /i Spa1 Spa2

Spa2的重构标题

应用程序。组成部分ts

export class AppComponent implements OnInit {
  title = 'Spa2';
}

在端口3200上启动Spa2应用程序

c:\s\a\s\Spa2>ng serve --port 3200

浏览到http://localhost:3200/

值数组应呈现在网页上

停止使用开发（IIS Express）配置文件调试API

使用暂存（IIS Express）配置文件开始调试API

浏览到http://localhost:4200/

值数组应呈现在网页上

浏览到http://localhost:3200/

值数组不应在网页上呈现

使用开发工具检查Http响应：

Access Control Allow Origin标头和值不应响应

如何配置角6与。NET Core 2允许来自任何主机的CORS？

共有3个答案

相关问答

相关文章

相关阅读

相关工具

相关文档