Use OpenID Connect to Build a Simple Node.js Website

Use OpenID Connect to Build a Simple Node.js Website

In this article you’ll learn how to use OpenID Connect to build a simple Node.js website with Express.js. You’ll also learn how to log users into your website using Okta.

Arunvel Sriram

Hi Randall,
Great article.

In the example UI and API are tied together as a single app. Lets say there is a API and one or more clients (web, mobile apps). Is it possible to protect the API routes using oidc-middleware in that case ?

Nate Barbettini

In that case, you’d use the @okta/jwt-verifier package on the API to validate tokens on incoming requests. On your web or mobile clients, you’d obtain tokens with OpenID Connect and attach them to the calls to your API.

There are a number of Okta quickstarts that demo this type of setup, for example this one for an Angular frontend and Node/Express backend.

Dennis Allard

I followed the instructions but, after the authentiaction succeeds, the app breaks when rendering the dashboard with an error due to user is undefined. Here is the stack trace:

[2018-11-04 15:59 allard@bamboo:~/data/examples/openid/okta-express]$ undefined
TypeError: /home/allard/data/examples/openid/okta-express/views/dashboard.pug:8
6| .jumbotron
7| ul
> 8| li Your Email Address is: #{user.preferred_username}
9| li Your First Name is: #{user.given_name}
10| li Your Last Name is: #{user.family_name}
11|

Cannot read property ‘preferred_username’ of undefined
at eval (eval at wrap (/home/allard/data/examples/openid/okta-express/node_modules/pug-runtime/wrap.js:6:10), <anonymous>:39:62)
at template (eval at wrap (/home/allard/data/examples/openid/okta-express/node_modules/pug-runtime/wrap.js:6:10), <anonymous>:69:337)
at Object.exports.renderFile (/home/allard/data/examples/openid/okta-express/node_modules/pug/lib/index.js:427:38)
at Object.exports.renderFile (/home/allard/data/examples/openid/okta-express/node_modules/pug/lib/index.js:417:21)
at View.exports.__express [as engine] (/home/allard/data/examples/openid/okta-express/node_modules/pug/lib/index.js:464:11)
at View.render (/home/allard/data/examples/openid/okta-express/node_modules/express/lib/view.js:135:8)
at tryRender (/home/allard/data/examples/openid/okta-express/node_modules/express/lib/application.js:640:10)
at Function.render (/home/allard/data/examples/openid/okta-express/node_modules/express/lib/application.js:592:3)
at ServerResponse.render (/home/allard/data/examples/openid/okta-express/node_modules/express/lib/response.js:1008:7)

ajay paladugu

@ Dennis Allard : if your issue is not resolved.Need couple of modification for above code instead of req.userinfo that need to update as req.userContext.Please update server.js and dashboard.pug with below code snippet server.js console.log("userinfo: " + JSON.stringify(req.userContext) );
res.render(“dashboard”, { user: req.userContext });
dashboard.puguser.userinfo.preferred_username

Gaurav Bhandari

Good one, worked like a charm… I really looked into other websites for OIDC tutorial, but they did not work…