How-To Add OneLogin Authentication To A Next.js App With NextAuth

I've got a Next.js app that I'm using OneLogin for the authentication on. The docs on OneLogin site talk about how to setup with React, but not Next.js specifically. Took me a bit to figure out the steps so I figured I'd write them up.

You'll want to get your OneLogin account stuff setup before going through this so your next.js app has something to talk to. Once you've got that setup, this is the process starting from scratch on a localhost environment (your milage may vary on windows)

#### Step 1

Create an app (e.g. named 'onelogin-app') with:

#### Step 2

Move into the newly created `onelogin-app` app directory and install NextAuth with:

#### Step 3

Create a `.env.local` file and fill in these variables:

#### Step 4

Make a directory named `auth` under `pages/api` so you end up with:

#### Step 5

Create a file named `[...nextauth].js` in the `pages/api/auth` you just created. So, the full path is:

Paste this into the file:

#### Step 6

Add the next-auth stuff to the `_app.js` Open:

delete the contents and replace them with this:

#### Step 7

This step shows how to check if the user is signed in on the front end. The check is done via the `session` variable. It shows if the user is singed in by showing their email address and a sign-out button if they are. If there is no user signed in, a sign-in button is displayed instead.

Open the file:

Delete the contents and replace them with this:

#### Step 8

This step adds the authentication check to an api endpoint.

Open the file:

Delete its contents and replace this with:

#### Testing

That's it for the setup. You can test everything is working with:

#### Next Steps

[this needs editing...]

By default, the only stuff available in the session on the front end are:

That really only tells you if someone is logged in or not and doesn't provide access to information from the profile that can be used to make display changes based off group access. (Note, this is only about display stuff and should not be considered secure for locking down access to things.)

To pass profile data based on the results of the sign in you have to pass from signIn -< jwt -< session.

TODO: write this up:

Also point out that you can use profile from jwt without having to start at signIn

TODO Check API stuff for what's there for dealing with request like that as well.