php-debugbar icon indicating copy to clipboard operation
php-debugbar copied to clipboard

Feature Request: Compatability with CSP headers

Open scottconnerly opened this issue 10 years ago • 5 comments

I understand its a bit of an undertaking, but I might as well ask.

Just implemented Content Security Policy headers on my project today. Turns out, inline-executed javascript is frowned upon. So, the whole building of the phpdebugbar js object in the footer of the page that adds tabs and data is troublesome. CSP guidelines would probably suggest executing the javascript in a separate file and having the data loaded asynchronously. Which I totally get is a PITA given that this data is inherently linked to how THIS page performed. Some sort of session flashing might work?

It would be great if I could have CSP turned on in all environments, including the ones that we've got the debugbar running in. For now though, I'll just have to turn off CSP for developers, because we so very much love your debugbar :)

scottconnerly avatar Jan 04 '16 04:01 scottconnerly

I guess this probably could be done using the Storage + Open handler, eg. link to debugbar.php?request_id=12345.

barryvdh avatar Jan 04 '16 07:01 barryvdh

A typical CSP workaround is to put the data in the page as e.g. a data attribute on some known element. E.g. <div class="hidden debugbar-data" data-debugbar="{whatever: 'data'}">. Something like that. The data doesn't go in a <script> because you can't execute scripts inline in the html when using CSP. The data is just plain JSON somewhere in the HTML. Then you have a <script src=""> for the executable script, that looks for the known element and grabs the data from the data attribute. That keeps your executable code separate from your html + data, in a static, potentially even cacheable file.

gregmartyn avatar Nov 15 '16 21:11 gregmartyn

So, this is an oldie but since I'm hitting the same problem, maybe we can find a way out?

My main problem with combining CSP and the debugbar is the script that "starts" the debugbar. It's the inline_head asset that starts like this:

<script> Sfdump = window.Sfdump || (function (doc) { var refStyle = doc.createElement('style'), rxEsc =

For starters, the <script> tag itself should have a nonce to be able to whitelist it. With that out of the way it starts by creating a <style>, which should have a nonce as well...

@barryvdh, I don't fully understand your comment but do you think it would solve these issues?

barryvanveen avatar Mar 18 '18 12:03 barryvanveen

Any news about this? The best way to fix it quickly is to calculate inline styles/scripts hashes on-the-fly and implement getScriptHashes() / getStylesHashes methods which will return arrays of strings with hashes for CSP. The other way is to accept two nonces (for scripts and for styles) and add them to script/style tags during render.

Anyway, this issue is on my priority list and I may create a PR.

spotman avatar Jan 17 '19 06:01 spotman

Fixed on #563, #439

parallels999 avatar Sep 27 '23 21:09 parallels999