Multiple Drag And Drop File Uploading and Processing with Inertia
This episode is for members only

Sign up to access "Multiple Drag And Drop File Uploading and Processing with Inertia" right now.

Get started
Already a member? Sign in to continue
Playing
15. Encoding a video with FFmpeg

Episodes

0%
Your progress
  • Total: 1h 56m
  • Played: 0m
  • Remaining: 1h 56m
Join or sign in to track your progress

Transcript

00:00
Okay so we are now going to look at encoding this video, remember this action could be absolutely anything that you're doing on the back end that just takes a while so feel free to just in the back of your mind think about how you would implement this if it was something completely
00:13
different, now before we do anything in terms of creating this, the rest of this job that we already have, this encode video job, we need to talk about queues because we don't want to do this directly as the file gets uploaded, at the
00:27
moment if we were to start encoding the video which could take an hour, this is going to be running and the user will have to sort of wait around, we want this to be pushed to our queue, so a really easy way just when we're locally developing
00:40
to use queues is a database table to keep track of your jobs, now to go ahead and create that we're going to go and say queue table and ask some command and that's going to create a migration for us that when we run will create a queue
00:57
table for us, so let's go over to our database and you can see now we've got jobs in here and we've also got failed jobs so if any of these fail we're not going to see an error on the front end because they're going to be in our queue
01:09
but we can check the failed jobs table, so we've got our table now all we want to do now is switch over our queue connection to database and that's pretty much what we need to do, so now when we dispatch this job in here this encode video job this is
01:25
going to be pushed to our queue rather than being done sync, so let's go ahead and implement the ability ability to encode this video, so to do this we're going to use a package called laravel ffmpeg, if you're not familiar with ffmpeg it's a
01:42
piece of software that allows you to manipulate, convert, do pretty much anything with video and audio, so this just integrates this really nicely into laravel so we can use it directly within our file system stuff, so we're going to go ahead and just pull
01:55
this in of course and i'm going to show you exactly how to use this, really importantly we're going to go ahead and publish our config because we're going to need to switch over where our ffmpeg installation is, now if you don't already have ffmpeg installed
02:09
go ahead and read the docs for that and you should just be able to run this in your terminal and see this is installed, now what we need to do is come over to config and laravel ffmpeg and switch over the binaries
02:24
for both ffmpeg and ffprobe, so i'm going to go ahead and copy these ffmpeg binaries and probe over to my emv and then i'm going to work out where these live on my system, so depending on your operating system you can use something like which and
02:42
then give the name of this and you can see here that i've installed these with homebrew, so all i need to do is just move this over to here and we're going to do ffmpeg here and then take the directory that that is installed in
02:56
and put it there, that's really important because this package needs to actually use ffmpeg on your system to be able to perform its actions, so now it's going to be able to find both of these and we should be good, okay so to use this package let's go
03:11
directly within our encode video job and get started, so we're going to say ffmpeg which is the facade for this package and we're going to say from disk and that's going to be from our public disk remember our video that got uploaded and the video path
03:28
was stored in our public file system so we need to make sure that we use that and i'm just going to make sure i've pulled in the right one here and just switch this over, so let's get rid of the default one and we'll get rid of that alias as well, okay great,
03:44
so we're pulling a video file from a public disk where do we get that from, well we have access to our video directly within this job so we're just going to go ahead and pull in the video path for this then we're going to choose to
03:58
export this because we're going to be encoding this to a different format but we need to know where we're placing this after we're done and that's just going to be back in the public directory so now we're going to use the in format method to pass in a format directly from
04:13
the php ffmpeg library so let's go ahead and say ffmpeg and it should be under format let's find that and let's just make sure we pull this in like this and then we've got video and then we've got
04:31
x264 so we're basically opening it exporting it back to public but we are converting it to an mp4 format okay so now that we've done that we just want to go ahead and finally say save and we want to save this to a new location so we're going to put this
04:47
directly into the videos folder in our public directory so exactly the same as where it was before we're going to use a uuid to generate out a file name but this time we're going to give it an mp4 format so that's pretty much the whole process of going through and encoding a video
05:03
with ffmpeg but using this laravel library for this now before we run this and see if it actually works i'm going to go over to my videos directory here i'm just going to delete that because we've got a ton of videos that have already been uploaded
05:16
and i'm also going to come over to the videos table and just get rid of everything in there just so we can start fresh okay so now what's going to happen is when we upload this file that job is going to be put into our queue
05:30
we'll run our queue worker which will start to process that in code and we'll just see if it works so i'm going to go ahead and choose one of the smallest video files i have here just so it's a little bit quicker and we're going to wait for that to upload
05:44
okay so now that's uploaded let's go over to our database and over in jobs we should see this job in here on our default queue with all of that payload information waiting to be run so what we can now do is start off our queue worker so we're going to go ahead and say php
06:01
artisan queue work and that should start to run through and process that video file and let's just remind ourselves where these files are so we've got the default one in here and this is the new one that's being
06:16
created by that job so once this job has finished that will now be a converted video so if we head over to our database table you can see that this is still running i'm just going to leave this for a second and then i'll be back with you
06:30
okay so i've just gone ahead and refreshed this and it kind of looks like that job is done but what's actually happened here is this job has failed just because of the timeout of our jobs so if we just look at the payload here or the exception let's go ahead and copy
06:46
and paste this directly into here you can see that we have got a time out here so we're going to need to increase this time out for this job because of course we have a huge job here so let's go up to the top here and let's go ahead and set the time out
07:02
here to zero so that will just keep running this job will keep running there are tons of things that you can do within jobs within laravel and in queues that are probably a little bit more efficient but we're just going to go ahead and set the time out to zero for
07:14
now okay so let's go and just rerun our queue worker and we're going to re-upload this video so let's set that small one and once that has finished we should see that job back in there
07:29
again okay so that job is back in here once again i'm just going to wait for a little while until this is finished we'll check that this is encoded and then we will get on to actually broadcasting the process of this later okay so i've just given the database a
07:44
refresh and that job has now disappeared if we head over to our terminal we can see that that has done it took about three minutes here and what we should now have now that that has been successful is a successfully encoded video great now it's a little bit annoying at the
07:58
moment because we're not seeing the progress on the client side so what we're going to do is head over so we can actually see this progress being broadcast to the client side once this starts so let's jump over and do that now
17 episodes•1 hr 56 mins

Overview

Build a multiple file chunked uploader in Inertia with the ability to pause, resume and cancel uploads. We’ll also be able to edit metadata (like the title and description) for each upload — even while they’re uploading and processing.

In the second half of the course, we’ll learn how to queue and process uploaded files on the backend (like encoding videos), and in realtime, report back to the client with progress updates using WebSockets.

It’s everything you need to know to upload and process large files in Inertia.

Alex Garrett-Smith
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!

Comments

No comments, yet. Be the first to leave a comment.