Laravel 5.1 - Token mismatch error with iframe only in Safari browser

Question

I created several forms in laravel 5.1, now I use these forms on another site using an IFrame. These forms work in all browsers except Safari. When I try to send / send data after filling out the forms, I get the error message "CSMF Token Mismatch", I do not know what the problem is here, the csrf token is also created and sent. This only happens with the Safari browser.

Can anyone advise me on how I can get rid of this problem?

Steps to play:

create a form and then use it through an IFrame. after submitting the form, a CSRF token mismatch error occurs.

How to solve this? Please, help!

SAMPLE CODE:

<form method="post" action="/step1/{{$voucher->user_id}}" accept-charset="UTF-8"> <input name="_method" type="hidden" value="post"> {!! csrf_field() !!} <div class="row" style="margin-top:15px; margin-bottom:15px;"> <div class="col-md-4 col-xs-5 hidden"> <input name="voucher_id" type="hidden" value="{{$voucher->id}}" id="voucher_id"> <input class="form-control spin text-center qty1" name="qty" id="qty" type="text" value="1" > <input name="r_full_name" type="hidden" value="" id="r_full_name"> </div> <div class="col-md-3 col-xs-3"> <button type="submit" class="btn btn-theme"><i class="fa fa-shopping-cart" aria-hidden="true"></i> | BUY</button> </div> </form> 

this is a sample code ... AGAIN all this works fine in any other browser (FF, Chrome), but when I put these forms in an iframe on another site, I get a TokenMissmatch error ...

Answer 1

This is most likely due to how Safari handles cookies and iframes, see the answer of this question , which cites what looks like an older version of the Safari Developer FAQ , which says

Safari comes with a conservative cookie policy that restricts the cookie to only write to selected pages ("navigated to") by the user. This standard conservative policy can confuse frame-based sites that try to write cookies and fail.

This explains why you are having problems with this.

The second answer to this question offers a solution that can be found here . This is basically the same as redirecting to the domain to which the cookies belong, setting up a session and redirecting back, which is another solution that is mentioned here .

Answer 2

The csrf symbol is designed to prevent falsification of a request to use the site and what you do when using iFrame! The token prevents random websites from being sent to your site. Thus, a form using Laravel and a token will not work in iFrame!

If you want to publish the form on another site, disable the csrf token for this form or process the submission request in such a way that it passes all security checks according to your needs.

Answer 3

I think this post can help you, you can change your cookie policy.

Problem with Csfr Token

Answer 4

send token for each request

 $.ajaxSetup({headers: {'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') } }); 

Answer 5

Check if the browser is Safari and the page is the home page and the session is not running. If yes, then redirect the top url of the window to the original iframe url.

Steps to fix the Laravel marker mismatch error when using iframes in Safari using redirection:

1) Add route

 Route::get('/start-session', ' HomeController@startSession '); 

2) Add controller action

 public function startSession() { session()->put('isSessionStarted', true); return redirect('http://www.iframeparentsite.com'); // redirect to website where iframe is hosted } 

3) Install the jenssegers/agent module to discover the Safari browser https://github.com/jenssegers/agent

 composer require jenssegers/agent 

4) Use it in the controller

 use Jenssegers\Agent\Agent; 

5) Go isSafari , isHomepage and isSessionStarted to view the action on the main page.

 public function index() { $agent = new Agent(); $this->data['isSafari'] = $agent->is('Safari') && !$agent->is('Chrome'); $this->data['isHomepage'] = true; $this->data['isSessionStarted'] = session()->get('isSessionStarted'); return view('home', $this->data); } 

6) Add blade / javascript code in page layout section

 @if ($isSafari && !empty($isHomepage) && empty($isSessionStarted)) window.top.location = "{{ url('/start-session') }}"; @endif 

Redirection will occur once on the main page and will take 1/2 second