TokenMismatchException Laravel Contact Form

Question

I understand that you need a csrf_token() as posted in other questions/answers, but what if I was making calls from an external server that can't get the token?

First time building anything in Laravel. I am just building a simple ajax contact form to get familiarized with it.

Here's my JS (there will be some client side processing so I need individual values instead of just serializing it straight up)

$('#contact-form').on('submit', function(e){

    e.preventDefault();

    $.ajax({
        type: 'POST',
        url: 'forms/contact.php',
        dataType: "json",
        data: {

            name: encodeURIComponent($("#contact-name").val()),
            email: encodeURIComponent($("#contact-email").val()),
            phone: encodeURIComponent($("#contact-phone").val()),
            subject: encodeURIComponent($("#contact-subject").val()),
            message: encodeURIComponent($("#contact-message").val())


        },
        success: function(data) {

            alert(data.message);

        }

    });

});

Here is my Route (which is in web.php)

Route::post('forms/contact.php', 'ContactController@send');

And here is my Contact Controller's main public function "send"

public function send(Request $request){

    return response()->json([
        'result' => true,
        'message' => 'success'
    ]);
}

Main goal right now is to just get a successful message back to the form.

...and would anyone know how I would return validation back to the form using something like this?

    $this->validate($request, [
        'name' => 'required',
        'email' => 'required|email',
        'message' => 'required'
    ]);

I apologize, I picked up Laravel yesterday so I'm super noob

Possible duplicate of Laravel csrf token mismatch for ajax POST Request — aynber
– aynber, Commented May 1, 2017 at 20:43
You have to pass the csrf_token through in your post request. — aynber
– aynber, Commented May 1, 2017 at 20:43

Andrew Rayner · Accepted Answer · 2017-05-01 22:22:38Z

3

Laravel has a CRSF token that requires you to pass along a key to the POST call which is stored in the session. If this token does not match or does not exsist, it will refuse the request. You can read more about this here

How to fix:

        name: encodeURIComponent($("#contact-name").val()),
        email: encodeURIComponent($("#contact-email").val()),
        phone: encodeURIComponent($("#contact-phone").val()),
        subject: encodeURIComponent($("#contact-subject").val()),
        message: encodeURIComponent($("#contact-message").val()),
        _token: "{{ csrf_token() }}"

edited May 1, 2017 at 22:22

answered May 1, 2017 at 20:45

Andrew Rayner

1,0641 gold badge6 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

user2287474 Over a year ago

So say I had an API built on Laravel on one server and I wanted to make calls to it from another server, how would I obtain that csrf_token? Would it just make sense to use authenticated end points?

Andrew Rayner Over a year ago

You would need to use API authentication instead.

Andrew Rayner Over a year ago

laracasts.com/discuss/channels/general-discussion/…

user2287474 Over a year ago

Ohh ok, so then this is not what I want to be doing lol. Alright this will work lovely then. I will mark as correct but for my project I will have to do the authentication then. Thank You!

user2287474 Over a year ago

...it's making me wait 6 minutes before I can mark it as correct

|

crabbly · Accepted Answer · 2017-05-01 20:56:03Z

By default, Laravel will protect you agains CSRF attacks (when using the web middleware).

Read more about it here: https://laravel.com/docs/5.4/csrf

A simple approach, is to output the CSRF token in your page, then grab the token with your Javascript code and store it to a global variable.

In your mail html page template:

<script>
    window.Laravel = <?php echo json_encode([
        'csrfToken' => csrf_token(),
    ]); ?>
</script>

Then, send it in any post, put and patch requests, in a header value X-CSRF-TOKEN.

For example, in your post call using jQuery ajax:

$('#contact-form').on('submit', function(e){

    e.preventDefault();

    $.ajax({
        type: 'POST',
        beforeSend: function(request) {
          request.setRequestHeader("X-CSRF-TOKEN", Laravel.csrfToken);
        },
        url: 'forms/contact.php',
        dataType: "json",
        data: {

            name: encodeURIComponent($("#contact-name").val()),
            email: encodeURIComponent($("#contact-email").val()),
            phone: encodeURIComponent($("#contact-phone").val()),
            subject: encodeURIComponent($("#contact-subject").val()),
            message: encodeURIComponent($("#contact-message").val())


        },
        success: function(data) {

            alert(data.message);

        }

    });
});

Collectives™ on Stack Overflow

TokenMismatchException Laravel Contact Form

2 Answers 2

6 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related