Playing Video Content Alan Smith ACTIVE SOLUTION, STOCKHOLM, SWEDEN - - PowerPoint PPT Presentation

▶
playing video content
SMART_READER_LITE
LIVE PREVIEW

Playing Video Content Alan Smith ACTIVE SOLUTION, STOCKHOLM, SWEDEN - - PowerPoint PPT Presentation

Jan 19, 2023 360 likes •529 views

Playing Video Content Alan Smith ACTIVE SOLUTION, STOCKHOLM, SWEDEN youtube.com/user/CloudCasts Streaming Endpoints and Streaming Locators Streaming Endpoint Smooth Streaming HLS Multi-bitrate Streaming Asset Endpoint MPEG DASH

slide-1
SLIDE 1

youtube.com/user/CloudCasts

ACTIVE SOLUTION, STOCKHOLM, SWEDEN

Alan Smith

Playing Video Content

slide-2
SLIDE 2

Streaming Endpoints and Streaming Locators

slide-3
SLIDE 3

Streaming Endpoint

Streaming Endpoint Multi-bitrate Asset

HLS MPEG DASH Smooth Streaming

slide-4
SLIDE 4

Streaming Endpoint

Streaming Endpoint Multi-bitrate Asset

HLS MPEG DASH Smooth Streaming

slide-5
SLIDE 5

Streaming Endpoint

Streaming Endpoint Multi-bitrate Asset

HLS MPEG DASH Smooth Streaming Download

slide-6
SLIDE 6

Streaming Locator

Streaming Endpoint

HLS MPEG DASH Smooth Streaming HLS MPEG DASH Smooth Streaming HLS MPEG DASH Smooth Streaming

Assets Streaming Locators

slide-7
SLIDE 7

Streaming Locator URLs

https://{ServiceName}-{Location}.streaming.media.azure.net/{GUID}/{Title}.ism/manifest https://{ServiceName}-{Location}.streaming.media.azure.net/{GUID}/{Title}.ism/manifest(format=mpd-time-csf) https://{ServiceName}-{Location}.streaming.media.azure.net/{GUID}/{Title}.ism/manifest(format=m3u8-aapl)

Smooth Streaming DASH HTTP Live Streaming (HLS)

slide-8
SLIDE 8

Azure Media Player

slide-9
SLIDE 9
slide-10
SLIDE 10

Lobomantics Scenario

slide-11
SLIDE 11

Azure Media Player

slide-12
SLIDE 12

<head> <title>Media</title> <meta charset="utf-8"> <!-- Links to player CSS and script --> <link href="//amp.azure.net/libs/amp/latest/skins/amp-default/azuremediaplayer.min.css" rel="stylesheet"> <script src="//amp.azure.net/libs/amp/latest/azuremediaplayer.min.js"></script> </head>

Linking to Azure Media Player resources

http://amp.azure.net/libs/amp/latest/docs/index.html

slide-13
SLIDE 13

<video id="ideaVideo1" class="azuremediaplayer amp-default-skin" autoplay controls width="1280" height="720" poster="images/girl.png" data-setup='{"nativeControlsForTouch": false}'> <source src="Streaming URL" type="application/vnd.ms-sstr+xml" /> <p class="amp-no-js">Get HTML5!</p> </video>

At Attrubute Usa Usage id

Unique ID for video within a page

class

Classes for media player and player skin

autoplay

Start video playback when page loads (not supported on mobile devices)

controls

Display media player controls

width

Width of player in pixels

height

Height of player in pixels

poster

Image to display before video begins playing

data-setup

Unique delivery policies of stream

source url

URL of media asset streaming locator

source type

MIME type of video stream

slide-14
SLIDE 14

Demo

t h s

Creating Streaming Locators

  • Creating Streaming Locators in the

Azure Portal

  • Creating Streaming Locators using the

Media Services SDK

slide-15
SLIDE 15

Demo

t h s

Playing Video with the Azure Media Player

  • Adding links to Azure Media Player

resources

  • Adding the Azure Media Player to a

Web Application