No 'Access-Control-Allow-Origin' header is present on the requested resource

This tutorial shows you how to solve "No 'Access-Control-Allow-Origin' header is present on the requested resource" in angular 7 using Web API in c# code.

Access to XMLHttpRequest at 'http://localhost:20212/api/Employee' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

To solve the api gateway no access control allow origin header is present on the requested resource, you need to install the Microsoft.AspNet.Cors package from the Nuget Manage Packages.

Next, Open the WebApiConfig class, then modify your code as the following.

public static void Register(HttpConfiguration config)
{
    var cors = new EnableCorsAttribute("*", "*", "*");//origins,headers,methods   
    config.EnableCors(cors);

    // Web API routes
    config.MapHttpAttributeRoutes();

    config.Routes.MapHttpRoute(
        name: "DefaultApi",
        routeTemplate: "api/{controller}/{id}",
        defaults: new { id = RouteParameter.Optional }
    );
}

I hope so you can solve the problem "No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access" when accessing web api from angular 7.