Problem with Livewire in an iFrame

#1

A friend and I have built a Laravel/Livewire site to help all of us who are quarantined find live streams to watch (for education, entertainment, etc.). We are in a quiet beta but you can access it at

https://findmeastream.com

The home page is a Livewire component that searches our database for streams and it works great - thanks Caleb and others who have helped me with issues getting this far. We have a friend who runs a local newspaper where he is trying to wrap our site in an iFrame on his site, so people from there can access our streams. You can see this at:

https://www.montereycountyweekly.com/events/

The problem is that if you try to search from the search bar, you will immediately get a 419 error, which is Laravel’s way of saying the CSRF token is bad or expired. I have tried adding the above domain to the $except property of the VerifyCsrfToken middleware, but that doesn’t seem to have any effect - they all immediately return a 419 error.

If you look in dev tools at the Livewire requests, the ones directly from our site have an XSRF-TOKEN cookie set and the ones from the iFrame site do not. Is this something I can do in javascript? Is there some other solution?

Thank you for your help!! (And feedback on our site welcome! :slight_smile: )

#2

If anyone happens to follow this path, it turns out that the problem was caused by how (apparently) requests are generated for content in an iFrame. The requesting host turns out not to be the site where the iFrame lives, but the same site as the iFrame source - so it’s like my own site is issuing a request to my own server. So I just put my site’s URL into the $except array inside the VerifyCsrfToken middleware, and it all worked. I’m not sure if I’ve introduced any additional security issues by doing this, but I don’t think so. (Comments welcome!)

#3

I did a deep dive into csrf a month ago or so, which was a good idea and I highly recommend everyone to do, because I thought I only kinda knew the basics of how it worked, and I was only half right at that. https://owasp.org/ is a great place to start, and computephile on youtube has a good ELI5 type of video on it. I say this to put across that I’m no expert, and there are much smarter people out there that understand this much better, and I’m just speaking in generalizations.

My probably unpopular opinion is that it’s not a big deal unless you are google/netflix/reddit/facebook size and status because you are not really protecting yourself from an attack, you are protecting a user from being tricked into doing something that they can readily do on your site, but don’t want to. Eg. update their email, delete their account, etc. Something you have programmed for them to do, someone can make your site think they wanted to do that.

  1. Your site has to be specifically targeted, and most likely your user base as well.
  2. (in most cases) you have to be using an auth system, like the one that’s built into laravel, that uses a cookie to tie their browser to their session id.
  3. The user has to be tricked into it during a window of time that their session is active on your site. (Laravel defaults to two hours.)

The csrf token system laravel bakes in for you is one of the best ways to protect your user from someone else trying to do something on their behalf without them knowing they did it.

I’m by no means saying it’s useless or unneeded, I’m saying it’s a huge edge case.

It’s like that old joke about the reason why there aren’t very many viruses for linux is because barely anyone uses it, so nobody wastes their time writing one.

#4

I am facing the same issue. I tried putting the url in the $except but it doesn’t seem to work. Did you put the entire url, with the route? My route which has to be allowed in an iframe is https://transfer.simplicity.ro/transfers/create
Thanks!

#5

I just added the ‘livewire/*’ to the $except array and now it works.