CORS Issue in Chrome Developer Extension
<p>I am a novice in Chrome Extension Development and I am developing a Chrome <strong>Developer</strong> Extension (appears as a part of Developer Tools).
This requirement is to make External Service (some URL )call which may or may not be in the same Server (of origin). From the documentation I see the extensions are not restricted by the Same Origin Policy. <a href="https://developer.chrome.com/extensions/xhr" rel="nofollow noreferrer">https://developer.chrome.com/extensions/xhr</a></p>

<p>However I am running into CORS issue while I try to call an external service. </p>

<p>The Manifest.json looks like the below one, where I have permission to all websites. </p>

<pre><code>"permissions": [
        "tabs",
        "clipboardWrite",
        "http://*/*",
        "https://*/*"
    ],
</code></pre>

<p>In the code I am trying to call HTTP POST on some URL , the code looks like </p>

<pre><code>gwUrl = 'http://services.odata.org/V2/(S(lts2i32bwwy01zoq4cxyscwt))/OData/OData.svc/Products';
var xhr = new XMLHttpRequest();
xhr.open("POST", gwUrl , true);
xhr.setRequestHeader("Content-type", "application/json");
xhr.onreadystatechange = function() {}
xhr.send({ "ID":17, "Name": "Bread", "Description": "Whole grain bread"});      
</code></pre>

<p>I am getting the following Error.</p>

<p><em>OPTIONS http//services.odata.org/V2/(S(lts2i32bwwy01zoq4cxyscwt))/OData/OData.svc/Products 501 (Not Implemented)</em></p>

<p><em>XMLHttpRequest cannot load http//services.odata.org/V2/(S(lts2i32bwwy01zoq4cxyscwt))/OData/OData.svc/Products. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'chrome-extension://cdcbiglainpfeapfejdjdkldcehjakfi' is therefore not allowed access. The response had HTTP status code 501.</em></p>

<p><a href="https://i.stack.imgur.com/U55gV.png" rel="nofollow noreferrer">Error Screenshot </a>
Can anyone please guide me to fix the issue.</p>