Gitlab Strategy
The Gitlab strategy for remix-auth (opens in a new tab) is used to authenticate users against a Gitlab account. It extends the OAuth2Strategy.
Supported runtimes
Runtime | Has Support |
---|---|
Node.js | ✅ |
Cloudflare | ✅ |
Setup Guide
Install the package
npm install remix-auth-gitlab
Create the strategy instance
app/services/auth.server.ts
import { GitlabStrategy } from "remix-auth-gitlab";
let gitlabStrategy = new GitlabStrategy(
{
clientID: "YOUR_CLIENT_ID",
clientSecret: "YOUR_CLIENT_SECRET",
callbackURL: "https://example.com/auth/gitlab/callback",
},
async ({ accessToken, extraParams, profile }) => {
// Get the user data from your DB or API using the tokens and profile
return User.findOrCreate({ email: profile.emails[0].value });
}
);
authenticator.use(gitlabStrategy);
Setup your routes
app/routes/login.tsx
export default function Login() {
return (
<Form action="/auth/gitlab" method="post">
<button>Login with Gitlab</button>
</Form>
);
}
app/routes/auth/gitlab.tsx
import { ActionFunction, LoaderFunction, redirect } from "remix";
import { authenticator } from "~/auth.server";
export let loader: LoaderFunction = () => redirect("/login");
export let action: ActionFunction = ({ request }) => {
return authenticator.authenticate("gitlab", request);
};
app/routes/auth/gitlab/callback.tsx
import { LoaderFunction } from "remix";
import { authenticator } from "~/auth.server";
export let loader: LoaderFunction = ({ request }) => {
return authenticator.authenticate("gitlab", request, {
successRedirect: "/dashboard",
failureRedirect: "/login",
});
};