Docs

Hosted Pages Articles & FAQ

blocked, autofocusing, element, cross, origin, CSP, header, security, content, policy

“Blocked autofocusing on a element in a cross-origin subframe” due to CSP headers

40221011

2023-03-24T11:40:18Z

2023-05-10T09:15:53Z

5481

0

0

258467

“Blocked autofocusing on a element in a cross-origin subframe” due to CSP headers

“Blocked autofocusing on a element in a cross-origin subframe” due to CSP headers 

This article covers 

How do I set the Content Security Policy (CSP) headers?

How do I narrow down the restrictions as much as possible using the CSP headers?

Summary

follow the instruction from the link given below:

[[screenshot assets/images/Billing/IcKP4HMjVxO3Cl6h7cEbUJE7WobPzULFrg.png] Content security policy for the Checkout page](https://support.chargebee.com/support/solutions/articles/241740-content-security-policy-for-the-checkout-page)

script-src https://js.chargebee.com/v2/chargebee.js;

frame-src

But as a result, You can see more errors from the Chrome developer console when opening the Chargebee portal. Please see the screenshot:

Solution

In CSP headers you have currently only included Chargebee

  • If you are using any gateway, eg: Cybersource gateway, the URL will get blocked because the Cybersource CSP headers aren't being set as well, so you would need to include Cybersource headers

  • In addition to that you may need to modify your Chargebee CSP headers as laid out below:

frame-src: should always be *
script-src: depending on which payment gateway you're using, you will have to configure the CSP policy from the respective gateway
style-src: *.chargebee.com & payment gateway CSP policy

Was this article helpful?
Loading…