chrome.browserAction.setIcon() not work with content_security_policy - google-chrome-extension

I have added functionality to my Chrome extension such that the icon button changes color when it is clicked. The code is simple:
chrome.browserAction.setIcon({path:"icon_pink_lines.png", tabId:tab.id});
However, this took me a while to figure out because it turns out that it doesn't work when the content_security_policy is set in manifest.json. I originally had
"content_security_policy": "default-src 'none'; script-src 'self'"
The question is, what, if anything, do I lose by removing this? Or should it just be something else to work with the icon change? To be honest, I just copied the original policy from some sample manifest file and haven't thought about it since.

There is a default value for content_security_policy if you don't set it up yourself:
script-src 'self'; object-src 'self'
Yours is tighter though. It does not allow to load any external resources (while default policy does not allow only external scripts). It seems that your icon_pink_linkes.png is treated as an external resource and blocked by CSP. This looks like a bug to me, you can report it here (I've searched for similar bugs, but haven't found any).

Related

Content Security Policy invalidating login session when site accessed from an external link

I have a fairly standard Node Express user authentication configuaration. Express-session, cookie-parser are used for sessions / cookies and passport to handle authentication.
I recently added a content security policy to all routes, and it's messing with user sessions. Navigating the site internally is fine. If you manually type a url into the browser, also good - it will remember your logged in session.
However, if you access the site via a bookmark, or follow a link from a 3rd party website, the user is thrown out and forced to log in again. If I disable the content security policy, everything is fixed.
Can anyone advise on why this happens, or what to investigate, as I'm a bit in the dark as to how it could be happening.
Content-Security-Policy: default-src 'self'; script-src 'self' 'nonce-b2bd8bb3d70af06062931f9217eeec75'; style-src 'self' 'unsafe-inline'; img-src 'self' data:;
default-src 'self' set all these below to 'self':
child-src
connect-src
font-src
frame-src
img-src
manifest-src
media-src
object-src
prefetch-src
script-src
script-src-elem
script-src-attr
style-src
style-src-elem
style-src-attr
worker-src
I would add them all manually one by one and see which one of these introduce the issue you are having. After this you can remove them all again and add the whitelisting you need.
A good practice aswell is too add a report-uri to fetch all the times you get blocked. Maybe in the report there is aswell some more usefull information. You can aswell enable a 'report-only' mode until you are confident the issue you are having is resolved. Another resource I can suggest is the CSP evaluator from Google; it suggestions are really useful.
Hope this answer helps you find why your users get logged out!
OK, this was a bad question...
The cause was that in the same commit, that the content-security-policy was originally added, I also set the cookie sameSite property to true. It was a mistake of me to not separate my commits better. Problem solved...

Adsense sometimes doesn't serve ads because of Content Security Policy

I recently added Google AdSense to my website and the ads works fine, expect sometimes they don't load and I get the following errors in the console
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src https://cdn.ampproject.org/". Either the 'unsafe-inline' keyword, a hash ('sha256-xxx'), or a nonce ('nonce-...') is required to enable inline execution.
From what I've read I need to added the CSP in my HTML headers, but doesn't seem to fix the problem.
Any tips?
TRY1
This discussion could help to get access to the site with the following snippet:
script-src 'self' http://xxxx 'unsafe-inline' 'unsafe-eval';
TRY2
This documentation will show you how to define the policy with:
Content-Security-Policy: script-src 'self' https://apis.google.com
Hope that will help and you question is answered. Give it a shot, cheers! :)

CSP: Trouble whitelisting url that changes, wildcard not working

I've been having ongoing hurdles with my CSP policy and trying to whitelist the urls for my cookie banner (Iubenda). Between Chrome's developer tools and ReportURI, I can get everything to work and nothing gets blocked.
Until Iubenda updates it's vendor list (which happens randomly and often). They change the version # in the url so it no longer passes through my CSP. The most recent example: https://cdn.iubenda.com/cs/tcf/v2/vendorlist.46.json is whitelisted under "connect-src" and works. Except they just updated the vendorlist and the url is now https://cdn.iubenda.com/cs/tcf/v2/vendorlist.47.json
I tried using a wildcard to try an include future variations of the file, or even to include all links that come from the site httsp://cdn.iubenda.com/* as well as including 'self' - but I have a feeling it's not the right solution. Is there a better way to write the exception so I don't have to keep checking every few weeks if they updated the link (which can prevent my cookie banner from displaying).
My coding skills are poor, so it could be something simple that I've missed.
Have you tried following here? https://www.iubenda.com/en/help/12260-how-to-configure-content-security-policy-to-allow-iubenda-scripts-to-execute
They suggest something similar:
Content-Security-Policy:
default-src 'self';
script-src 'self' *.iubenda.com 'nonce-EDNnf03nceIOfn39fn3e9h3sdfa' 'unsafe-eval';
connect-src *.iubenda.com;
style-src 'unsafe-inline' *.iubenda.com;
frame-src *.iubenda.com;
img-src *.iubenda.com data:

How to use External APIs(google map) in a packaged App

My application requires external URL of GoogleMap API to be executed in a packaged App. When I execute the code on simulator, I get the following error in Security Tab
"Content Security Policy: The page's settings blocked the loading of a resource at https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true&callback=initialize ("script-src app://58b444ed-2bd9-4ce2-8687-09694b09d6ae")."
Kindly provide a solution to handle this
Regards
Rashmi
There are few reasons why you might get a CPS error. Please refer to this url for more information. https://developer.mozilla.org/en-US/Apps/Build/Building_apps_for_Firefox_OS/CSP
By default, CSP is enforced only on privileged and certified apps. If you have a simple packaged app, you shouldn't have CSP issues. If you didn't mention anything for the app type, you shouldn't have issues.
The CSP for privileges app are:
"default-src *;
script-src 'self';
object-src 'none';
style-src 'self' 'unsafe-inline'"
And for certified:
"default-src *;
script-src 'self';
object-src 'none';
style-src 'self'"
Which mean that you cannot have a script that points on a remote server other than your own. If your packaged app is loading an external url, you could probably proxy the google js trough your server. As the script-src will match the default-src, it should work.
Otherwise, you could probably save the script directly in your project. This is probably not recommended but that could also work.
There is also chances that the script provided by google won't work anyway if they use eval and new Function.

Chrome application load external javascript

I'm trying to include the speedof.me library in my Chrome App to allow the user to do some bandwidth testing, but it seems that due to some security restrictions it does not allow me to load it. The error I get is:
Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "default-src 'self' chrome-extension-resource:". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.
I couldn't really find any documentation on how to get around this. I tried both including the js file in the html:
<script src="api.js" type="text/javascript"></script>
and also dynamically loading it through javascript:
$.getScript("api.js");
Both of those result in that same error message. Per suggestions in the comments I also tried modifying the content_security_policy:
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
That doesn't work since this is a packaged app and not an extension.
I tried sandboxing as well, but I had a bunch of other chrome app api logic in that page and sandboxing disables that.
Is what I'm trying to do just not feasible for a Chrome app? This is the first one I've ever done and I inherited it from someone else that never quite finished it.

Resources