title: CORS in chrome extension
body: <p>I'm making a chrome extension and I need to make a cross-domain POST request to another domain. Code runs in Chrome <code>Content Script</code> environment which has some limitations.</p>
  
  <p>I inject my code in a specific site with domain looks like <code>service.site.com</code> and I have to make a request to the domain like <code>api.site.com</code></p>
  
  <p>The response headers from <code>api.site.com</code> looks like</p>
  
  <pre><code>access-control-allow-credentials: true
  access-control-allow-headers: Authorization, Content-Type, X-Requested-With, Accept
  access-control-allow-methods: GET, POST, PUT, DELETE, OPTIONS
  access-control-allow-origin: https://service.site.com
  </code></pre>
  
  <p>As you see that another domain allows requests from <code>service.site.com</code>. It means an <em>Origin</em> header of my request headers should contain that Origin.</p>
  
  <p>But chrome extension adds an Origin header for me!</p>
  
  <p>Now it sends a request to <code>api.site.com</code> with a header</p>
  
  <pre><code>Origin: chrome-extension://oeminagccdkclchnelmkbkcpcfnjgofj
  </code></pre>
  
  <p>and <code>api.site.com</code> may block it? I do not receive anything in a response. A request crashes and I see no error and no data in response.</p>
  
  <p>Of course I added permissions in manifest file:</p>
  
  <pre><code>"permissions": [
    "*://service.site.com/*",
    "*://api.site.com/*"
  ],
  </code></pre>
  
  <p>And it still doesn't work. Chrome extension continues change Origin header and server doesn't respond. OR does it respond but my browser blocks it? I can't find out. If I run that request in WEB-script environment, it works well and I see a response from server. But I still have to run it in a Content-script environment.</p>
  
  <p>I even tried to inject a function with post request in a web-script environment and call it from content-script environment but if I do it such way, it adds that Origin header and it doesn't work.</p>
  
  <p>I also tried to change Response headers using Chrome extension features hoping that would help</p>
  
  <pre><code>const responseListener = function(details){
    const out = [];
    details.responseHeaders.forEach(item =&gt; {
      if (item.name.toLowerCase() !== 'access-control-allow-origin') {
        out.push(item);
      }
    });
    out.push({name: 'access-control-allow-origin', value: '*'});
    return {responseHeaders: out};
  };
  
  chrome.webRequest.onHeadersReceived.addListener(responseListener, {urls: ["*://*/*"]},
    ["blocking", "responseHeaders"]);
  </code></pre>
  
  <p>Now it shows that <code>api.site.com</code> returns my header but it still doesn't help.</p>