Introduction

Embedded learning allows you to start an instance of your Docebo platform on any external web page, as long as you have access to its HTML and JavaScript code.

The Docebo platform instance opens as a launcher activated either when the user clicks on a button or interacts with an element - such as a link, or a string - on the external web page or it is embedded as a widget within the page. The platform instance shows the training content you, as the Superadmin, have selected for the user on the basis of the action he or she is performing, in order to provide the best learning on the fly experience, enriching it with ad hoc training.

Embedded learning is available as a web-based application on desktop and mobile platforms.

This article describes how to configure your site's content security policy header to accommodate embedded learning.

What is a content security policy

The HTTP Content-Security-Policy response header allows you to control the resources that the user agent is allowed to load for a page. Policies generally involve specifying server origins and script endpoints. Using content security policies helps guard against cross-site scripting attacks.

Strict policies

If you have a policy specifically defining rules for the directives script-src, style-src, img-src, frame-src and child-src they should add the following sources to their security policies in order to allow both Embedded learning launcher and Embedded learning Building Blocks to be viewed correctly.

Given the integrator site as integrator.example.com the full policy could look like this:

Content-Security-Policy: script-src integrator.example.com https://*.dcbstatic.com https://*.docebosaas.com 'self';
                         style-src integrator.example.com https://*.dcbstatic.com 'unsafe-inline' 'self';
                         img-src integrator.example.com https://*.dcbstatic.com https://*.docebosaas.com 'self';
                         frame-src *.dcbstatic.net;
                         child-src *.dcbstatic.net;
                         connect-src https://*.docebosaas.com 'self';

For stricter control, you can replace the general *.docebosaas.com wildcard domain with the original domain of the Docebo platform you want to use with embedded learning.

Unsafe inline in script-src and style-src

Embedded learning needs some JavaScript code to be written on your web hosting side in order to work on your web application. The best practice to handle this code is to avoid adding the unsafe-inline option in the script-src directive by encapsulating such integration code or scripts in a separate JavaScript file that is on the same domain as the site itself or located on a domain that is allow-listed in the script-src directive.

The technology on which embedded learning is built requires unsafe-inline to be added in the style-src directive.

Simple policies

If you use only some of the directives mentioned above or generally use a default-src directive to handle all the security restrictions of your web application, the domain allow-list should be the following:

Content-Security-Policy: style-src https://*.dcbstatic.com 'unsafe-inline' 'self'; default-src https://*.dcbstatic.com https://*.docebosaas.com 'self'