Cross-Origin Request Blocked: in javascript using XMLHttpRequest

Question

I am trying to send a HTTP request in javascript using XMLHttpRequest and so I am using the following code in an HTML file. I have a server running which returns a dictionary of form {'test' : 'string'}.

<script type="text/javascript">
  var xhr = new XMLHttpRequest();
  xhr.open("GET", "http://localhost:5000/test", true);
  xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
  xhr.send();

  xhr.onreadystatechange = processRequest;
  console.log(xhr.status)

  function processRequest(e)
  {
    if (xhr.readyState == 4)
    {
      alert(xhr.responseText);
    }
  }
</script>

However in spite of adding the header, I am getting a Cross-Origin Request Blocked: error in my console when I try to print xhr.status in the console it shows 0 as response. I am using flask server which shows a bad message error on using HTTPS, so I am using an HTTP request.

Answer 1

You can not control CORS from front end. You have to put the CORS module to your back end server.

check the link flask cors.