title: XMLHttpRequest blocked by CORS Policy
body: <p>I add an API with following script in let's say <a href="http://www.test.com" rel="noreferrer">http://www.test.com</a>:</p>
  
  <pre><code>&lt;script src="http://apiendpoint.com/api/v1/api.js"&gt;&lt;/script&gt;
  
  &lt;div id="api" data-apikey="LA59CJI9HZ-KIJK4I5-3CKJC"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>api.js</strong></p>
  
  <pre><code>$(function () {
  
    apikey = $('#api').data('apikey');
    $("#api").load("http://apiendpoint.com?apikey=" + apikey);
  
  })
  </code></pre>
  
  <p>When I load the page, I get following error:</p>
  
  <blockquote>
    <p>XMLHttpRequest cannot load
    <strong>apiendpoint URL</strong>.
    Redirect from
    '<strong>apiendpoint URL</strong>' to
    '<strong>apiendpoint URL</strong>' has
    been blocked by CORS policy: No 'Access-Control-Allow-Origin' header
    is present on the requested resource. Origin
    '<strong>test URL</strong>' is therefore not allowed access.</p>
  </blockquote>
  
  <p>In the path of apiendpoint.com I added in .htaccess following code:</p>
  
  <pre><code>Header set Access-Control-Allow-Origin "*"
  </code></pre>
  
  <p>But it does not work.</p>