Photo Management with Laravel – Validation

cover

In this tutorial, you will validate the uploaded file.

Check out from Github

Clone the project

Project link: https://github.com/co0lsky/photo-management-with-laravel

Clone the project from Github

Configure application environment file

Duplicate the .env.example to be .env

Generate Application Key

Next, you should generate an application key. The application key helps to secure your application’s user sessions and other encrypted data.

Test

Launch your application.

Upload form

Form Request Validation

In Laravel, the validation logic is placed in the Request, not in the Controller. This separates the concern from the Controller as fulfilling the Single responsibility principle and Open closed principle. Rather than repeating the if-else validation codes, developers can focus on the business logic.

This is Laravel’s validation code.

And, my favorite is the custom request class that contains the validation logic. It saves few lines of code within the Controller and makes the request reusable.

Create a custom request

Create a new request class.

The authorize method controls the user access on using this request class. For now, you have no authorization feature. So, just return true.

The rules method holds the validation rules. You validate the photo field. It is a compulsory input and only allows image type file.

Then, you type-hint the UploadPhotoRequest on store method in PhotoController.

Now, you can test it by uploading a non-image file. The uploaded file will not store in the storage.

Display error

To provide a good user experience to your user, display an error message to tell the user the supported file types.

You display the error message above the file input.

Error message

Limit file size

Limit the photo size that user can upload is a good practice. Reasons, * preventing user upload a large file. It will slow down your website. * having a better control on your server storage. * knowing your web server capability.

All web servers have a default max file upload size. For example, Nginx’s default max upload size is 1MB and Apache’s is 2MB. PHP does have default max file upload size as well, it is 2MB.

You add a rule to allow the maximum 1MB photo to upload. In the max attribute, Laravel is measuring with the unit kilobytes. 1024 KB = 1MB

Limit file size

Laravel performs the validation logic in sequence from the rules you’ve set. If the file size is matter more than the file type, you can rearrange the rule’s sequence to verify the file size first.

MIME type

Rule image accepts all types of image, like JPEG, PNG, BMP, GIF, or SVG. However, GIF is not making any sense to be a profile picture or cover photo. Meanwhile, SVG is not a common file type to the normal user.

So, you add the MIME rule to accept JPEG or PNG only.

JPEG? What about JPG?

For the rules, JPEG includes JPG as well. If you want to learn more about the MIME types, you can refer to https://svn.apache.org/repos/asf/httpd/httpd/trunk/docs/conf/mime.types

Custom error message

Sometimes, the default error messages are not informative enough to tell the user what’s happening.

By overriding the messages method, you can set the custom error message for each rule.

Custom error message

Alright, now you have a simple upload form and some rules to ensure user submit the right file.

What’s next

Next tutorial will be talking about uploading multiple files.

If you haven’t subscribed to my email list on the homepage, do it now. I’ll notify you when the new tutorial is published.

Did I tell you that you’ll receive a series of FREE tutorials when you subscribe? Go check it out.

Stay tuned.


Also published on Medium.