Chunking Large Uploads in Livewire
This episode is for members only

Sign up to access "Chunking Large Uploads in Livewire" right now.

Get started
Already a member? Sign in to continue
Playing
12. Changing over the file path for security

Episodes

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

Transcript

00:00
OK, so I said we'd come back to this potential security issue with the file path that we're effectively broadcasting to the client side.
00:07
Let's just remind ourselves of what that looks like. So if we come over to our uploader component and we find the event here where we get the response back, let's just take a look at what this is.
00:18
So we'll grab this. We'll go ahead and console log this out. Remember, this is all public coming through to the client. So we need to be really, really careful.
00:27
And let's choose one of these files and head over to the console. So let's cancel this off and choose another file here. We've got an error here, which we can fix up
00:36
as well in the next episode. Let's hit Upload here and just wait for this. And there we go. So this is revealing a lot about our directory structure, which
00:45
is not what we want to do. So let's go and figure out how we can kind of make this a little bit more secure. So instead of get real path, what we're going to do
00:55
is switch this over to get file name. We know that all of our chunks are always uploaded to this directory as they are being pieced together.
01:04
So the file name is really all we need. Now, if we do this now and if we change this over, of course, what is going to happen is when we upload this, it's not going to be able to find that file when
01:15
we try and reconstruct a file after this has been pieced together. So if we go over to our upload component here and we go up to where we are piecing this back together,
01:26
instead of the path, which is now just the file name of this, we now need to go into the storage directory and pick up that. So what we can do is we can use the storage path helper here
01:37
and wrap that in path. And then just before that, we can choose where this is. Now, that's under app and chunks and then the file name. So path technically is now the file name.
01:48
Let's keep it at path. So now, all we're broadcasting to the client is the name of the temporary file, which isn't a massive deal.
01:56
And then we're looking this up directly in our app from the backend. So let's go and just try this one more time and we should have this issue fixed.
02:03
And let's wait for that to finish. And there we go. So a little bit more secure now with not broadcasting the entire file structure of our application.
13 episodes• 53 mins

Overview

Effortlessly handle large file uploads in your Livewire apps with chunked, resumable uploading.

We’ll cover the entire upload process, display a progress bar, then add the ability to pause, resume and cancel uploads.

From there, you’ll be able to handle huge file uploads anywhere in your applications.

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

Episode discussion

No comments, yet. Be the first!