I am trying to load the google map inside my chrome extension using the following CSP defined in manifest.json
"content_security_policy": "script-src 'self' 'unsafe-eval' https://maps.googleapis.com/ https://ssl.google-analytics.com; object-src 'self'"
It's working fine, now I converted my extension to Microsoft edge extension. and the overall code works except Content security policy block the resources download by google map. Below are the errors. Can anyone correct me if I'm doing wrong?
CSP14312: Resource violated directive ‘script-src 'self'’ in Host Defined Policy: https://maps.googleapis.com/maps/api/js?key=ID. Resource will be blocked.
The error code didn't find any helpful resource.
I didn't find the correct solution till now. However, I found the Alternative approach to integrate the google map inside the Microsoft Edge extension. that Embed the iframe inside the extension.
<iframe width="100%" height="100%" frameborder="0" style="border:0"src="https://www.google.com/maps/embed/v1/place?q=40.7127837,-74.0059413&;key=ID"></iframe>
Related
I made a chrome extension that loads an iframe on the gmail url. So far so good!
When I install the extension it loads the I framed with no problems but here comes the problem. If I refresh or access gmail again it doesn't work anymore with the following error, and no other errors.
Refused to frame 'https://...........com/' because it violates the
following Content Security Policy directive: "frame-src 'self'
https://clients4.google.com/insights/consumersurveys/
https://calendar.google.com/accounts/ https://ogs.google.com
https://onegoogle-autopush.sandbox.google.com
https://accounts.google.com/ https://apis.google.com/u/
https://apis.google.com/_/streamwidgets/
https://clients6.google.com/static/
https://content.googleapis.com/static/
https://mail-attachment.googleusercontent.com/
https://www.google.com/calendar/ https://calendar.google.com/calendar/
https://docs.google.com/ https://drive.google.com
https://.googleusercontent.com/docs/securesc/
https://feedback.googleusercontent.com/resources/
https://www.google.com/tools/feedback/
https://support.google.com/inapp/
https://.googleusercontent.com/gadgets/ifr
https://hangouts.google.com/ https://talkgadget.google.com/
https://.talkgadget.google.com/
https://www-gm-opensocial.googleusercontent.com/gadgets/
https://plus.google.com/ https://wallet.google.com/gmail/
https://www.youtube.com/embed/
https://clients5.google.com/pagead/drt/dn/
https://clients5.google.com/ads/measurement/jn/
https://www.gstatic.com/mail/ww/ https://www.gstatic.com/mail/intl/
https://clients5.google.com/webstore/wall/
https://ci3.googleusercontent.com/ https://workspace.google.com/u/
https://workspace.google.com/marketplace/appfinder
https://gsuite.google.com/u/
https://gsuite.google.com/marketplace/appfinder
https://www.gstatic.com/mail/promo/ https://notifications.google.com/
https://tracedepot-pa.clients6.google.com/static/
https://staging-taskassist-pa-googleapis.sandbox.google.com
https://taskassist-pa.clients6.google.com
https://.prod.amp4mail.googleusercontent.com/
https://.client-channel.google.com/client-channel/client
https://clients4.google.com/invalidation/lcs/client
https://tasks.google.com/embed/ https://keep.google.com/companion
https://addons.gsuite.google.com
https://contacts.google.com/widget/hovercard/v/2
https://gsuite.google.com
https://.googleusercontent.com/confidential-mail/attachments/".
Now. You are wondering if I put the CSP in my header. The answer is yes. I have header("Content-Security-Policy: frame-src 'self' https://*.google.com;"); in my php and the header si loaded. But the question I can't answer is: Is Chrome seeing errors after the page refresh and why?
In theory if there is a problem in the CSP it should block the iframe from the first moment, and not after a while.
Do you know anything about this?
Refused to frame 'https://...........com/' because it violates the
following Content Security Policy directive: "frame-src 'self' ... Google's domains here ...
It's not your CSP, but some of Google's iframe publish its own. Because commonly Google does not allow to embed own into third-party.
Most interesting part: 'https://...........com/' is hidden (is here your domain or not?).
Is Chrome seeing errors after the page refresh and why?
Google's services based on a lot of it own iframes, wich inter each other based on Cookie.
For example, you can embed https://gmail.com into iframe, but if you are logged into account (have auth Cookies), Gmail does auto redirect you to https://mail.google.com/mail/u/0/ page which does not allow iframing (because of X-Frame-Options deny).
Behavior of iframes of Google could be very complicated, so a exact answer "Why" is not possible without detail researches.
Anyway embed of Google services (not officially intended for embedding) into iframe is not a good idea. Google does not allow that because of security.
When using Google Analytics, I'm getting the following error from Safari 13.1 but not from Chrome:
Refused to connect to https://www.google-analytics.com/j/collect?XYZ
because it does not appear in the connect-src directive of the Content Security Policy.
My application doesn't try to connect to www.google-analytics.com, but it downloads a script from www.googletagmanager.com which in turn downloads a script from www.google-analytics.com.
My CSP are configured as follows:
script-src 'self' 'unsafe-eval' data: www.google-analytics.com www.googletagmanager.com www.google.com www.gstatic.com
connect-src 'self'
So as Safari says, I don't have google-analytics in connect-src, but that doesn't seem to be a problem for Chrome.
Is my CSP wrong (and Chrome is being too permissive) or is this a bug in Safari?
Safari is right. Chrome is being too permissive:
The HTTP Content-Security-Policy (CSP) script-src directive specifies valid sources for JavaScript.
Note that this statement is not qualified.
Chrome also violates other postulates of CSP. For example, blocked-uri for different origins requires that the URI path is stripped, but Chrome doesn't do that and Safari does.
At this point in time Safari seems to be more compliant/strict than Chrome, but in any case you should go by the stricter browser because, well, you don't really have a choice...
It's a Shopify App.Shopify that loads my web application on their iframe.
It works great on Mozila Firefox, IE and other browsers except on Chrome. When I try to load on Chrome, it shows following error.
Refused to frame 'http://5281a995.ngrok.io/' because it violates the
following Content Security Policy directive: "child-src 'self'
https://* shopify-pos://*". Note that 'frame-src' was not explicitly
set, so 'child-src' is used as a fallback.
It looks like the app is not using SSL. Try adjusting your code and/or the callback URL so that your embedded app is served over https:// and not http://.
I am trying to load a simple iframe into one of my web pages but it is not displaying. I am getting this error in Chrome:
Refused to display 'https://cw.na1.hgncloud.com/crossmatch/index.do' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'self' https://cw.na1.hgncloud.com".
Invalid 'X-Frame-Options' header encountered when loading 'https://cw.na1.hgncloud.com/crossmatch/index.do': 'ALLOW-FROM https://cw.na1.hgncloud.com' is not a recognized directive. The header will be ignored.
This is the code for my iframe:
<p><iframe src="https://cw.na1.hgncloud.com/crossmatch/" width="680" height="500" frameborder="0"></iframe></p>
I am not really sure what that means. I have loaded plenty iframes before and never received such errors.
Any ideas?
It means that the http server at cw.na1.hgncloud.com send some http headers to tell web browsers like Chrome to allow iframe loading of that page (https://cw.na1.hgncloud.com/crossmatch/) only from a page hosted on the same domain (cw.na1.hgncloud.com) :
Content-Security-Policy: frame-ancestors 'self' https://cw.na1.hgncloud.com
X-Frame-Options: ALLOW-FROM https://cw.na1.hgncloud.com
You should read that :
https://developer.mozilla.org/en-US/docs/Web/Security/CSP
https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy
The reason for the error is that the host server for https://cw.na1.hgncloud.com has provided some HTTP headers to protect the document. One of which is that the frame ancestors must be from the same domain as the original content. It seems you are attempting to put the iframe at a domain location that is not the same as the content of the iframe - thus violating the Content Security Policy that the host has set.
Check out this link on Content Security Policy for more details.
For any of you calling back to the same server for your IFRAME, pass this simple header inside the IFRAME page:
Content-Security-Policy: frame-ancestors 'self'
Or, add this to your web server's CSP configuration.
In my case it was that the site i was embedding had a specific url for embedding content and a different url for sharing
the url i had set in the iframe was
https://site/share/2432423232
changing it to
https://site/embed/2432423232
worked for me
The same issue appears to me, don't open the page in a private window.
You can use multiple browsers if you need to log in with different users.
I know that this may be just me being stupid, but in a Chrome tab that has a page loaded with a URL which begins with chrome-extension://, can the scripts be online or use eval();? I know that browser or page actin oopups or app windows can't use it. Part of my extension opens a normal new tab with a page which uses eval();.
All pages running at the chrome-extension:// origin are subject to a default content security policy described here, specifically:
script-src 'self'; object-src 'self'
A popup is considered such a page, too, as is the invisible background page. If you open a file from your extension, it will be subject to it too.
You can either:
Relax (or tighten) the default policy for all pages with your manifest:
"content_security_policy": "[POLICY STRING GOES HERE]"
This way you can allow eval and friends by adding 'unsafe-eval' to script-src.
You can also allow loading external scripts by adding their origin to the policy; however, only HTTPS origins are allowed for MitM protection reasons.
However, it's important to remember that 'unsafe-inline' will be ignored regardless of your custom policy.
Relax (or tighten) the default policy for a specific page by declaring it sandboxed.
"sandbox": {
"pages": [
"page1.html",
"directory/page2.html"
]
// content_security_policy is optional.
"content_security_policy":
"sandbox allow-scripts; script-src https://www.google.com"
],
Sandboxed CSP can be more permissive, but still there are a couple of restrictions.
The price of sandboxing is losing access to Chrome API. The sandboxed script has to communicate via DOM messages with some privileged pages to do privileged things.
There's a guide in the documentation, "Using eval in Chrome Extensions. Safely."
For Apps, the situation is a bit different. Again, a default (and more restrictive) CSP applies, but you cannot modify it in the manifest.
Sandboxing approach still works, though.
To use eval, look at the policy "unsafe-eval" in https://developer.chrome.com/extensions/contentSecurityPolicy