webMethods Developer Portal CSP (Content Security Policy) Troubleshooting

Introduction

A Content Security Policy (CSP) is a security standard that provides an additional layer of protection from cross-site scripting (XSS), clickjacking, and other code injection attacks. It is a defensive measure against any attacks that rely on executing malicious content in a trusted web context, or other attempts to circumvent the same-origin policy.

webMethods Developer Portal is protected with CSP. So if you wanted too use the custom font (refer Customization section in documentation) or if you want to use SAML SSO with redirect binding then there would be set of CSP issues reported in browser console. The browser would not allow to load the scripts. In this tutorial you will learn how to configure the CSP so that external URL can be added as trusted source.

Pre-requisite

  • Basic knowledge of CSP
  • Basic knowledge of webMethods Developer Portal

Steps to follow

In this tutorial we will try adding custom font, so it will be get restricted by browser and we would see the steps to enable it.

Step 1: Adding font in theme

Go to Administration → Themes, click customization button of your current theme

Navigate to Theme → Font subsection

Provide the external font URL and font name

Step 2: Activate theme

Now activate the theme

After activating you’ll notice font’s are not loaded in appropriate style. If you check the browser developer console it would have reported unable to load the font script due to CSP policy

Step 3: Adding the external font URL as trusted source

1. Shutdown the webMethods Developer Portal

2. Based on the deployment there are different ways to edit the CSP Policy

2.A. On-premise i.e Local installation

Navigate to <Installation_Location>/profiles/CTP/configuration you would find dpo_wrapper.conf open to edit
image

Add following java property [wrapper.java.additional.2006=-Dportal.server.config.headers.content-security-policy=“default-src ‘self’; img-src * ‘self’ data:; object-src ‘none’; child-src * mailto: tel: ms-word:; font-src ‘self’ https://fonts.gstatic.com; script-src ‘self’; style-src ‘self’ ‘unsafe-inline’ https://fonts.goggleapis.com; form-action ‘self’ *.okta.com; frame-ancestors ‘self’;”]. In this example for font i’ve added google font URL similarly for SAML SSO case i’ve added Okta URL

2.B. Docker Deployment

In docker deployment, as part of docker run cmd you can pass the CSP value as environment variable ex:
docker run -d -e SPRING_ELASTICSEARCH_REST_URIS="http://lean-elastic:9200" -e PORTAL_SERVER_CONFIG_HEADERS_CONTENT_SECURITY_POLICY="default-src 'self'; img-src * 'self' data:; object-src 'none'; child-src * mailto: tel: ms-word:; font-src 'self' https://fonts.gstatic.com; script-src 'self'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; form-action 'self' *.okta.com; frame-ancestors 'self';" --name portalbundle --net lean-network -p 80:8083 -p 443:8084 kub-sic/devportal:10.15.0.0.126

3. Start the webMethods Developer Portal

Step 4: Validate the change

Open the developer tool in browser you should be able to see the CSP you provided as part of response headers

Now activate the theme

The font should be loaded properly. You won’t be seeing CSP error in browser console