title: CORS not working in Chrome
body: <p>I am trying to implement CORS (Cross-origin resource sharing) on my web application. This is the structure:</p>
  
  <ul>
  <li>Site example.com: contains a couple JS files (jquery.js, myscript.js)</li>
  <li>Site example2.com: load both scripts from example.com, then call for one function from myscript.js, which makes a POST request to example.com</li>
  </ul>
  
  <p>example2.com code would be something like:</p>
  
  <pre><code>&lt;script src="http://example.com/jquery.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="http://example.com/myscript.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;startFunction(1, 2)&lt;/script&gt;
  </code></pre>
  
  <p>Both JS are loaded fine on site B. However, when the function is called and the POST (standard jQuery $.post) performed, I get the following error:</p>
  
  <blockquote>
    <p>XMLHttpRequest cannot load <a href="http://example.com/postrequest" rel="nofollow">http://example.com/postrequest</a>. Origin
    <a href="http://example2.com" rel="nofollow">http://example2.com</a> is not allowed by Access-Control-Allow-Origin.</p>
  </blockquote>
  
  <p>I went to example.com server and updated the .htaccess like this:</p>
  
  <pre><code>Header set Access-Control-Allow-Origin "*"
  Header add Access-Control-Allow-Headers "Content-Type, Depth, User-Agent, X-File-Size, X-Requested-With, If-Modified-Since, X-File-Name, Cache-Control"
  Header add Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
  </code></pre>
  
  <p>I checked if the headers are being sent and indeed they are being sent. Accessing example2.com using Firefox, JS files are loaded and the POST request is successful. However, if I try to do exactly the same with Chrome, it still fails. I have been dealing with this for some hours and still I am not able to see what is wrong with this. Is this a Chrome bug or something?</p>
  
  <p>I have to point out that I checked similar questions and applied some of the solutions, but I did not have success.</p>
  
  <p><strong>Update</strong>: Tried the suggested solution adding this:</p>
  
  <pre><code>$.ajaxSetup({
      beforeSend: function(xhr) {
          xhr.setRequestHeader('Content-Type', 'text/plain');
      }
  });
  </code></pre>
  
  <p>And indeed the Content-Type is set, but the same error keeps happening, so this did not solve anything.</p>