Локальный Javascript Fetch Post Request завершается неудачно с обращением к ASP.NET Core 2.2 Web API.CORS развернут

Question

Я пытаюсь сделать локальный пост-запрос из статического HTML-файла в веб-API ASP.NET Core 2.2. Программное обеспечение CORS работает нормально, я могу выполнить простой запрос на получение. В конечном итоге мне нужно сделать этот пост-запрос из расширения Chrome. Я использую ASP.NET с самого начала, это моя первая попытка решения Core, я ошеломлен всеми препятствиями, особенно с этим. Что-то не так с моим синтаксисом Fetch?

Вот моя конфигурация CORS, основанная на этом: https://enable -cors.org / server_aspnet.html

public class Startup
{
    public void ConfigureServices(IServiceCollection services)
    {
        services.AddCors();

        services.AddMvc()
            .SetCompatibilityVersion(CompatibilityVersion.Version_2_2));
    }

    public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    {
        app.UseCors(builder => builder.WithOrigins("*"));

        app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");
        });
    }
}

fetch call in local static html file:
fetch ('http://localhost:49828/Bookmark', {
    method: 'post',
    headers:{'Content-Type': 'application/json'},
    body: JSON.stringify({ ID: 0, Name: 'google', URL: 'google.com', Tags: '' })
})

here's the raw request from Fiddler:
OPTIONS http://localhost:49828/Bookmark HTTP/1.1
Host: localhost:49828
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: POST
Origin: null
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36
Access-Control-Request-Headers: content-type
Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9

console log from chrome:
Access to fetch at 'http://localhost:49828/Bookmark' from origin 'null' has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

console log from firefox:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:49828/Bookmark. (Reason: missing token ‘content-type’ in CORS header ‘Access-Control-Allow-Headers’ from CORS preflight channel).

Answer 1

Это было давно, но я не уверен, что .WithOrigins ("*") - это правильный способ подстановки всех символов.Вы пытались использовать вместо этого .AllowAnyOrigin ()?Еще лучше (с точки зрения безопасности) использовать WithOrigins с фактическим хостом, где размещен HTML-файл).Если это локально, то это будет адрес локального хоста, с которого вы обслуживаете страницу HTML (который, как я полагаю, отличается от вашего API).

Так что-то вроде (где 1234 - фактический локальный порт, с которого вы размещаете HTML-код).

app.UseCors(builder => builder.WithOrigins("https://localhost:1234"));

Если AllowAnyOrigin () работает для тестирования, хорошо.Но не используйте это в производстве.Microsoft считает это небезопасной конфигурацией (см. https://docs.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-2.2#set-the-allowed-origins). Всегда использовать именованные источники в prod.