Securely fixing CSP errors in iFrame widget

josh-square: The need to specify a cumbersome CSP for the iframe in the first place is not the way to go. This feature is poorly documented by the squareup developer docs and needs to be re-addressed! It took us hours to define, via trial and error runs, when we developed a new Square payment extension for OpenCart. It was a lot easier when using your quick_pay which doesn’t rely on iframe. Surely there has to be a better way forward.

Below is what we have for our CSP:

default-src 'self';
script-src 'self' https://js.squareup.com https://js.squareupsandbox.com https://web.squarecdn.com https://sandbox.web.squarecdn.com 'unsafe-inline' 'unsafe-eval';
style-src 'self' https://js.squareup.com https://js.squareupsandbox.com https://web.squarecdn.com https://sandbox.web.squarecdn.com https://fonts.googleapis.com 'unsafe-inline';
font-src 'self' https://fonts.gstatic.com https://square-fonts-production-f.squarecdn.com https://d1g145x70srn7h.cloudfront.net;
img-src 'self' data: https://js.squareup.com https://js.squareupsandbox.com https://web.squarecdn.com https://sandbox.web.squarecdn.com;
frame-src 'self' https://js.squareup.com https://js.squareupsandbox.com https://web.squarecdn.com https://sandbox.web.squarecdn.com https://connect.squareup.com https://connect.squareupsandbox.com https://api.squareupsandbox.com https://api.squareup.com;
connect-src 'self' https://connect.squareup.com https://connect.squareupsandbox.com https://pci-connect.squareup.com https://pci-connect.squareupsandbox.com;
base-uri 'self';
form-action 'self' https://api.squareupsandbox.com https://api.squareup.com;