title: Web-API cal from Web Form - AJax. No 'Access-Control-Allow-Origin' header is present
body: <p>I am trying to use web API with Web Forms application to get data through Ajax call.</p>
  
  <p>So created an Web API project and deployed it to local IIS. It respond to the requests.</p>
  
  <p><img src="https://i.stack.imgur.com/sDSED.png" alt="enter image description here"></p>
  
  <p>And then make an Ajax call in webForm (Default.aspx) to get the data.</p>
  
  <pre><code>$(document).ready(function () {
          var url = 'http://localhost:8080/api/Values';
          $.ajax({
              url: url,
              type: 'POST',
              crossdomain: 'true',
              contentType: "application/json; charset=utf-8;",
              type: 'GET',
              success: function (result) {
                  var r = JSON.stringify(result);
                  alert("From Web-API  " + r);
              }
          });
  });
  </code></pre>
  
  <p>But this is following error</p>
  
  <p><em>"XMLHttpRequest cannot load <a href="http://localhost:8080/api/Values" rel="nofollow noreferrer">http://localhost:8080/api/Values</a>. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<a href="http://localhost:61605" rel="nofollow noreferrer">http://localhost:61605</a>' is therefore not allowed access."</em></p>
  
  <p><img src="https://i.stack.imgur.com/PWGdM.png" alt="enter image description here"></p>
  
  <p>Which header am I missing here?</p>