ApathyBear ApathyBear - 1 year ago 73
Ajax Question

AJAX: JWT auth for video load via src

I am requesting a video from an API that requires JWT web tokens:

// when the ajax call is done (the tolken is recieved )
getAccessToken.done(function(data) {

var d = JSON.stringify({'fpath': fpath})
// get the download url
var downloadurl = $.ajax({
type: "POST",
url: "https://gcp.inbcu.com/download",
beforeSend: function(xhr){
xhr.setRequestHeader("Authorization", "JWT " + data.access_token);
contentType: 'application/json',
data: d,
success: function(response){
$('#video-source').attr('src', response.url)
error:function(jqXHR, textStatus, errorThrown) {
console.log("request for download url failed: ", textStatus, errorThrown, jqXHR);
dataType: 'json'

This ajax call itself is successful (200) and returns the proper values. Mainly it returns a url to set the source of the video.

Problem is, the video
attempts to access the url and doesn't have permission (no jwt token/ authorization). How am I supposed to load the video with the proper permission when loading the src of a video? Is this possible?

Answer Source

As the answer to a similar question explains, this isn't possible. Either you need to do it as an AJAX request, which you previously did, but which was slow, or, you need to add additional methods for the server to accept authentication.

Regarding these auth options, you could add a session cookie that the server can check, or append the token to the video url, like response.url + '?token=' + token.