How integrate Open edX video player

Hello Everone,

How to integrate edx video player outside of LMS?
I want to integrate edx video player into the angular-JS based web-application.

Any ideas? Thanks!!

I don’t think you can integrate the edX video player itself, but you can embed the Video XBlock which includes the video player.

Option 1: Using the Render XBlock URL:

Go to the XBlock in the courseware, click “Staff Debug Info”, and copy the XBlock ID:

Then go to https://your_lms_url/xblock/the_block_id (no trailing slash!)

For example, https://courses.opencraft.com/xblock/block-v1:OpenCraft+onboarding-dev+course+type@html+block@introduction_newcomer_congratulations_1 in the case of the example in my screenshot.

By using this URL in an <iframe>, you can get the embedded video into another web app. However, this approach requires that users are already logged in to your LMS (or that you have public course content turned on, I think).

Option 2: Using the Render Video URL:

Same thing, but use https://your_lms_url/videos/the_block_id . Put it into an <iframe>.

I am not familiar with this option but from the documentation, it sounds like it will work: “Displays a chromeless rendering of the Video xBlock. The video must be public (Public Access field set to True) by course author in studio in video advanced settings.”

Option 3: Use LTI

You can use Open edX as an LTI Tool Provider to embed videos or other content into another LMS.

2 Likes