Chrome extension permissions got errors while loading - javascript

I want to create a chrome extension with javascript files stored local has to be executed. I got permission errors.
Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' http://localhost:5000". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.
My permissions in Manifest
"permissions" : ["activeTab"],
"content_security_policy": "script-src 'self' 'unsafe-eval' ; object-src 'self'"

Related

Possibly uncaught promise rejection EvalError

Even though I have added
"content_security_policy": { "extension_pages": "script-src 'self'; object-src 'self'; script-src-elem 'self' 'unsafe-inline' " },
in manifest.json (Manifest V3) I am getting the error in Chrome Extension.
What may be the reason.
Complete error: Failed to load implementation: EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'".
I attempted to follow this guide and add the "content_security_policy" tag to my manifest.json as
described in chrome documentation. But did not worked for me am I wrong or do I need to do anything else.
Thanks.

Chrome extension refused to load the script for Firebase

I am trying to setup firebase database for my chrome extension. However it still refuse to load the script even after I added content_security_policy
console error
"content_security_policy":"script-src 'self' https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com; object-src 'self'",
<script defer src="https://www.gstatic.com/firebasejs/7.11.0/firebase-app.js"></script>
<script defer src="https://www.gstatic.com/firebasejs/7.11.0/firebase-database.js"></script>
You must specify those 2 links in your manifest file under the "content_security_policy" property like so:
"content_security_policy": "script-src 'self' https://www.gstatic.com/firebasejs/7.11.0/firebase-app.js https://www.gstatic.com/firebasejs/7.11.0/firebase-database.js https://www.googleapis.com https://*.firebaseio.com; object-src 'self'"

Cordova issue with $.getJSON API

I'm working on a developing an app for a university project using Cordova so it's my first time using it. As part of it, I've managed to implement an API from Reed Jobs and this is working fine in Chrome, however it won't work on the iOS emulator - there are no errors but the page just doesn't load any data.
I'm using $.getJSON("reed.php", function(data) in my JavaScript to call my data, and then my PHP is as follows...
<?php
$username = "username";
$password = "";
$remoteUrl = 'https://www.reed.co.uk/api/1.0/search?locationName=leeds&distancefromlocation=15&partTime=true&temp=true';
$opts = array(
'http'=>array(
'method'=>"GET",
'header' => "Authorization: Basic " . base64_encode("$username:$password")
)
);
$context = stream_context_create($opts);
// Open the file using the HTTP headers set above
$file = file_get_contents($remoteUrl, false, $context);
print($file);
?>
After reading some suggestions, I've tried adding <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *;**script-src 'self' https://www.reed.co.uk/ 'unsafe-inline' 'unsafe-eval';** "> to my html page, but this presents me a list of errors in my console:
Unrecognized Content-Security-Policy directive '**script-src'.
Unrecognized Content-Security-Policy directive '**'.
Refused to load the script 'https://code.jquery.com/jquery-3.3.1.min.js' because it violates the following Content Security Policy directive: "default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'default-src' is used as a fallback.
Refused to load the stylesheet 'https://use.fontawesome.com/releases/v5.6.3/css/all.css' because it violates the following Content Security Policy directive: "style-src 'self' 'unsafe-inline'". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.
Refused to load the stylesheet 'https://fonts.googleapis.com/css?family=Poppins:300,500,700,900' because it violates the following Content Security Policy directive: "style-src 'self' 'unsafe-inline'". Note that 'style-src-elem' was not explicitly set, so 'style-src' is used as a fallback.
Refused to load the script 'https://code.jquery.com/jquery-3.3.1.min.js' because it violates the following Content Security Policy directive: "default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'default-src' is used as a fallback.
Uncaught ReferenceError: $ is not defined
at index.js:31
Uncaught ReferenceError: $ is not defined
at window.onload
And then I also tried adding <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' http://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'; connect-src http://reed.co.uk https://reed.co.uk"> which gave me the error of:
Refused to connect to 'https://example.com/reed.php' because it violates the following Content Security Policy directive: "connect-src http://reed.co.uk https://reed.co.uk".
Can anybody help me? My understanding of the meta tags is not very established.
Your CSP is set to http://reed.co.uk https://reed.co.uk but your call points to https://example.com
Try this?
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' http://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'; connect-src http://reed.co.uk https://reed.co.uk https://example.com">

Chrome extension fetch API - Content Security Policy

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.
After a bit more of research I found a solution. The URL of the GitKraken API should be in connect-src property, instead of default-src. So my manifest now looks like this:
permissions: [ ..., "https://gloapi.gitkraken.com/" ],
"content_security_policy": "default-src 'self'; script-src 'self' 'sha256-[...]'; style-src * 'unsafe-inline'; img-src 'self' data:; connect-src https://gloapi.gitkraken.com/;"
More information:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/connect-src#Syntax

Content Security Policy directive: "script-src 'self' blob: filesystem: chrome-extension-resource:" While fetching whether

I am using jQuery simple whether plugin to get the whether and trying to create a chrome widget.
While loading the file as a chrome extensions, I am getting error, after looking all the help provided by google and here it self, still I am not able to resolve this issue.
Below is the error for yahoo whether
> jquery-2.1.3.min.js:4 Refused to load the script
> 'https://query.yahooapis.com/v1/public/yql?format=json&rnd=2016437&diagnosti…ces(1)%20where%20text=%22New%20Delhi%22)%20and%20u=%22c%22&_=1462326587463'
> because it violates the following Content Security Policy directive:
> "script-src 'self' blob: filesystem: chrome-extension-resource:".
Another error which is for font,
> Refused to load the font
> 'data:application/octet-stream;base64,AAEAAAAPAIAAAwBwR1NVQrD+s+0AAAD8AAAAQk…GIUViwQIhYsQNkRLEmAYhRWLoIgAABBECIY1RYsQMARFlZWVmzDAIBDCq4Af+FsASNsQIARAAA'
> because it violates the following Content Security Policy directive:
> "default-src *". Note that 'font-src' was not explicitly set, so
> 'default-src' is used as a fallback.
Used manifest code are
"content_security_policy": "script-src 'self'; object-src 'self' https://query.yahooapis.com/",
"permissions": [
"tabs", "<all_urls", "http://localhost/",
"http://*/*", "https://*/*", "https://query.yahooapis.com/*"
],
"content_scripts":
[{
"css": [
"css/component.css",
"css/tooltip-line.css",
"css/modal.css"
],
"js": [
"js/modernizr.custom.js",
"js/jquery-2.1.3.min.js",
"js/jquery.simpleWeather.min.js",
"js/handlebars-v4.0.5.js",
"js/moment.min.js",
"js/background.js"
],
"matches": [ "http://*/*", "https://*/*"]
}]
Also In my html file i am using this meta tag
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' http://* 'unsafe-inline'; script-src 'self' http://* 'unsafe-inline' 'unsafe-eval'" />
Can some one please help me to how i can solve this.
Your content-security-policy has "script-src 'self' which means scripts cannot be loaded from a third party URL.
You have specified yahoo API in the object-src directive. object-src directive (MDN) specifies valid sources for the <object>, <embed>, and <applet> elements.
To load the script from a third party, you have to specify in script-src directive like this:
"content_security_policy": "script-src https://query.yahooapis.com/ 'self'; ..."

Categories

Resources