Origin http://example is not allowed by Access-Control-Allow-Origin. Status code: 403

Question

I'm getting an error Access-Control-Allow-Origin in my React js application

I'm working with Reactjs and C# asp.net core as a backend server. We have a Windows Server to host our web application so I have NPM RUN BUILD on my IIS Server wwwroot Folder It's working the website is showing it's components but it's not fetching data

!!!Running React js on IIS folder in the same server also the backend is running at localhost:5000 in the same windows server.

****ALSO THE WINDOWS SERVER IS PROTECTED BY VPN SO WHEN ACCESSING IT IT NEEEDS NAME AND PASSOWRD AND ITS PROTECTED FROM REQUESTS OUTSIDE OF THE SERVER

that's my frontend data fetching code:

const [minis, setMinis] = useState([]);
useEffect(() => {
    get()
  }, [])
const get = () => {
    axios.get(`${import.meta.env.VITE_API}/supports`).then((res) => {
      setMinis(res.data);
    })
  }

-- VITE_API=http://localhost:5000/api

web.config File:

<?xml version="1.0"?>
<configuration>
 <system.webServer>
 <rewrite>
 <rules>
 <rule name="React Routes" stopProcessing="true">
 <match url=".*" />
 <conditions logicalGrouping="MatchAll">
 <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
 <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
 <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
 </conditions>
 <action type="Rewrite" url="/" />
 </rule>
 </rules>
 </rewrite>
 </system.webServer>
</configuration>

My Backend code:

builder.Services.AddCors(options => options.AddDefaultPolicy(
    policy => policy
    .WithOrigins("http://www.x.com")
    .AllowAnyHeader()
    .AllowAnyMethod()
    
));
app.UseCors();

ERROR:::::

[Error] Origin http://www.example.com is not allowed by Access-Control-Allow-Origin. Status code: 403

[Error] XMLHttpRequest cannot load http://localhost:5000/api/users due to access control checks.

[Error] Failed to load resource: Origin http://www.example.com is not allowed by Access-Control-Allow-Origin. Status code: 403 (users, line 0)

[Error] Unhandled Promise Rejection: AxiosError: Network Error

Does this answer your question? [Understanding CORS](https://stackoverflow.com/questions/25845203/understanding-cors) — NineBerry, Apr 15 '23 at 13:01
See also https://stackoverflow.com/questions/31942037/how-to-enable-cors-in-asp-net-core — NineBerry, Apr 15 '23 at 13:03
Your Front End is a HTTP request from client to Server. The 403 error is the credentials on this connection is failing. The issue is not the backend and it is not a CORS issue. Your backend is working. I don't see any code posted for the Front End where the failure is occurring. Most people are moving from Windows Authentication to OAUTH 2.0 authentication. See following : https://learn.microsoft.com/en-us/aspnet/core/security/authentication/identity?view=aspnetcore-7.0&tabs=visual-studio — jdweng, Apr 15 '23 at 14:42
@jdweng No, it is a CORS problem. The error message of the browser says so. — NineBerry, Apr 19 '23 at 10:09
@NineBerry : The error is 403. COOR may be in error message due to using the wrong type of credentials being used. COOR issue usually cannot be fixed by the OP. Credential issues can be fixed by OP if they use the correct type of credentials. — jdweng, Apr 19 '23 at 10:18
403 ist the error result reported by the browser in the case of a CORS problem — NineBerry, Apr 19 '23 at 10:39

Origin http://example is not allowed by Access-Control-Allow-Origin. Status code: 403

0 Answers0