How to sanitize user input with Laravel Livewire

Posted on: 17/05/2022. Last updated at: 18/05/2022


So Laravel Livewire, you've heard of it and by having a look at this post i'm hoping you love working with it too? We're off to a great start if so!

In this post i'll show you some ways to sanitize user input and it's easier than you might think. Here are a few ways to do it:

Sanitize user input in your Livewire Component

  1. Sanitize the input directly when creating or updating your model.
  2. Create a separate method and pass your input to it before creating or updating your model.
  3. Create a Form Request and call it from your $rules array

Sanitize the input directly

If the model you are creating or updating doesn't contain many fields or you simply don't prefer the other methods, you can perform your sanitization directly. Here's an example:

namespace App\Http\Livewire;

use App\Models\Review;
use Livewire\Component;
use Illuminate\Validation\Rule;

class CreateReview extends Component
{
    public $title;
    public $body;
    public $rating;

    public function submit()
    {
        $this->validate([
            'title' => ['required', 'string', 'max:100'],
            'body' => ['required', 'string', 'max:500'],
            'rating' => ['required', Rule::in([1, 2, 3, 4, 5])]
        ]);

        $review = Review::create([
            'user_id' => auth()->user()->id,
            'title' => filter_var($this->title, FILTER_SANITIZE_STRING, FILTER_FLAG_NO_ENCODE_QUOTES),
            'body' => filter_var($this->body, FILTER_SANITIZE_STRING, FILTER_FLAG_NO_ENCODE_QUOTES),
            'rating' => $this->rating
        ]);

        session()->flash('message', 'Thanks, your review has been submitted.');
    }

    public function render()
    {
        return view('livewire.create-review');
    }
}

In the example above, I've got a Livewire component which creates a review. I want to sanitize the user input which is the review title and body. You can simply use your sanitization techniques when creating / updating the model. Nice and easy, however not the cleanest or prettiest.

Tip! You can use more advanced rules such as Rule::in(); when you do you validation inside your main submit function. You can't do this when using the $rules array method!

Create a separate method and pass your input to it

If you prefer to move your sanitization outside of your main submit method, you can create a separate method and do the sanitization from there instead. Using the review component, let's amend it slightly:

public function submit()
    {
        $this->sanitize();
        
        $this->validate([
            'title' => ['required', 'string', 'max:100'],
            'body' => ['required', 'string', 'max:500'],
            'rating' => ['required', Rule::in([1, 2, 3, 4, 5])]
        ]);

        $review = Review::create([
            'user_id' => auth()->user()->id,
            'title' => $this->title,
            'body' => $this->body,
            'rating' => $this->rating
        ]);

        session()->flash('message', 'Thanks, your review has been submitted.');
    }

    public function sanitize()
    {
        $this->title = filter_var($this->title, FILTER_SANITIZE_STRING, FILTER_FLAG_NO_ENCODE_QUOTES);
        $this->rating = filter_var($this->rating, FILTER_SANITIZE_STRING, FILTER_FLAG_NO_ENCODE_QUOTES);
    }

In this example we've created a sanitize method and we call it before our validation step, as we still want to know if the sanitized data will pass validation. We've also tidied up our create method.

Create a Form Request and call it from your $rules array

I picked this one up from Micheal Rubel and his fantastic Livewire Best Practices.

Since Livewire doesn't currently support Form Request (But it looks like its being worked on) you can't do all your usual validation and sanitization in the livewire component. However what you can do is return the form request from the $rules array like so:

public function rules(): array
{
    return (new ReviewRequest)->rules();
}

Using this method you can create your Form Requests as you normally would and implement your own sanitization rules in the prepareForValidation() method. See the Laravel documentation on how to use it.


Picture of Daniel Ord
Daniel Ord

Building things for the Web. Follow me on Twitter or checkout my GitHub.

More Posts

Notifications delayed on Android Pie?
Just recently I noticed that notifications for WhatsApp and Facebook Messenger were not coming through. They'd only show if I...
Can't write image data to path - Intervention Image
I recently came across the following error when using Intervention Image with Laravel 5.6: "Can't write image data to path...
Upload, resize and save images using Intervention and AWS S3
Uploading images is one thing but being able to modify them is very useful, especially when it comes to resizing...
Backup MySQL database to Digital Ocean Spaces
Creating backups of your database is a no-brainer. There are lots of guides on how to do this and upload...
How to create a simple sitemap for Wink
If you're using Wink for your blog, here's how to setup up a simple sitemap to list your posts and...

Other Categories