对于.NET CORE 3.1

Question

我想使用http://5.160.2.148:8091/api/trainTicketing/city/findAll休息区在我的有角项目中获取城市。
我在项目中使用的是angular的7.2.15版本。
当使用httpClient获得此网址时，抛出以下错误：

 Access to XMLHttpRequest at 'http://5.160.2.148:8091/api/trainTicketing/city/findAll' from origin 'http://localhost:4200' 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.

在浏览器和邮递员中输入url时可以正常工作。

为什么？

Answer 1

如果使用spring boot，则应在@CrossOrigin批注中添加原始链接

@CrossOrigin(origins = "http://localhost:4200")
@GetMapping("/yourPath")

您可以在https://spring.io/guides/gs/rest-service-cors/

中找到详细说明

Answer 2

对于.NET CORE 3.1

我在添加 cors中间件之前就使用了 https重定向，并能够通过更改它们的顺序来解决该问题

我的意思是：

更改此项：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {

      ...
        
        app.UseHttpsRedirection();  

        app.UseCors(x => x
            .AllowAnyOrigin()
            .AllowAnyMethod()
            .AllowAnyHeader());

      ...

     }

为此：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {

      ...
        
        app.UseCors(x => x
            .AllowAnyOrigin()
            .AllowAnyMethod()
            .AllowAnyHeader());

        app.UseHttpsRedirection(); 

      ...

     }

顺便说一句，允许来自任何来源和方法的请求在生产阶段可能不是一个好主意，您应该在生产时编写自己的cors政策。

Answer 3

WebAPI中的Startup.cs。

app.UseCors(options => options.AllowAnyOrigin());

在ConfigureServices方法中：

services.AddCors(c =>  
{  
    c.AddPolicy("AllowOrigin", options => options.AllowAnyOrigin());  
});

在控制器中：

[HttpGet]  
     [Route("GetAllAuthor")]  
     [EnableCors("AllowOrigin")]

Answer 4

你们都擅长Angular，甚至邮递员也没有提出cors政策问题。在大多数情况下，此类问题可以在后端解决。

如果您使用的是Spring Boot，则可以通过将注释放在控制器类或任何特定方法上来避免此问题。

@CrossOrigin(origins = "http://localhost:4200")

在使用Spring Boot进行全局配置的情况下，请配置以下两类：

`

@EnableWebSecurity
@AllArgsConstructor

public class SecurityConfig extends WebSecurityConfigurerAdapter {
@Override
    public void configure(HttpSecurity httpSecurity) throws Exception{
        httpSecurity.csrf().disable()
        .authorizeRequests()
        .antMatchers("/api1/**").permitAll()
        .antMatchers("/api2/**").permitAll()
        .antMatchers("/api3/**").permitAll()
        
}
`

@Configuration
@EnableWebMvc
public class WebConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry corsRegistry) {
        corsRegistry.addMapping("/**")
                .allowedOrigins("http://localhost:4200")
                .allowedMethods("*")
                .maxAge(3600L)
                .allowedHeaders("*")
                .exposedHeaders("Authorization")
                .allowCredentials(true);
    }

Answer 5

如果您的项目是.net Core 3.1 API项目。

将.net核心项目中的Startup.cs更新为：

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

    public IConfiguration Configuration { get; }
    readonly string MyAllowSpecificOrigins = "_myAllowSpecificOrigins";
    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {
        services.AddCors(options =>
        {
            options.AddPolicy(MyAllowSpecificOrigins,
            builder =>
            {
                builder.WithOrigins("http://localhost:53135",
                                    "http://localhost:4200"
                                    )
                                    .AllowAnyHeader()
                                    .AllowAnyMethod();
            });
        });
        services.AddDbContext<CIVDataContext>(options =>
        options.UseSqlServer(Configuration.GetConnectionString("CIVDatabaseConnection")));
        services.AddControllers();
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        app.UseCors(MyAllowSpecificOrigins);

        app.UseRouting();

        app.UseAuthorization();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllers();
        });

       
    }
}

Answer 6

1：创建一个类WebMvcConfig并按照 WebMvcConfiguration 所示进行扩展，并覆盖 addCorsMappings 方法。

2：最重要的是，不要忘记使其成为 @Configuration 批注，因为它应该与Main Spring类一起加载以允许跨域使用。

  @Configuration
    public class WebMvcCofig implements WebMvcConfigurer{
        @Override
        public void addCorsMappings(CorsRegistry registry) {
            registry.addMapping("/*")
                    .allowedOrigins("*")
                    .allowedMethods("*")
                    .allowedHeaders("*")
                    .allowCredentials(true);
        }
    }

Answer 7

如果您使用 spring-boot 进行服务器端编码，请添加 servlet过滤器，并为spring-boot应用程序添加以下代码。它应该工作。必须添加"Access-Control-Allow-Headers", "*"。不需要创建 proxy.conf.json 。

    @Component
@Order(1)
public class MyProjectFilter implements Filter {

