CODEWITHSUNDEEP
laravel-livewire
Autodesk
Autodesk

Reputation: 711

Does without using @csrf on livewire component makes my form vulnerable?

Since I can use wire:click to submit a livewire component properties, why bother to use <form>?

Using the document ContactForm as a example.

class ContactForm extends Component
{
    public $name;
    public $email;
 
    protected $rules = [
        'name' => 'required|min:6',
        'email' => 'required|email',
    ];
 
    public function updated($propertyName)
    {
        $this->validateOnly($propertyName);
    }
 
    public function saveContact()
    {
        $validatedData = $this->validate();
 
        Contact::create($validatedData);
    }
}

In the beginning, when I wrote a livewire form component, it look like this:(using <form> and @csrf)

<form wire:submit.prevent="saveContact">
    @csrf
    <input type="text" wire:model="name">
    @error('name') <span class="error">{{ $message }}</span> @enderror
 
    <input type="text" wire:model="email">
    @error('email') <span class="error">{{ $message }}</span> @enderror
 
    <button type="submit">Save Contact</button>
</form>

But now, I write a form like this:(without <form> and without @csrf)

<div>
    <input type="text" wire:model="name">
    @error('name') <span class="error">{{ $message }}</span> @enderror
 
    <input type="text" wire:model="email">
    @error('email') <span class="error">{{ $message }}</span> @enderror
 
    <button type="button" wire:click="saveContact">Save Contact</button>
</div>

All my member-restricted forms require users to login before fill and submit forms. So those forms are under protection of middleware('auth') and livewire request/response checksum.

But without using <form> and @csrf, especially without @csrf, does it still makes my form more vulnerable? Thank you!

Upvotes: 1

Views: 3488

Answers (1)

Qirel
Qirel

Reputation: 26450

The security documentation for Livewire outlines how it's internal security is handled. This describes the usage of the "checksum", which ensures that the data between each request is not tampered with.

However it does not mention CSRF explicitly. None the less, since each subsequent Livewire request is a POST request to the /livewire/message endpoint, it must be protected with a CSRF token.

If we check the source-code, you'll see that it does indeed pass in the CSRF token. And since Livewire uses normal Laravel routes, it will by default validate the token in the backend - ensuring all requests are protected.

This means that when using any Livewire action such as wire:click or wire:submit, you don't have to worry about CSRF, as its handled by the framework.

Upvotes: 12

Related Questions