title: Cross-Origin Request Blocked issue using Angular 4 and Django
body: <p>I have two applications on two machine.</p>
  
  <ol>
  <li>Backend app using Django (example 123.431.234.123:8080)</li>
  <li>Frontend app using Angular (example 123.431.234.124:4200)</li>
  </ol>
  
  <p>Now I am trying to post request from angular</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>this.http.post&lt;any&gt;('http://123.431.234.123:8080/login/', { username: username, password: password }) </code></pre>
  </div>
  </div>
  </p>
  
  <p>I am getting error on browser:</p>
  
  <p>Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at <a href="http://123.431.234.123:8080/login/" rel="nofollow noreferrer">http://123.431.234.123:8080/login/</a>. (Reason: CORS header âAccess-Control-Allow-Originâ missing). </p>
  
  <p>When I am trying with curl command on my ubuntu machine, I am able to get the response successfully.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>curl -d  '{"username":"admin" ,"password":"carpediem"}' -H "Content-Type: application/json"  http://123.431.234.123:8080/login/  
   </code></pre>
  </div>
  </div>
  </p>
  
  <p>I tried to follow many links and also setup my django setting.py file as</p>
  
  <p><a href="https://stackoverflow.com/questions/40760813/cors-during-development-without-access-control-allow-origin?rq=1">link 1</a></p>
  
  <p><a href="https://stackoverflow.com/questions/38482059/enabling-cors-cross-origin-request-in-django">link 2</a></p>
  
  <p>and did step by step configuration as below</p>
  
  <p><code>pip install django-cors-headers</code>
  Adds to installed apps</p>
  
  <p>INSTALLED_APPS = (</p>
  
  <pre><code>...
  'corsheaders',
  ...
  </code></pre>
  
  <p>)
  Add  MIDDLEWARE </p>
  
  <p>MIDDLEWARE = [  </p>
  
  <pre><code>'corsheaders.middleware.CorsMiddleware',
  'django.middleware.common.CommonMiddleware',
  ...
  </code></pre>
  
  <p>]</p>
  
  <pre><code>CORS_ORIGIN_ALLOW_ALL=True
  </code></pre>
  
  <p>After all changes, I am still facing the same issue. It might be duplicate question, But Please help me to solve it.</p>
  
  <p>I am using Mozila firefox, Do I need to do any changes in browser or any other settings?</p>