Cors政策角度

Question

我在从Angular发送auth头jwt令牌时得到了下面的问题。CORS策略阻止从来源“http://localhost:4200”访问位于“http：//localhost:52278/api/user/signup”的XMLHttpRequest：请求的资源上没有“Access-Control-Allow-Origin”标头。

            var origins = Configuration["CorsUrl"].Split(",");
            services.AddCors(options =>
            {
                options.AddPolicy("BasePolicy",
                builder =>
                {
                    builder
                    .AllowAnyMethod()
                    .WithOrigins(origins)
                    .AllowAnyHeader()
                    .AllowCredentials()
                    .AllowAnyMethod();
                });

            });

        app.UseAuthorization();
        app.UseCors("BasePolicy");
        app.UseHttpsRedirection();

棱角分明的：

    signUpAdmin(data: AdminSignUpModel) {
        return this.httpClient.post('user/signup', data,this.getCommonOptions());
    }

private _token: string = localStorage.getItem('auth_token');

   protected getCommonOptions() {
        const httpOptions = {
            headers: new HttpHeaders({
                'Content-Type': 'application/json',
                'Access-Control-Allow-Origin': '*',
                'Access-Control-Allow-Methods': '*',
                Authorization: `Bearer ${this._token}`,
                
            })
        };
        return httpOptions;
    }

Answer 1

CORS策略阻止从来源“http://localhost:4200”访问位于“http：//localhost:52278/api/user/signup”的XMLHttpRequest：请求的资源上没有“Access-Control-Allow-Origin”标头。

若要解决此问题，请尝试在代码中指定允许的源，而不是从配置设置中获取数据，如下所示。

services.AddCors(options =>
{
    options.AddPolicy("BasePolicy",
    builder =>
    {
        builder
        .AllowAnyMethod()
        .WithOrigins("http://localhost:4200", "https://localhost:44336") 
        .AllowAnyHeader()
        .AllowCredentials()
        .AllowAnyMethod();
    });

});

请注意，指定的URL不能包含尾随斜杠(/)，例如http://localhost:4200/。

app.UseRouting();
//...

app.UseCors("BasePolicy");

app.UseAuthorization();

有关在ASP.NET核心中启用CORS的更多信息，请查看以下文档：

https://docs.microsoft.com/en-us/aspnet/core/security/cors？view=aspnetcore-5.0#cors-with-named-policy-and-middleware