Content Security Policy

SDKCurrent

Last updated: Nov 19th, 11:49pm

Content Security Policy (CSP) is a security measure that helps prevent a range of attacks on a website, including Cross Site Scripting (XSS), clickjacking, and other code injection attacks. CSP adds a special HTTP header to web pages that tells the browser to load only approved content sources for each type of resource, such as scripts, stylesheets, and images. By enforcing these restrictions, CSP limits the potential attack vectors for malicious actors.

To integrate PayPal's JavaScript SDK, you need to add PayPal's script sources to your CSP's approved list so the browser trusts the scripts to handle transactions. You reduce the risk of XSS and similar attacks by ensuring that only scripts from trusted PayPal sources can run.


Our CSP recommendation: use 'unsafe-inline'

Value Description
child-src *.paypal.com *.paypalobjects.com *.venmo.com
connect-src *.paypal.com *.paypalobjects.com *.venmo.com
frame-src *.paypal.com *.paypalobjects.com *.venmo.com
img-src *.paypal.com *.paypalobjects.com *.venmo.com data:
script-src *.paypal.com *.paypalobjects.com *.venmo.com 'unsafe-inline'
style-src *.paypal.com *.paypalobjects.com *.venmo.com 'unsafe-inline'


Example CSP

    1default-src 'self'; script-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com 'unsafe-inline'; connect-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com; child-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com; frame-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com; img-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com data:; style-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com 'unsafe-inline';

    Using a nonce instead of 'unsafe-inline'

    Using a nonce with your CSP is safer than 'unsafe-inline'. A nonce is a random string added to a script or style tag and in the CSP header, permitting specific inline scripts or styles while blocking others. This method is more secure than 'unsafe-inline', which can create potential security risks.


    Our CSP recommendation: use a nonce

    Value Description
    child-src *.paypal.com *.paypalobjects.com *.venmo.com
    connect-src *.paypal.com *.paypalobjects.com *.venmo.com
    frame-src *.paypal.com *.paypalobjects.com *.venmo.com
    img-src *.paypal.com *.paypalobjects.com *.venmo.com data:
    script-src *.paypal.com *.paypalobjects.com *.venmo.com nonce-YOUR_NONCE
    style-src *.paypal.com *.paypalobjects.com *.venmo.com nonce-YOUR_NONCE


    Example CSP

      1default-src 'self'; script-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com nonce-aus44zz6eg; connect-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com; child-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com; frame-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com; img-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com data:; style-src 'self' *.paypal.com *.paypalobjects.com *.venmo.com nonce-aus44zz6eg;

      Adding nonce to your JS SDK integration

      1. Vanilla JS
      2. React (JS)
      3. ES Module
      1<script nonce="YOUR_NONCE" data-csp-nonce="YOUR_NONCE" src="https://www.paypal.com/sdk/js?client-id=test" />
      2<script nonce="YOUR_NONCE">
      3 paypal.Buttons().render('#paypal-button');
      4</script>

      We use cookies to improve your experience on our site. May we use marketing cookies to show you personalized ads? Manage all cookies