My chrome extension should fetch some remote resources from 3rd party API through HTTP request.

const getBoards = callback => { fetch("https://gloapi.gitkraken.com/v1/glo/boards", { credentials: "include" }) .then(response => { ... }) .catch(err => { ... }); };

Unfortunately it throws the following error:

Refused to connect to 'https://gloapi.gitkraken.com/v1/glo/boards' because it violates the following Content Security Policy directive: "default-src 'self'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback.

After a bit of research, I found the chrome requirements to include the url in the manifest permissions and CSP string.

"permissions": [ ..., "https://gloapi.gitkraken.com/" ], "content_security_policy": "default-src 'self' gloapi.gitkraken.com; script-src 'self' 'sha256-[...]'; style-src * 'unsafe-inline'; img-src 'self' data:;"

But instead of solving the first error these changes just caused another.

Ignored insecure CSP value "gloapi.gitkraken.com" in directive 'default-src'.

Is my CSP formatting wrong, or there's something else I should do in order to make this GET HTTP request work.