feat: Add device code auth flow

src/app.ts

@@ -2,31 +2,31 @@ import express, { NextFunction, Response, Request } from 'express'
 import path from 'path'
 import logger from 'morgan'
 import cookieParser from 'cookie-parser'
-import bodyParser from 'body-parser'
 
 import routes from './routes'
 import login from './routes/login'
 import logout from './routes/logout'
 import consent from './routes/consent'
+import device from './routes/device'
 
 const app = express()
 
 // view engine setup
 app.set('views', path.join(__dirname, '..', 'views'))
 app.set('view engine', 'pug')
 
-// uncomment after placing your favicon in /public
-//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
+app.get('/favicon.ico', (req, res) => res.status(204))
 app.use(logger('dev'))
-app.use(bodyParser.json())
-app.use(bodyParser.urlencoded({ extended: false }))
+app.use(express.json())
+app.use(express.urlencoded({ extended: false }))
 app.use(cookieParser())
 app.use(express.static(path.join(__dirname, 'public')))
 
 app.use('/', routes)
 app.use('/login', login)
 app.use('/logout', logout)
 app.use('/consent', consent)
+app.use('/device', device)
 
 // catch 404 and forward to error handler
 app.use((req, res, next) => {

src/routes/device.ts

@@ -0,0 +1,49 @@
+import express from 'express'
+import url from 'url'
+import csrf from 'csurf'
+import { hydraAdmin } from '../config'
+
+// Sets up csrf protection
+const csrfProtection = csrf({ cookie: true })
+const router = express.Router()
+
+router.get('/', csrfProtection, (req, res, next) => {
+  // Parses the URL query
+  const query = url.parse(req.url, true).query
+
+  // The challenge is used to fetch information about the login request from ORY Hydra.
+  const challenge = String(query.device_challenge)
+  if (!challenge) {
+    next(new Error('Expected a login challenge to be set but received none.'))
+    return
+  }
+
+  // Parses the URL query
+  const userCode = String(query.user_code)
+
+  res.render('device', {
+    csrfToken: req.csrfToken(),
+    challenge,
+    userCode
+  })
+})
+
+router.post('/', csrfProtection, (req, res, next) => {
+  // The code is a input field, so let's take it from the request body
+  const { code: userCode, challenge } = req.body
+
+  console.log(`In post: ${challenge} | ${userCode}`)
+
+  // All we need to do now is to redirect the user back to hydra!
+  hydraAdmin
+    .adminVerifyUserCodeRequest(challenge, {
+      user_code: userCode
+    })
+    .then(({ data: body }) => {
+      // All we need to do now is to redirect the user back to hydra!
+      res.redirect(String(body.redirect_to))
+    })
+    .catch(next)
+})
+
+export default router

views/device.pug

@@ -0,0 +1,13 @@
+extends layout
+
+block content
+    h1(id="login-title") Please input User Code
+    if error
+        p.
+            #{error}
+    form(action=action, method="POST")
+        input(type="hidden", name="_csrf", value=csrfToken)
+        input(type="hidden", name="challenge", value=challenge)
+        input(type="code", id="code", name="code", value=userCode, placeholder="XXXXXX")
+        br
+        input(type="submit", id="verify", name="submit", value="Send")