GitHub - Admin SSO Provider

Requirements

You will need to gather or complete the following requirements before you can configure GitHub as a Strapi Admin SSO Provider:

• Properly configure Strapi for SSO including adding the url configuration key to your ./config/server.js file.
• Create your GitHub OAuth2 application by following the steps in the GitHub Developer Settings.
• Gather the required information to set as environment variables in your Strapi project:
  • GITHUB_CLIENT_ID
  • GITHUB_CLIENT_SECRET

Provider Specific Notes

The GitHub OAuth2 provider requires the following scopes, however additional scopes can be added as needed depending on your use case and the data you need returned:

• user:email

Data returned from the provider is dependent on how your GitHub OAuth2 application is configured. The example below assumes that the GitHub OAuth2 application is configured to return the user's email and username. Fields returned by the provider can change based on the scopes requested and the user's GitHub account settings.

If you aren't sure what data is being returned by the provider, you can log the profile object in the createStrategy function to see what data is available as seen in the following example.

Configuration Example with Logging

(request, accessToken, refreshToken, profile, done) => {
  // See what is returned by the provider
  console.log(profile);

  done(null, {
    // Map the data returned by the provider to the Strapi user object
    email: profile.emails[0].value,
    username: profile.username,
  });
}

Strapi Configuration

Using: passport-github

Install the Provider Package

yarn

yarn add passport-github2

npm

npm install --save passport-github2

Adding the Provider to Strapi

JavaScript

./config/admin.js

const GithubStrategy = require("passport-github2");

module.exports = ({ env }) => ({
  auth: {
    // ...
    providers: [
      {
        uid: "github",
        displayName: "Github",
        icon: "https://cdn1.iconfinder.com/data/icons/logotypes/32/github-512.png",
        createStrategy: (strapi) =>
          new GithubStrategy(
            {
              clientID: env("GITHUB_CLIENT_ID"),
              clientSecret: env("GITHUB_CLIENT_SECRET"),
              scope: ["user:email"],
              callbackURL:
                env('PUBLIC_URL') +
                strapi.admin.services.passport.getStrategyCallbackURL("github"),
            },
            (accessToken, refreshToken, profile, done) => {
              done(null, {
                email: profile.emails[0].value,
                username: profile.username,
              });
            }
          ),
      },
    ],
  },
});

TypeScript

./config/admin.ts

import { Strategy as GithubStrategy } from "passport-github2";

export default ({ env }) => ({
  auth: {
    // ...
    providers: [
      {
        uid: "github",
        displayName: "Github",
        icon: "https://cdn1.iconfinder.com/data/icons/logotypes/32/github-512.png",
        createStrategy: (strapi) =>
          new GithubStrategy(
            {
              clientID: env("GITHUB_CLIENT_ID"),
              clientSecret: env("GITHUB_CLIENT_SECRET"),
              scope: ["user:email"],
              callbackURL:
                env('PUBLIC_URL') +
                strapi.admin.services.passport.getStrategyCallbackURL("github"),
            },
            (accessToken, refreshToken, profile, done) => {
              done(null, {
                email: profile.emails[0].value,
                username: profile.username,
              });
            }
          ),
      },
    ],
  },
});