CORS Error in Fetch

December 21, 2018 0 By Toby Worth

Angular client making requests for .well-known IS4 config resource was failing with CORS error (resource did not have allow-origin header).

As the error suggested, I hadn’t set up the right port on the CORS middleware in the IS4 host.

        services.AddCors(options =>
        {
            // this defines a CORS policy called "default"
            options.AddPolicy("defaultPolicy", policy =>
            {
                policy.WithOrigins(new[] { "http://localhost:5003", "https://localhost:44311" })
                    .AllowAnyHeader()
                    .AllowAnyMethod();
            });
        });

And then implement that policy in the Startup.Configure method:

        app.UseCors("defaultPolicy");

It’s so easy to miss this when I’m changing projects around all the time.

I did find that my Chrome extensions were littering my console, too, which gave me false-negatives for CORS errors. So, to be sure, it’s worth opening an ‘incognito’ window for testing.