OpenTV Player SDK for Browsers Integration

This guide describes how to instantiate and use the OpenTV Player SDK for Browsers and provides guidance on using the features of the player. The SDK includes complete code examples to demonstrate the basic and advanced features.

Player hosting and configuration

• The hosted video must be configured to allow Cross-Origin Resource Sharing (CORS) if not hosted on the same origin, such as a different domain or subdomain.

• The OpenTV Player SDK for Browsers uses cryptographic functions provided by the browser. Some browsers might inhibit this functionality if not running over HTTPS; Nagra recommends only deploying OpenTV Player SDK for Browsers over HTTPS.

• A licence will be required to use the player, see Player licencing below.

Creating a simple player

The player can be integrated by hosting a few lines of HTML on an HTTP server. This file (and the linked JS and CSS files) must be hosted on a web server for this to work.

Hosting on localhost is satisfactory for development and testing purposes.

<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" href="dist/opy-sdk-browser.css" />
		<script src="dist/opy-sdk-browser-all-debug.js"></script>
	</head>

	<body>
		<video
			class="video-js vjs-default-skin vjs-16-9"
			id="videoPlayer"
			controls
			crossorigin="anonymous"
		></video>
		<script>
			document.addEventListener(
				"DOMContentLoaded",
				function initializeRefApp() {
					let playerInstance = otvplayer(
						"videoPlayer",
						// options
						{},
						// loaded callback
						function loadedCallback() {
							// Initialise the toolkit plugin (if not initialised by the player options)
							playerInstance.otvtoolkit();
							source = {
								src: streamUrl,
								type: "application/dash+xml"
							};
							playerInstance.src(source);
						}
					);
				}
			);
		</script>
	</body>
</html>

Player licencing

You need a licence to use the Open TV Player. This licence:

• Enables some or all of the Player's features, for some or all supported platforms.
• May or may not have an expiry date.
• Displays a semi-transparent overlay or watermark if it is a trial licence.

You cannot initialise the player without a valid licence. This is supplied as part of the Player SDK deliverable.

To apply the licence to the player initialisation, do one of the following:

• Place the opy_licence licence file in the same folder as the page on which the player is integrated (alongside the .html file).

• Specify the licence as the value for the licence key in the initialisation block for the otvtoolkit plugin:

  playerInstance = otvplayer(
      "videoPlayer",
      // options
      {
          html5: {
              nativeCaptions: nativeCaptionsSetting,
              nativeAudioTracks: nativeAudioTracksSetting
          },
          plugins: {
              otvtoolkit: {
                  licence: "eyJhbGciOiJSU...",
                  drm: drmSystem
              }
          }
      },
      // loaded callback
      function loadedCallback() {
          ...
      });
  

Callback Mode

An alternative integration style where callbacks can be delegated to complete DRM licence acquisition actions is described separately.