title: how to enable Access-Control-Allow-Headers in xmlhttprequest
body: <p>An <code>XMLHttpRequest cannot load</code> error arises when using HTML with Jquery to call an API:</p>
  
  <pre><code>var xhr = new XMLHttpRequest();
  xhr.open("GET", "http://api.xxxx.com/col?system=xxx&amp;keyid=xxxxx&amp;rtype=city&amp;region=" + citiCd);
  xhr.onreadystatechange = function () {
    if (this.readyState == 4) {
      var datax = JSON.stringify(this.responseText);
      //my stuff
    }
  };
  xhr.send(null);
  </code></pre>
  
  <p>When run, it produces this error:</p>
  
  <blockquote>
    <p>XMLHttpRequest cannot load
    <a href="http://api.xxxx.com/col?system=xxx&amp;keyid=xxxxx&amp;rtype=city&amp;region=DLI" rel="nofollow">http://api.xxxx.com/col?system=xxx&amp;keyid=xxxxx&amp;rtype=city&amp;region=DLI</a>.
    Origin localhost is not allowed by Access-Control-Allow-Origin.</p>
  </blockquote>
  
  <p>How do I enable access? I tried <code>xdomainrequest</code> without luck. </p>