Geek asks and answers

Safari video file element does not trigger an error event in 403 response

I am trying to download video from S3, which may or may not be transcoding at that time. While it is still being processed, I get a 403 response. Every other browser that I am testing (Chrome / Firefox / IE) fires an error event, so I can show the message to the user as follows:

var video = document.createElement('video');
video.onerror = function (e) {
// Show the user a message...
};
video.src = videoURL;

But Safari (on OSX) just writes to the console without triggering an event.

Failed to load the resource: the server responded with a status of 403 (Forbidden)

It will fire if I make video.src the URL of the garbage that will not lead to anything other than 403.

Is there any other event that I can listen to or another way to alert the user? I know that I could make a separate ajax request for the video and check the response, but I would like to avoid the overhead.

+3
source share
1 answer

This is a bug in Webkit.

We handle this by first creating a HEAD request to check the status of the file before trying to download the video. Adds back and forth, but usually pretty quickly:

$.ajax({
  type: "HEAD",
  url: video_filename,
  success: loadVideo,
  error: handleError
});
0
source

More articles:


All Articles