Web Behaviours

Specific behaviours associated with browser environments

Configuring Permissions Policy for Embedded iFrames

When embedding an <iframe>, SDK allows to manage the permissions policy effectively. This policy dictates which features are available to the <iframe>, considering factors such as access to the device's microphone, camera, battery, web-sharing capabilities, and more, contingent on the origin of the request.

To establish a permissions policy for an <iframe>, you must define the required features within the allow parameter of the getExperience() function. This configuration is essential for ensuring that only authorised features are accessible through the <iframe>, enhancing security and user experience.

For instance, if embedding a YouTube player within an <iframe>, it's necessary to permit features like fullscreen and picture-in-picture. This can be achieved as demonstrated in the following code snippet:

import { getExperience } from '@monterosa-sdk/launcher-kit';

const experience = getExperience({
  // Specify the features to allow in the iframe.
  // In this case, enabling fullscreen and picture-in-picture modes.
  allow: 'fullscreen; picture-in-picture',
  
  // Set allowFullscreen to true to ensure compatibility 
  // with fullscreen mode in older browsers
  allowFullscreen: true,
});