I'm making a chrome extension and I need to make a cross-domain POST request to another domain. Code runs in Chrome Content Script environment which has some limitations.
I inject my code in a specific site with domain looks like service.site.com and I have to make a request to the domain like api.site.com
The response headers from api.site.com looks like
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
As you see that another domain allows requests from service.site.com. It means an Origin header of my request headers should contain that Origin.
But chrome extension adds an Origin header for me!
Now it sends a request to api.site.com with a header
Origin: chrome-extension://oeminagccdkclchnelmkbkcpcfnjgofj
and api.site.com may block it? I do not receive anything in a response. A request crashes and I see no error and no data in response.
Of course I added permissions in manifest file:
"permissions": [
"*://service.site.com/*",
"*://api.site.com/*"
],
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.
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.
I also tried to change Response headers using Chrome extension features hoping that would help
const responseListener = function(details){
const out = [];
details.responseHeaders.forEach(item => {
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"]);
Now it shows that api.site.com returns my header but it still doesn't help.