How to fix CORS issue during development with localhost different port

Question

How to fix CORS issue during development with localhost different port

Pragyan Snata 20

Hello,

I have  a Angular Js  application and backend WCF service c# .net  , both are running in localhost IISExpress with different port.

Client UI is accessing WCF API through http POST/GET.

While debugging from Visual Studio using Edge it's throwing Cors issue--- Access to XMLHttpRequest at  http://localhost:60000/  from origin  http://localhost:30000/ has been blocked by CORS policy: Response to preflight request doesn't pass access control check.

I have tried to install  

I have added

             <add name="Access-Control-Allow-Origin" value="*"/>

              <add name="Access-Control-Allow-Methods" value="*"/>

              <add name="Access-Control-Allow-Headers" value="*"/>

              <add name="Access-Control-Allow-Credentials" value="true"/>

              <add name=" Access-Control-Allow-Private-Network" value="true"/>

in web .config still not working. 

I really need some solution to disable CORS during development.

System Info - Windows 10 Enterprise 64 bit OS

QiYou-MSFT 4,326 Reputation points Microsoft External Staff

2023-02-07T06:24:40.36+00:00

Hi @Pragyan Snata

The error stems from a security mechanism that browsers implement called the same-origin policy.

The same-origin policy fights one of the most common cyber attacks out there: cross-site request forgery.

In this maneuver, a malicious website attempts to take advantage of the browser’s cookie storage system.

I look at the code you provided, you are using the Access-Control-Allow-Origin header. You can test whether Naimish Makwana's answer works.

Access-Control-Allow-Origin: http://localhost:60000 Only http://localhost:60000 have access

Access-Control-Allow-Origin: * The server can be really strict, and specify that only one origin can access it

At the same time, I think it is also possible to use proxies between the server and the client.

Best Regards

Qi You

1 answer

Your answer

QiYou-MSFT 4,326 Reputation points Microsoft External Staff

2023-02-07T06:24:40.36+00:00

Hi @Pragyan Snata

The error stems from a security mechanism that browsers implement called the same-origin policy.

The same-origin policy fights one of the most common cyber attacks out there: cross-site request forgery.

In this maneuver, a malicious website attempts to take advantage of the browser’s cookie storage system.

I look at the code you provided, you are using the Access-Control-Allow-Origin header. You can test whether Naimish Makwana's answer works.

Access-Control-Allow-Origin: http://localhost:60000 Only http://localhost:60000 have access

Access-Control-Allow-Origin: * The server can be really strict, and specify that only one origin can access it

At the same time, I think it is also possible to use proxies between the server and the client.

Best Regards

Qi You

Answer 1

Hello Pragyan,

Add this method to the Global.asax.cs:

protected void Application_BeginRequest(object sender, EventArgs e)
        {
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
            if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
            {
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST");
                HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept");
                HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
                HttpContext.Current.Response.End();
            }
        }

Also for more details refer below link.

https://www.codeproject.com/Articles/845474/Enabling-CORS-in-WCF

https://stackoverflow.com/a/26040237/3054222

Thanks

Naimish Makwana

Share via

How to fix CORS issue during development with localhost different port

1 answer

Your answer