The Orchid Fusion VMS iframe player allows you to embed a player from either Orchid Core VMS or Orchid Fusion VMS in your web application.  This is done by adding an iframe to your web application with a source URL that tells Orchid what to display.

 

Orchid Core VMS iframe player vs Orchid Fusion iframe player

The Orchid Core VMS player has the benefit of allowing you to generate your own authorization tokens.

The Orchid Fusion VMS iframe player will automatically proxy network traffic from your Orchid Core VMS server if it is not directly accessible to the client.

 

iframe Source

Orchid Core VMS Format

http(s)://orchid-uri/?single-player=<stream-id>[&option1=true]

To obtain the stream ID for your camera perform a GET on /service/cameras and take primaryStream.id from the camera that you would like.  Please reference the Orchid API documentation for more information.

Orchid Fusion VMS Format

http(s)://fusion-uri/?single-player-orchid=<orchid-id>&single-player=<stream-id>[&option1=true]

To obtain the Orchid Id and stream ID, perform a GET on /fusion/orchids.  Take the uuid from the id field of your chosen Orchid.  Locate the camera that you would like in the cameras array on the Orchid object; the stream id is camera.primaryStream.id.

iframe Source Options

• hide-timeline=1 -- hides the timeline
• hide-controls=1 -- shows the timeline without motion seek, selection mode, or export
• single-player-ptz=1 -- enables PTZ
• show-header=1 -- show player title (automatically set if PTZ is single-player-ptz is enabled)
• force-fbgst=1 -- enable FBGST and favor it if browser supports FBGST
• disable-webrtc=1 -- turn off WebRTC capabilties.  Chrome 66+ will use low-bandwidth mode instead.
• start-time=1528209568000 -- The time the player should begin playback at in milliseconds

Authorization

Orchid Core VMS Tokens

JSON web tokens (JWTs) are used to authorize the Orchid Core VMS player.  If you are also using Orchid Fusion VMS, you can request these tokens from Orchid Fusion VMS.  This is done by first authenticating with Orchid Fusion VMS and then requesting JWTs from its tokens service.

JWT Generation

To generate your own JWTs for authentication instead of using those provided by Orchid Fusion VMS, you must first exchange a shared secret (JSON Web Key (JWK)).  The shared secret is exchanged via POST /service/trusted/issuer with an a payload

{
    "id": "01bb7740-21e1-11e6-81db-0002a5d5c51b",
    "access_token": "",
    "key": {
        "kty": "oct",
        "K": "mefcwbUTxYZHLa_EalRisajyFZD8dCLHYkcBQ1mWuiA"
    },
    "description": "",
    "uri": ""
}

The JWK must be 32 bytes (base64url encoded) and of type "oct".

If the command runs successfully an HTTP 200 is returned and Orchid Core VMS is ready to authenticate requests using JWTs that are signed with the registered JWK.  Please reference the Orchid API documentation for more information.

Orchid Fusion VMS Tokens

Orchid Fusion VMS relies on its own authentication tokens for single player authorization.  Authenticate with Fusion via /fusion/users/login and extract the token from that response.  If you are already authenticated with Fusion you can also use /fusion/users/me to get a token.  For security it is recommended that Orchid Fusion VMS authorization is done by a separate service which returns only the authorization token to your client code.

Passing Authorization Tokens

Once you have a valid authorization token you can pass it into the frame using postMessage on the iframe player’s content window.  All together this should look like this:

frame.contentWindow.postMessage({'jwt': myJwt}, '*');

Note that you should wait for the iframe’s onload event before attempting to pass your token.

 

Events

The iframe player uses the postMessage api to send events to the parent window.  Listen for these events like this:

window.addEventListener('message', function(messageEvent) {
       var event = messageEvent.data;
});

The event is structured as follows:

data: {
   event: {component: "player", type: <event type>},
   origin: <iframe's URL>
}

 

Possible event types include:

• play-jpeg -- player is attempting to play with low-bandwidth mode
• play-fbgst -- player is attempting to play using the FBGST plugin
• play-webrtc -- player is attempting to play using WebRTC
• playing -- player has begun playing video
• stop -- player has stopped playing video