2

I am using the Braintree Drop-In console, I have just recently come across Content Security Policy issue mainly in Safari browsers where it is returning the following errors and as a result causing client side scripting issues. These errors occur when the PayPal button is clicked, which produces a pop-up window and again once the pop-up window is closed to return the details back to the page.

[Error] Blocked a frame with origin "https://checkout.paypal.com" from accessing a frame with origin "https://assets.braintreegateway.com". Protocols, domains, and ports must match.

[Error] Blocked a frame with origin "https://www.paypal.com" from accessing a frame with origin "https://assets.braintreegateway.com". Protocols, domains, and ports must match.

I have been advised to enable enableCORS in the setup method which had no effect. It is also advised to modify certain directives in the pages policy,however I don't include CSP wihtin my pages so I don't think this will have any effect. ie https://developers.braintreepayments.com/reference/client-reference/javascript/v2/best-practices#using-braintree.js-with-a-content-security-policy

I did try and add some meta tags hwowever it caused more errors than before so I removed them.

Has anyone come across this issue and can suggest or provide an example how to get around this issue? It is only Safari that I am having issues with as it is sensitive to this.

Daniel James Canil
  • 306
  • 2
  • 10

1 Answers1

1

Basically these errors within Safari are essentially cosmetic – processing should not be affected.

My issue was due to an jquery ajax timeout issue in safari where I had async set to false. Braintree response was taking more than 10sec in production to return a response and as a result Safari would timeout.

Failed to load resource: Request timed out on Safari

Community
  • 1
  • 1
Daniel James Canil
  • 306
  • 2
  • 10