Angular 11 请求的资源上没有“Access-Control-Allow-Origin”标头?

Posted

技术标签:

【中文标题】Angular 11 请求的资源上没有“Access-Control-Allow-Origin”标头?【英文标题】:Angular 11 No 'Access-Control-Allow-Origin' header is present on the requested resource? 【发布时间】:2021-09-28 18:37:33 【问题描述】:

我有dotnet core 5 应用程序和Angular applocal host 所有Http methods 运行良好,但在网络主机HttpGet, HttpPost Methods 正常运行和HttpPut, DELETE 抛出异常:

CORS 策略已阻止从源“---”访问“---”处的 XMLHttpRequest:请求的资源上不存在“Access-Control-Allow-Origin”标头。

该配置Cors 如下所示:

public static IServiceCollection AddAdminApiCors(this IServiceCollection services)
    
        services.AddCors(options =>
        
            options.AddPolicy("CorsPolicy",
                builder =>
                
                    builder.AllowAnyOrigin();
                    builder.AllowAnyHeader();
                    builder.AllowAnyMethod();
                );
        );

        return services;
    

Startup.cs

public void ConfigureServices(IServiceCollection services)
    
        services.AddAdminApiCors();

        services.AddMvc();


public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    
app.UseRouting();

        app.UseCors("CorsPolicy");

        app.UseAuthentication();


        app.UseAuthorization();

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

[Authorize]
[EnableCors("CorsPolicy")]
public class CompanyController : ControllerBase

    [HttpGet]
    public async Task<ActionResult<IEnumerable<CompanyViewModel>>> Get([FromQuery] CompanyQuery companyQuery)
    
        return Ok(await _mediator.Send(companyQuery));
    

    [HttpPost]
    public async Task<ActionResult<int>> Create([FromBody] CreateCompanyCommand command)
    
        var productId = await _mediator.Send(command);

        return Ok(productId);
    

    [HttpPut]
    [ProducesResponseType(StatusCodes.Status204NoContent)]
    [ProducesDefaultResponseType]
    public async Task<IActionResult> Update([FromBody] UpdateCompanyCommand command)
    
        await _mediator.Send(command);

        return NoContent();
    

    [HttpDelete("id")]
    [ProducesResponseType(StatusCodes.Status204NoContent)]
    [ProducesDefaultResponseType]
    public async Task<IActionResult> Delete(int id)
    
        await _mediator.Send(new DeleteCompanyCommand  Id = id );

        return NoContent();
    

在许多帖子中告诉我更改 web.config 文件并删除 WebDAV IIS Module 我关注他们但我的问题没有解决 cors put error

【问题讨论】:

您能否尝试在每个操作上添加 [EnableCors] 而不是在控制器上添加它。 由于“Get”和“Post”方法工作正常,所以请检查ProducesResponseTypeProducesDefaultResponseType注解是否会影响这两种方法(“put”和“delete”方法) . 【参考方案1】:

5天后我找到了我的问题原因,它需要删除Web.config文件中的Web

<system.webServer>
  <modules> 
      <remove name="WebDAVModule"/> 
  </modules>  
</system.webServer>

以及托管服务提供商公司支持者在托管服务器中应用的一些更改

【讨论】:

【参考方案2】:

您的代码中可能发生异常,服务器会向您发送此误导性响应,您可以通过转到托管应用程序并转到 web.config 文件并通过将其设置为 true 来启用日志并启动另一个来检测异常请求并转到已生成的日志文件并调试问题。

【讨论】:

嗨,不,我用空的post actioncontroller跟踪它并发生错误,这个错误可能与iis config有关 嗨,我的意思是它一定是在其中一种操作方法(放置或删除)中发生了错误,您可以检查它们【参考方案3】:

这适用于我的项目:

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

【讨论】:

@MohsenSaleh 你读过this 吗? 是的,我测试它可能与iis config有关

以上是关于Angular 11 请求的资源上没有“Access-Control-Allow-Origin”标头?的主要内容,如果未能解决你的问题,请参考以下文章

请求的资源 laravel 5.8.8 上没有“Access-Control-Allow-Origin”标头

Angular 2请求的资源上不存在“Access-Control-Allow-Origin”标头[重复]

请求的资源上不存在“Access-Control-Allow-Origin”标头(角度)

没有“访问控制允许来源”Angular 4 应用程序

仅在 Angular 资源请求中缺少 CORS 标头

Angular 4 - 请求的资源上不存在“Access-Control-Allow-Origin”标头