TUS server not returning the correct content-type for video or audio file

Tus
1

Hey guys;

After uploading an audio (mp3) or video (mp4) file to the TUS server (self hosted on heroku) and then trying to download the file using the TUS url (in order to see in a player) it seems the content-type is set to “application/octet-stream” rather than its actual mime type.

If I upload an image or a pdf file the correct mime type is returned.

The player then doesn’t allow playing it.

Any pointers appreciated.

2

What version of tusd are you using (you can get the version by running tusd -version)? Also, does it play back if you upload the files to our public demo at https://tus.io/demo.html?

3

Hey Marius;

It seems like when I upload on the demo site and then hard code the resulting tus.io url into my component the request also has the response content-type set to “application/octet-stream”

tusd -version results in the following output:
Version: n/a
Commit: n/a
Date: n/a

I think because this is code running from a git check out. Is there another way I can get the version for you?

4

That’s indeed a bug, thanks for reporting it. It should be fixed in https://github.com/tus/tusd/commit/a045b8c4fced6b31c9a7a89ecea754bc1764ffb5, so please upgrade to the latest version from master.

5

Excellent, thanks Marius!

6

So it it looks like the content-type is returned correctly now, which is great…however the VideoJS viewer seems to still not think it can handle it, perhaps because it can’t parse out the file’s extension based on the URL.

7

Using the HTML Video tag I am able to play back a video from tusd (see JS Bin - Collaborative JavaScript Debugging).

I don’t know about VideoJS, so I can’t comment on that. But there is no way using only tusd to have the file extension in the URL. You might be able to achieve that with a reverse proxy, such as nginx, but standard tusd is not capable of that.

8

So the VideoJS player allows you to pass in a mime-type explicitly (otherwise it uses the file extension) so I ended up just using an ajax call to the file and then pulling the “content-type” out of the header like so:

const req = new XMLHttpRequest()
req.addEventListener('loadend', function(event) {
  self.setState({
    loading: false,
    mimeType: this.getResponseHeader('content-type')
  })
})
req.open('GET', url)
req.send()

That’s going to work for now at least…

Thanks again @marius!

9

That’s great! Glad to read that you found a solution!