I know there is already stuff about that. i'm on it for several days and read and tried before posting.
1: No 'Access-Control-Allow-Origin' header is present on the requested resource—when trying to get data from a REST API describes a relevant issue according to my problem. But I can't solve it. I'm on a chrome extension development that performs an ajax request on a dictionary web server and injects some css/html in the current page, to display a tooltip with some data related to the user selection. It works really fine with the 'MOESIF Cors' extension ON in my browser. I want it to work without this extension, with some javascript tweaks or manifest.json good parameters. I'm stuck. I had CORS violation because of the server (I've no access to the server and can't modify its response headers) Access-control-allow-origin policy. I've tried a lot of request headers combinations in my $.ajax/jquery GET-request but nothing works. Access to XMLHttpRequest at 'https://dictionary.xxx.ie/dictionary/english/government%20' from origin 'https://en.wikipedia.org' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. According to the article cited above, I've tried to set 'data-type': to 'jsonp' and that replaced the cors policy violation by another violation : Refused to load the script 'https://dictionary.xxx.ie/dictionary/english/publication?callback=jQuery3600056231503718366715_1615940095416&_=1615940095418' because it violates the following Content Security Policy directive: "script-src 'self'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
There must be a quick fix to this as the MOESIF extension works so fine : I tried all these headers : MOESIF Extension but it doesn't work. I sandboxed my script in the manifest.json after reading the docs (it seems to be more lax) but it hasn't done any better. I'm thinking of embedding a javascript proxy in my extension if such a thing is possible ! Any clue ? thanks for reading.
Manifest.json
{
"manifest_version": 3,
"name": "Not a translator",
"version": "1.0",
"default_locale": "en",
"background": {
"service_worker": "background.js"
},
"host_permissions": [
"http://dictionary.xxx.ie/*",
"https://dictionary.xxx.ie/*"
],
"permissions": ["storage", "activeTab", "contextMenus", "scripting"],
"sandbox": {
"pages": ["chrome-extension://afeenkbblogndiamnfkocnomlppheomb/jquery.min.js"]
},
"content_security_policy": {
"sandbox":"sandbox allow-scripts; script-src-elem chrome-extension://afeenkbblogndiamnfkocnomlppheomb/jquery.min.js 'unsafe-inline' 'unsafe-eval'; child-src 'self';"
},
"content_scripts":
[{
"matches": ["http://*/*", "https://*/*"],
"css": ["tooltip.css"],
"run_at": "document_start",
"js": ["tooltip.js", "jquery.min.js"]
}],
"externally_connectable": {
"ids": ["afeenkbblogndiamnfkocnomlppheomb"],
"matches": ["https://localhost/*"],
"accepts_tls_channel_id": false
},
"action": {
"default_title": "__MSG_tooltip__",
"default_popup": "popup.htm",
"default_icon": {
"16": "/images/get_started16.png",
"32": "/images/get_started32.png",
"48": "/images/get_started48.png",
"128": "/images/get_started128.png"
}
},
"icons": {
"16": "/images/get_started16.png",
"32": "/images/get_started32.png",
"48": "/images/get_started48.png",
"128": "/images/get_started128.png"
},
"options_page": "options.htm"
a part of my jquery request from background.js (very large, can't get a runnable version) :
var url1 = "https://dictionary.xxx.ie/dictionary/english/" +
encodeURIComponent(text);
$.ajax({
method: "GET",
url: url1,
crossDomain:true,
dataType: "jsonp",
data: {}
})...
When I inspect the headers of my request I sometime get a 403 forbidden. when I put the 'jsonp' header I've got some 'provisional headers' and nothing else. I think the POST or OPTIONS method used for jsonp gets me some response headers that ban further requests. I don't know which header I can add to solve this. Jquery doesn't allow me to pass a 'Origin': 'http://localhost' for example (for vulnerability reasons).
