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.