    @Override
    public void doFilter(ServletRequest req, ServletResponse res,
            FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Expose-Headers", "Content-Disposition");
        response.setHeader("Access-Control-Allow-Methods", "GET,POST,PATCH,DELETE,PUT,OPTIONS");
        response.setHeader("Access-Control-Allow-Headers", "*");
        response.setHeader("Access-Control-Max-Age", "86400");
        chain.doFilter(req, res);
    }
}

Answer 8

解决方案1-您需要更改后端以接受传入的请求

解决方案2-使用Angular代理see here

注意：通过邮递员进行工作的原因是邮递员在浏览器发出请求时不会发送预检请求。

Answer 9

在使用 Angular和Spring Boot 的情况下，我在SecurityConfig中解决了该问题：

http.csrf().disable().cors().disable()
            .authorizeRequests()
            .antMatchers(HttpMethod.POST, "/register")
            .anonymous()
            .anyRequest().authenticated()
            .and()
            .sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS);

或将该行替换为：

http.csrf().disable().cors().and()

其他测试选项是从pom.xml中删除依赖项，其他代码也依赖于此。就像从Spring关闭安全性一样：

<dependency>
     <groupId>org.springframework.boot</groupId>
     <artifactId>spring-boot-starter-security</artifactId>
     <version>2.3.3.RELEASE</version>
</dependency>

Answer 10

我尝试在 Express 服务器上的 API 上添加以下语句，并且它与 Angular8 一起使用。

app.use((req, res, next) => {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "GET , PUT , POST , DELETE");
    res.header("Access-Control-Allow-Headers", "Content-Type, x-requested-with");
    next(); // Important
})

Answer 11

对于开发过程中的临时测试，我们可以通过打开具有禁用的网络安全性的chrome来禁用它。

打开命令行终端，然后转到安装chrome的文件夹，即C：\ Program Files（x86）\ Google \ Chrome \ Application

输入以下命令：

chrome.exe --user-data-dir =“ C：/ Chrome开发者会话” --disable-web-security

将打开一个新的浏览器窗口，其中包含禁用的Web安全性。仅将其用于测试您的应用。

Answer 12

如果您使用的是 Spring Boot 应用程序，那么只需添加 @CrossOrigin 在您的控制器中并导入语句导入 org.springframework.web.bind.annotation.CrossOrigin;那设置和再次运行应用程序

Answer 13

就我而言，我看到了错误：

Access to XMLHttpRequest at 'localhost:5000/graphql' from origin 'http://localhost:4200' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, brave, chrome-untrusted, https.

确保在您的网址中包含协议（http 或 https）。

const uri = 'http://localhost:5000/graphql'; //

Answer 14

我尝试了上面给出的所有解决方案并在使用 nodejs 后端时工作但不幸的是在使用 python 时它无法工作，所以我最终安装了一个插件 Allow CORS，至少这个插件有帮助

Answer 15

如果您将 Angular 与 Dotnet Core 结合使用：

在类 Startup.cs

在方法 ConfigureServices 上添加：

services.AddCors();

On 方法配置添加

app.UseCors(options => options.AllowAnyHeader().AllowAnyMethod().WithOrigins("http://localhost:4200"));

Answer 16

spring boot中处理CORs问题的方法有很多，最简单的方法就是把@CrossOrigin注解放在Controller上面，可能在你的..resource java文件中。试试

@CrossOrigin(origins= {"*"}, maxAge = 4800, allowCredentials = "false" @RestController

有关更多信息，请阅读 spring boot CORs 文档。谢谢。

Answer 17

创建一个类并在 spring boot 应用程序中添加以下配置。

    package com.myapp.springboot.configs;
    import org.springframework.context.annotation.Configuration;
    import org.springframework.web.servlet.config.annotation.CorsRegistry;
    import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
    
    @Configuration
    public class WebMvcConfiguration implements WebMvcConfigurer {
        @Override
        public void addCorsMappings(CorsRegistry registry) {
            registry.addMapping("/*").
            allowedOrigins("*").
            allowedMethods("*").
            allowedHeaders("*").
            allowCredentials(true);
        }
    }

Answer 18

如果你使用Spring boot 2，你可以在控制器类中添加CrossOrigin注解

@CrossOrigin(origins = "http://localhost:4200", maxAge = 3600)

它对我有用！

Answer 19

对于nodejs，请使用以下代码

res.setHeader('Access-Control-Allow-Origin', 'http://localhost:4200');

Answer 20

遵循这些步骤

添加cors依赖项。在项目目录中的cli中键入以下内容

npm install --save cors

将模块包含在项目中

var cors = require('cors');

最后将其用作中间件。

app.use(cors());

Answer 21

该解决方案需要将这些标头添加到服务器响应中。

'Access-Control-Allow-Origin', '*'
'Access-Control-Allow-Methods', 'GET,POST,OPTIONS,DELETE,PUT'

如果您有权访问服务器，则可以添加它们，这将解决您的问题

OR

您可以尝试在网址前面添加此链接：

https://cors-anywhere.herokuapp.com/

Angular7中的CORS策略已阻止源'http：// localhost：4200'

21 个答案:

对于.NET CORE 3.1