Manual Crop uses inline Javascript in a few places, namely some "onmousedown" attributes and href="javascript:void(0)".

If your website uses a Content Security Policy (CSP) to prevent inline Javascript, then ManualCrop won't work, unless you're willing to add "script-src unsafe-inline" to your CSP configuration, which kind of defeats the point of CSP (because it won't be able to prevent XSS attacks anymore).

I'll post a patch in a moment that converts all the inline Javascript to non-inline code in the manualcrop.js and allows Manual Crop to work with CSP in my limitted testing.

CommentFileSizeAuthor
#5 manualcrop-csp-3177209-5.patch8.91 KBdsnopek
#2 manualcrop-csp-3177209-2.patch6.97 KBdsnopek

Comments

dsnopek created an issue. See original summary.

dsnopek’s picture

dsnopek
he/him
Primary language English
Location USA
commented
Status: Active » Needs review
StatusFileSize
new manualcrop-csp-3177209-2.patch6.97 KB

Here's a patch that's working in my limited testing! Please let me know what you think. Thanks!

cboyden’s picture

cboyden commented
Status: Needs review » Needs work

Testing this for #3177807: Manual Crop doesn't work with strong Content Security Policy. In the inline version, the button text changes from "Crop" to "Crop (cropped)" if a crop has been previously applied. This is lost with the non-inline version.

cboyden’s picture

cboyden commented

The CSP error that seems to be preventing this change is:

jquery.min.js?v=1.10.2:5 Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval' ...". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.

trigger @ jquery.min.js?v=1.10.2:5
(anonymous) @ jquery.min.js?v=1.10.2:5
each @ jquery.min.js?v=1.10.2:4
each @ jquery.min.js?v=1.10.2:4
trigger @ jquery.min.js?v=1.10.2:5
(anonymous) @ manualcrop.js?qim4ze:29
each @ jquery.min.js?v=1.10.2:4
each @ jquery.min.js?v=1.10.2:4
$.fn.once @ jquery.once.js?v=1.2:55
ManualCrop.init @ manualcrop.js?qim4ze:28
attach @ manualcrop.js?qim4ze:943
(anonymous) @ drupal.js?qim4ze:112
each @ jquery.min.js?v=1.10.2:4
Drupal.attachBehaviors @ drupal.js?qim4ze:110
(anonymous) @ drupal.js?qim4ze:607
c @ jquery.min.js?v=1.10.2:4
fireWith @ jquery.min.js?v=1.10.2:4
ready @ jquery.min.js?v=1.10.2:4
q @ jquery.min.js?v=1.10.2:4

It's triggered when the page with the Crop button on it is loaded. Tested on the /file/FID/edit page and in the Media modal when uploading a new file using Media.

dsnopek’s picture

dsnopek
he/him
Primary language English
Location USA
commented
Status: Needs work » Needs review
StatusFileSize
new manualcrop-csp-3177209-5.patch8.91 KB

It looks like there were some inline "onchange" attributes that I missed in my first pass through the code. Here's a new patch!

cboyden’s picture

cboyden commented

Thanks for the update, this is working with our strict CSP settings now.