Skip to content

Streaming media files

cjshawMIT edited this page May 24, 2017 · 3 revisions

Authoring of media files

When authors use the WYSIWYG editor to upload media (image, audio, or video) and insert it into a question / choice / feedback, the media actually gets saved in the HTML as a reference ID. For example, if you upload an image:

green dot uploaded into rich text editor

It appears in the editor with a viewable URL:

<img src="https://qbank-clix-dev.mit.edu/api/v1/repository/repositories/repository.Repository%3A577fcf7cc89cd90cbd5616fa%40ODL.MIT.EDU/assets/repository.Asset%3A591f50e3c89cd94d9fa0ba84%40ODL.MIT.EDU/contents/repository.AssetContent%3A591f50e3c89cd94d9fa0ba86%40ODL.MIT.EDU/stream" alt="asdf" />

However, this is actually saved to the server as:

<img src="AssetContent:32d8e672-c566-d7e2-d4c7-70cceca4b46d" alt="asdf" /> 

This means that the database never hardcodes a hostname or src URL for any media asset. Instead, it only ever contains a reference to an asset.

By saving a reference to an asset in the datastore, qbank can control the hostname of the "viewable" URL via configuration, and the same dataset can be used across multiple hosts or even offline. Let's dig into that more.

Media file src manipulation

Whenever qbank serves up text containing a media file (i.e. you GET the questions for a student), it changes the src attribute into one that the browser understands. It does this for transcripts, VTT files, and src tags. To create the viewable URL, qbank concatenates two things: <configured hostname> and <path to media file>. The first one is configurable, whereas the second one is generated automatically.

The returned media URL is then:

<configured hostname><path to media file>

Note that this behavior is transparent to all GET requests, like the OEA player and the WYSIWYG editor in the authoring tool. PUT and POST requests must handle this correctly, though -- the serializers in the authoring tool encapsulate the knowledge of how to properly handle this when saving data back to qbank.

Configuring media URLs

In the dlkit_configs/configs.py file, you can see the default configuration value for FILESYSTEM_ADAPTER_1's urlHostname value:

        'urlHostname': {
            'syntax': 'STRING',
            'displayName': 'Hostname config for serving files over the network',
            'description': 'Hostname config for serving files.',
            'values': [
                {'value': 'https://qbank-clix-dev.mit.edu/api/v1', 'priority': 1}
            ]
        },

In this configuration, when qbank serves up a media file, it will append the media path, generating something like:

https://qbank-clix-dev.mit.edu/api/v1/repository/repositories/repository.Repository%3A577fcf7cc89cd90cbd5616fa%40ODL.MIT.EDU/assets/repository.Asset%3A591f50e3c89cd94d9fa0ba84%40ODL.MIT.EDU/contents/repository.AssetContent%3A591f50e3c89cd94d9fa0ba86%40ODL.MIT.EDU/stream

If you want to take this data set offline, you can then grab the data bundle, put it onto a server, and update the configs.py file for the qbank deployment on that server. If the local qbank hostname is exampleserver:8080, you would set:

        'urlHostname': {
            'syntax': 'STRING',
            'displayName': 'Hostname config for serving files over the network',
            'description': 'Hostname config for serving files.',
            'values': [
                {'value': 'https://exampleserver:8080/api/v1', 'priority': 1}
            ]
        },

And for that same media file, qbank would generate the following URL instead:

https://exampleserver:8080/api/v1/repository/repositories/repository.Repository%3A577fcf7cc89cd90cbd5616fa%40ODL.MIT.EDU/assets/repository.Asset%3A591f50e3c89cd94d9fa0ba84%40ODL.MIT.EDU/contents/repository.AssetContent%3A591f50e3c89cd94d9fa0ba86%40ODL.MIT.EDU/stream