Playing Video In Restricted SharePoint Environments

A few months back, I came across a scenario where a user wanted to play video in SharePoint pages, but the environment restricts usage of video streaming.

Solution

In this case we can use HTML5 Video Tags.

HTML5 Video

HTML5 includes the video and audio tags that allow playing multimedia without any extra plugin requirement.

Previous to HTML5,  a Flash or Media Player was required to play video or audio files. Now all HTML5 compatible browsers support the video tag by incorporating necessary multimedia infrastructure within them.

The following are the browsers & versions supporting HTML5 video and audio tags.

browser

Reference:

SharePoint & Video Tag

Coming back to our problem, perform the following activities for testing the video tag.

Open SharePoint Designer and go to Site Pages.

site pages

Choose the new HTML or ASPX option. Edit the file and add the following code inside body tag.
  1. <video width="300" height="250" controls>  
  2. <source src="/siteassets/video.mp4" type="video/mp4">  
Your browser does not support the video tag.

</video>

The code performs the following:
  • Set the Video tag with width & height
  • Specify the source as mp4 file
  • Set the error text if browser does not support video tag.

Your code in HTML file looks like below.

code

Video File

Now we need to create a video file. You can download the video file from this link.

file

Choose the MP4 file, download, rename and upload to Site Assets library.

assets

Testing

Now open the HTML file in a video supported browser. You will get the video played as shown below.

video

Now open the HTML file in a non-supported browser. You will see the following error message.

error

Note:

You can also set a preview image for the video tag. This image will be displayed in the non-play state.

Restricted Scenarios

The video restricted scenarios can be:

  1. SharePoint Restricted Content Types
  2. SharePoint Restricted File Extensions
  3. IIS Video Streaming Restrictions

References:

Summary

In this article we have explored using video tag for a restricted SharePoint environment scenario.
 
Read more articles on SharePoint:

Next Recommended Readings