https://github.com/bitcomplete/remix-oauth2-lite
https://github.com/bitcomplete/remix-oauth2-lite
Last synced: about 1 month ago
JSON representation
- Host: GitHub
- URL: https://github.com/bitcomplete/remix-oauth2-lite
- Owner: bitcomplete
- License: mit
- Created: 2022-08-26T12:35:01.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2025-05-23T17:52:20.000Z (10 months ago)
- Last Synced: 2025-08-30T17:17:17.169Z (7 months ago)
- Language: TypeScript
- Size: 97.7 KB
- Stars: 0
- Watchers: 4
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
remix-oauth2-lite is an authentication and authorization library for the Remix
web framework. It supports some OAuth2 providers out of the box, and offers a
simple API for authorization in a Remix app.
# Quick start
① Create session storage and an Auth object:
```
import { createCookieSessionStorage } from "remix";
import { Auth } from "remix-oauth2-lite";
// ~/lib/auth.server.tsx
const sessionStorage = createCookieSessionStorage({
cookie: {
name: "my-site-session",
sameSite: "lax",
path: "/",
httpOnly: true,
secrets: [SESSION_SECRET],
secure: process.env.NODE_ENV === "production",
},
});
export const auth = new Auth(sessionStorage, [
// providers here...
// See the Providers section below for more details.
]);
```
② Create a splat route to handle auth endpoints:
```
// routes/auth/$.tsx
import { LoaderFunction } from "@remix-run/server-runtime";
import { auth } from "~/services/auth.server";
export const loader: LoaderFunction = async (args) => auth.loader(args);
export default function () {
return null;
}
```
③ Authenticate requests on routes that should be protected:
```
// routes/someroute.tsx
export let loader: LoaderFunction = async ({ request }) => {
return await auth.authenticated(request, async (user) => {
// Logged out users will be redirect to "/".
return json({ user })
});
};
```
④ Direct users to provider-specific sign-in/sign-out links:
```
// Sign in link for myprovider
Sign In
// Sign out link for myprovider
Sign Out
```
# Providers
Most authentication logic is specific to a provider, each of which is described
below.
## Google
```
export const auth = new Auth(sessionStorage, [
new GoogleProvider({
clientId: CLIENT_ID,
clientSecret: CLIENT_SECRET,
scope: "email"
}),
]);
```
## Generic OAuth2
```
export const auth = new Auth(sessionStorage, [
new OAuth2Provider({
authorizationUrl: `https://some-provider.com/oauth2/authorize`,
tokenUrl: `https://some-provider.com/oauth2/token`,
clientId: CLIENT_ID,
clientSecret: CLIENT_SECRET,
}),
]);
```