Blocked by CORS policy : No 'Access-Control-Allow-Origin' header is present on the requested resource

Question

Hi I am using django rest framework as API service and React as frontend.I can call the api from react when developing and when i deploy to iis.I got this error

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

I already do like this say=>CORS Error

but I still got this error.

My Django runs on localhost:81

My react app run on : 192.168.1.32:81

I can run this on local server which both installed but when I try on another computer I got this error.

I used the fiddler 4 for override the port in the hostname.

Does this answer your question? [No 'Access-Control-Allow-Origin' header is present on the requested resource—when trying to get data from a REST API](https://stackoverflow.com/questions/43871637/no-access-control-allow-origin-header-is-present-on-the-requested-resource-whe) — pkamb, Nov 20 '20 at 07:58

score 4 · Answer 1 · answered Sep 24 '19 at 08:36

You could use iis response header:

1)open iis manager and select the site.

2)Double-click HTTP Response Headers from the middle pane.

3)In the actions pane, click Add.

4)In the Name box, type the custom HTTP header name. In the Value box, type the custom HTTP header value.

below is header and value:

Access-Control-Allow-Origin:*

Access-Control-Allow-Headers: Content-Type

Access-Control-Allow-Methods:GET,POST,PUT,DELETE,OPTIONS

Access-Control-Allow-Credentials: true

5)Click OK.

or you can directly add below code in the web.config file:

<system.webServer>
      <httpProtocol>
        <customHeaders>
          <add name="Access-Control-Allow-Origin" value="*" />
          <add name="Access-Control-Allow-Headers" value="Content-Type" />
          <add name="Access-Control-Allow-Methods" value="GET,POST,PUT,DELETE,OPTIONS" />
         <add name="Access-Control-Allow-Credentials" value="true" />
        </customHeaders>
      </httpProtocol>
  </system.webServer>

I settle it by changing the localhost to IP address and it works. Thanks. — Loran, Sep 24 '19 at 09:13
@Loran I am glad that you solve the issue by your self. please post the solution as an answer and mark it. it will help other people. — Jalpa Panchal, Sep 24 '19 at 09:26
You can make this same change in IISExpress on your PC by installing Jexus Manager. — user3784130, Nov 03 '22 at 14:43

score 0 · Answer 2 · answered Sep 24 '19 at 04:10

0

Use this command in run (windows key + r) and run your app in the new browser

chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security

I hope it works as you want

answered Sep 24 '19 at 04:10

behzad

801
3
15
33

Worked like a charm – Md. Mahmud Hasan Apr 06 '20 at 16:15
What about for everyone else that wants to access this app? How are they going to know they need to run this command for the app to work? And why would they even want to? – Isaac Vidrine Jun 28 '21 at 21:21

Blocked by CORS policy : No 'Access-Control-Allow-Origin' header is present on the requested resource

2 Answers2