Adding a facebook iframe to my page cannot be fixed by using new Content Security Protocol language, how do I get it to show up on my site?
Adding a Facebook iframe to my page cannot be fixed by using new Content Security Protocol language, how do I get it to show up on my site? I have tried to use all the different ways on the CSP language to label the source of the Facebook embed such as frame-ancestors or frame-src, etc. None of the new labels seem to work.
In addition, I have tried changing the configuration on my Browser to active_content -- that did not work. Plus, it would not solve the issue for visitors who do not have their own configurations changes on the default settings of their browser.
I read something about people editing the configuration of their server in the x-frame options. Is that any good, will that do anything? I am hesitant to start editing my server if the changes in the CSP code is supposed to make the embed show up directly in the site. That is preferable to changing the site server.
Please help here. Thank you.
Chosen solution
Hi faithdwsn, it works for me. I notice toward the right end of your toolbar what I think is the icon for the "Facebook Container" extension. Are you sure that isn't interfering?
Read this answer in context 👍 0All Replies (9)
faithdwsn said
Reference: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy
Modified by faithdwsn
I added the link to the CSP reference above for people trying to help me with the question.
Hi faithdwsn, please ignore the spam message promoting an unofficial phone number.
Are you getting a message in the Web Console indicating that Firefox won't load the frame due to CSP? Does it mention the specific policy? (https://developer.mozilla.org/docs/To.../Web_Console)
Please note that some blocking add-ons like NoScript work by modifying the CSP headers, so you might also need to relax blocking add-ons if you see such messages without any apparent explanation.
Also, Firefox's Enhanced Tracking Protection could be a factor in private windows (or if you selected a higher level of protection). You can manage that using the shield icon at the left end of the address bar (turns purple when content is being blocked).
I want to show you the screenshot. Even with the Shield Icon turned off, tracking protection turned off on the site, the embedded Facebook iframe will not show up. Here are two screenshots with the console log, one message when the page immediately loads, and another one when I place the inspector over the section where the iframe is usually located.
Also, when you say, relax blocking add-ons, what do you specifically mean by that statement? I have my settings on Firefox blocking at "standard", do I need to set them to "custom" and reduce the blocking down further? If yes, on which specific setting should be turned off for which items? Can you please send me a screenshot and explain what you mean specifically instead of a very general statement. I have already tried a lot of things, so I need instructions that are more specific. Thanks.
Modified by faithdwsn
In your iframe tag, the src attribute somehow disappeared. Try changing frame-ancestors= to src= and see whether that works for you.
src was originally the way it came coded in which the iframe was not working. In an attempt to try something to fix it -- the CSP recommends people change it to frame-ancestors, which I tried among many other things from the CSP MDN documentation page.
The src= does not work frame-ancestors= does not work frame-src= does not work, etc....
I tried all that, plus some, before I went came onto this forum. For example, here is the new Console log message after changing it back to src= As you can see there is still a blank spot on the page.
Modified by faithdwsn
Chosen Solution
Hi faithdwsn, it works for me. I notice toward the right end of your toolbar what I think is the icon for the "Facebook Container" extension. Are you sure that isn't interfering?
No problem here with the iframe once I disable Tracking Protection.
Did you try Safe Mode?
If you use extensions ("3-bar" menu button or Tools -> Add-ons -> Extensions) that can block content (Adblock Plus, NoScript, Disconnect, Ghostery, Privacy Badger, uBlock Origin) always make sure such extensions do not block content.
- make sure your extensions and filters are updated to the latest version
- https://support.mozilla.org/en-US/kb/troubleshoot-extensions-themes-to-fix-problems
Firefox shows an highlighted shield icon at the left end of the location/address bar in case Tracking Protection is blocking content.
- click the shield icon for more details and possibly disable the protection
You can check in the Web Console what content is blocked.
- "3-bar" menu button or Tools -> Web Developer
- https://support.mozilla.org/en-US/kb/enhanced-tracking-protection-firefox-desktop
The Facebook container apparently was causing the embedded post to be blocked on the page. Thank you so much for suggesting the idea that fixed it! Thank goodness it worked!
It is frustrating that Facebook makes people have to take down the Facebook Container in order to get websites to work -- since I really wanted to keep the container up to keep Facebook from tracking online.
At least my website works again on my browser, so I can do site testing again.
Modified by faithdwsn