LastLogin Auth

LastLogin Auth is the simplest way to add user authentication to your HTTP val.

LastLogin is a decentralized hosted auth provider that enables login to any app through email, Google, Github, etc without API keys.

This val exports middleware that can be added to any HTTP val.

Login with Google

While LastLogin supports many login providers, it's often simplest to have a single "Login with Google" button.

Live Demo

How to setup

These instructions were written to be easily copy-and-pasteable into LLMs like Townie.

• import { lastlogin } from "https://esm.town/v/stevekrouse/lastlogin_safe"
• Wrap & export the main HTTP handler: export default lastlogin(handler).
• In the HTTP handler, retrieve the user's email: const email = request.headers.get("X-LastLogin-Email")
• If email, show that user's content, and a logout link to "/auth/logout"; if no email, show login options.
• import { LoginWithGoogleButton } from "https://esm.town/v/stevekrouse/LoginWithGoogleButton"
• Use the React Component, optionally supplying the text attribute
• Add "via LastLogin" underneat LoginWithGoogleButton, centered, secondary text, linking to https://lastlogin.io/
• Pass the email from the server to the client-side code if using React hydration or similar techniques.

How it works

1. Your users click on the React Component in your app
2. The opens a new window to /auth/login?provider=google in your app
3. This middleware directs them to log into Google via LastLogin
4. They log in to Google
5. Google redirects to LastLogin, who redirects back to /auth/callback in your app
6. This middleware "logs them in" to your app by giving them a session cookie.
7. In your app, you can read the X-LastLogin-Email header to see which (if any) user is logged in

Login with LastLogin

The classic LastLogin authentication flow is to redirect your user to lastlogin.io/login, where they can pick which way to login: email, Google, Github, etc.

Live Demo

How to set up

These instructions were written to be easily copy-and-pasteable into LLMs like Townie.

• import { lastlogin } from "https://esm.town/v/stevekrouse/lastlogin_safe"
• Wrap & export the main HTTP handler: export default lastlogin(handler).
• In the HTTP handler, retrieve the user's email: const email = request.headers.get("X-LastLogin-Email")
• If email, show that user's content, and a logout link to "/auth/logout";
• If no email, add a link to "Login or Sign Up" to "/auth/login"
• Pass the email from the server to the client-side code if using React hydration or similar techniques.

How it works

1. Your users click on a link to /auth/login in your app
2. This middleware directs them to login via LastLogin
3. They authenticate to LastLogin
4. LastLogin redirects them back to your app
5. This middleware "logs them in" to your app by giving them a session cookie.
6. In your app, you can read the X-LastLogin-Email header to see which (if any) user is logged in

Notes

• If you want username & password auth: @stevekrouse/lucia_middleware
• This middleware stores sessions in the lastlogin_session table in your Val Town SQLite
• This val has NOT been properly audited for security. I am not a security expert. I would suggest only using it for demos, prototypes, or apps where security is not paramount. If you are a security expert, I would appreciate your help auditing this!

Todos

• Let the user customize the name of the SQLite table
• Get a proper security audit for this