Best way to manage liveviews login auth

Hello!
So, I started playing with liveviews for a new project. And I have a couple of questions, and I would love if someone can point me in the right direction.

I need the user to login (I have a login service) My question is how to authorize the “socket”, I know that when using websockets we have the connect/2 callback and I can make some auth logic there, but the liveview should be treated as a websocket?

Or I need to add auth information to the session like a normal webpage?

When using reactjs in the frontend, I make use of JWT stored in localStorage

I am kind of lost with this :\

Thanks !

Hi @beto,

There are a few discussions on the forums covering this and I still think the best model is yet to emerge. The most common approach seems to be to authenticate using the traditional approach and pass the credentials into the liveview via router config (there have been a couple of changes to make this easier in recent liveview releases, but the concepts are covered by @Softknobs comment here: LiveView authentication failed: how to redirect to login page?)

If the liveview is configured in a protected router pipeline you should be good to go. Token exchange with the browser to confirm it is a valid websocket connection is handled by LiveView for you.

There are a few outstanding issues - expired sessions don’t kill an active liveview - there’s a pretty detailed discussion here on the issue plus approaches to resolve it: How would you deactivate / disconnect / sign out a specific user server side with live view?

Also, it’s worth taking a look at this Pow issue https://github.com/danschultzer/pow/issues/271 (Pow is a very good authorisation library) - it provides plenty of background.

I hope that doesn’t make you more lost! TLDR; authenticate using old fashioned session controllers, pass user_id into liveview, ensure liveviews are in protected router pipeline.

6 Likes