Node.js Login with Express and OIDC
Node.js just celebrated its 11th birthday on May 27! With the state of things nows, it’s pretty crazy to think back to the massive JavaScript Renaissance boost of 2009. In case you’re not aware, the JavaScript Renaissance began in around 2004 with Ajax, increased exponentially with jQuery in the mid-2000s, and then really took off with Node.js and a plethora of early JavaScript web frameworks; including Backbone.js, Ember.js, and AngularJS.
Today, I’d like to show you the power of Node.js with a simple login example. Express.js is one of the oldest and most-used server-side MVC frameworks for Node.js. Okta happens to provide an OIDC Middleware package that integrates with Express to secure your app with login and logout functionality.
To show how it all works, I created a screencast: Node.js Login with Express and OIDC.
OktaDev Schematics was used in the making of this video. See its Express documentation to reproduce the steps yourself, or follow the instructions below. |
Create an Express App and Add Login in 5 Steps
Step 1: Create a new project with express-generator and pug for the view.
mkdir express-app
cd express-app
npx express-generator --view=pug
Step 2: Before you begin, you’ll need a free Okta developer account. Install the Okta CLI and run okta register
to sign up for a new account. If you already have an account, run okta login
.
Then, run okta apps create
. Select the default app name, or change it as you see fit.
Choose Web and press Enter.
Select Other.
Then, change the Redirect URI to http://localhost:3000/callback
and use http://localhost:3000
for the Logout Redirect URI.
What does the Okta CLI do?
The Okta CLI will create an OIDC Web App in your Okta Org. It will add the redirect URIs you specified and grant access to the Everyone group. You will see output like the following when itโs finished:
Okta application configuration has been written to: /path/to/app/.okta.env
Run cat .okta.env
(or type .okta.env
on Windows) to see the issuer and credentials for your app.
export OKTA_OAUTH2_ISSUER="https://dev-133337.okta.com/oauth2/default"
export OKTA_OAUTH2_CLIENT_ID="0oab8eb55Kb9jdMIr5d6"
export OKTA_OAUTH2_CLIENT_SECRET="NEVER-SHOW-SECRETS"
Your Okta domain is the first part of your issuer, before /oauth2/default
.
NOTE: You can also use the Okta Admin Console to create your app. See Create a Web App for more information.
Step 3: Install Schematics CLI:
npm install -g @angular-devkit/schematics-cli
Step 4: Install and run OktaDev Schematics with your Okta values for $issuer
, $clientId
, and $clientSecret
:
npm i -D @oktadev/schematics
schematics @oktadev/schematics:add-auth --issuer=$issuer --clientId=$clientId --clientSecret=$clientSecret
An .env file will be generated with your client secret in it. Make sure to add *.env to .gitignore and don’t check it into source control!
|
Step 5: Start your app and authenticate with Okta! ๐
npm start
Learn More About Node.js and JavaScript
I hope you enjoyed this quick tour of how to add a login feature to a Node.js application. If you’re looking to do more with Okta and Node.js, check out our Node.js SDK. It allows you to communicate with Okta APIs to manage your users and their identity.
You can find the source code for this example on GitHub @oktadeveloper/okta-nodejs-login-example.
If you liked this screencast, you might enjoy our other tutorials too.
For more awesome tech talk, follow @oktadev on Twitter. We have a fun YouTube channel too! If you have any questions about Node.js, Okta, or anything related to this blog post, please ask in the comments below.
Okta Developer Blog Comment Policy
We welcome relevant and respectful comments. Off-topic comments may be removed.