Updating Your Content Security Policy for Forms

One of the challenges admins can face when setting up a community is configuring the community's Content Secuirty Policy, or CSP. CSP is an added layer of security that helps to detect and mitigate certain types of attacks. Salesforce communities are often public-facing, so maintaining a Content Security Policy is a good way to improve your community's security. While very basic forms will work out-of-the-box in communities, more advanced forms may require some updates to your CSP in order to function. In this article I will cover the different places where you can configure your CSP in Salesforce, and how to enable the third-party domains required to get advanced forms working inside a community.

CSP Security Settings

To allow third-party resources in your community, the first thing you will have to update is your community's CSP Security Level. You can do this by going to the Builder for your community under:
Setup > Feature Settings > Communities > All Communities
Once you are on this page, click on "Builder" next to the community where your form is hosted:
mceclip0.png
From here, you will need to update the CSP Security level to "Relaxed CSP" by clicking on the gear icon on the left-hand side and navigating to:
Security > CSP > Security Level

mceclip2.png

A Strict CSP security level will always block all external resources, and does not allow for allowed of specific URLs. Relaxed CSP security allows you to allow external URLs for use in your community.


Images and CSS blocked by CSP

Our forms allow you to embed images on them. Most commonly, we see images used as a header for the form, or to provide additional context to a specific field or section. Because your community will be hosted in its own domain that is different than your Salesforce organization's domain, those images are technically coming from a third-party domain. As an example, I might have a community hosted at https://mycustomercommunity.force.com but uploaded images are hosted inside my Salesforce instance at https//mycompany.my.salesforce.com. because these two URLs are different, our CSP needs to be updated to allow images from my Salesforce domain.

The first indication you will notice when your CSP needs to be updated is this helpful message that should appear when viewing your form inside the community builder:
mceclip3.png
This message will include the domain that you should allow in the section marked "Blocked URI". To update your CSP and allow this domain, you will need to go to:
Setup > Security > CSP Trusted Sites

Then click on "New Trusted Site". Give the Trusted Site a name which indicates what sort of content you are allowing. I typically use something like "Hosted Form Images". Under "Trusted Site URL" you will want to include the Blocked URI without any path information. So, that would be everything from https:// to .com. You can leave out all of the part information after .com. Here is the final Trusted Site definition for the above screenshot:
mceclip4.png

That's it! Now my form's header image should display without issue. The process is largely the same for CSS. Though you should not need to permit any sites when using our built-in style editor, if you are loading CSS files through javascript you will need to allow those domains using this same process. First, find the URL in the CSP warning, then go to the CSP Trusted Sites page in Setup and add the URL.

If you are not seeing a warning in the builder, you can check the CSP Errors section inside the community builder:
mceclip6.png
Any items which have been blocked by your community's CSP settings will show up in this section.

Scripts blocked by CSP

Some advanced users may also be loading their own external javascript in their forms, or incorporating a 3rd party service service. This will require you to load javascript which is hosted outside of the community.The process for allowing scripts is slightly different than for images and stylesheets.

I am using bootstrap to demonstrate this example, but any script hosted outside of your community will require the same CSP updates:
mceclip7.png

For script resources, we need to update the CSP settings from within the community. In the security settings of the Community Builder, you will see a section titled "Trusted Sites for Scripts". Click on "+ Add Trusted Site"
mceclip8.png
Like before, I am copying the domain of the URL and placing it in the URL section of this CSP definition:
mceclip9.png
Click "Add Site" and re-publish your community.

Finally, repeat the process used for allowed images and stylesheets and add the same URL under Setup > Security . CSP Trusted Sitesmceclip11.pngAnd that's it! Hopefully this guide will help you navigate setting up your CSP Trusted Sites when setting up community forms.

Was this article helpful?
2 out of 2 found this helpful

Comments

0 comments

Please sign in to leave a comment.