Add session handling and optional reCaptcha support

.env.example

@@ -29,6 +29,14 @@ ADMIN_PASS="flux"
 # 4. Put your solder API URL (http[s]://example.com/api/) in and link it.
 API_KEY=""
 
+# (REQUIRED) Session Secret Key. CHANGE THIS!!!!
+# This is the key that will be used to encrypt sessions. It is recommended that you make it secure.
+# You can generate one using the following steps:
+# 1. Go to https://www.lastpass.com/features/password-generator#generatorTool
+# 2. Set password length to 50 and leave it set to all characters
+# 3. Copy the password here.
+SESSION_KEY="(/jg~WBd4%+cXt9vp'&/lN-;mynl:N}v£D!0I5V04tcpYb&;.F"
+
 # (Optional) Default Author Name (for custom files)
 # This is the name that will be pre-filled when you go to upload custom files for a modpack.
 # Unset behaviour: You will need to specify the author every time.
@@ -49,3 +57,13 @@ API_RATE_REQUESTS=1000
 # The amount of time (in milliseconds) that the request limit is applied to.
 # Unset behaviour: Defaults to 60000
 API_RATE_WINDOW=60000
+
+# --- Google ReCaptcha ---
+# TechnicFlux comes with Google ReCaptcha support.
+# When configured, this will enable captcha protection on your login page.
+
+# (Optional) Google ReCaptcha Credentials
+# You can obtain these credentials at https://www.google.com/recaptcha/admin/create
+# Unset behaviour: ReCaptcha is disabled on login page.
+#CAPTCHA_SITE_KEY=""
+#CAPTCHA_SITE_SECRET=""

app.js

@@ -4,6 +4,8 @@ const path = require('path')
 const cookieParser = require('cookie-parser')
 const logger = require('morgan')
 const multer = require('multer')
+const session = require('express-session')
+const MongoStore = require('connect-mongo')
 
 // Setup multer disk-store
 const storage = multer.diskStorage({
@@ -27,9 +29,20 @@ const app = express()
 app.set('views', path.join(__dirname, 'views'))
 app.set('view engine', 'hbs')
 
+// --- Middleware ---
+app.use(session({
+  secret: process.env.SESSION_KEY,
+  saveUninitialized: false,
+  resave: false,
+  store: MongoStore.create({
+    mongoUrl: process.env.MONGODB_CONN_STRING,
+    touchAfter: 24 * 3600,
+    collectionName: "technicflux_sessions"
+  })
+}))
 app.use(logger('dev'))
 app.use(express.json())
-app.use(express.urlencoded({ extended: false }))
+app.use(express.urlencoded({ extended: true }))
 app.use(cookieParser())
 app.use(express.static(path.join(__dirname, 'public')))
 

bin/www

@@ -7,12 +7,13 @@ require('dotenv').config()
 
 // Check if the .env config file is included.
 const required_variables = [
-    process.env.MONGODB_CONN_STRING,
-    process.env.ADMIN_USER,
-    process.env.ADMIN_PASS,
-    process.env.NAME,
-    process.env.HOST,
-    process.env.API_KEY
+  process.env.MONGODB_CONN_STRING,
+  process.env.ADMIN_USER,
+  process.env.ADMIN_PASS,
+  process.env.NAME,
+  process.env.HOST,
+  process.env.API_KEY,
+  process.env.SESSION_KEY
 ]
 for (let variable of required_variables) {
   if (variable === undefined) {

package.json

@@ -39,12 +39,15 @@
   "dependencies": {
     "@zip.js/zip.js": "^2.7.29",
     "bcryptjs": "^2.4.3",
+    "connect-mongo": "^5.0.0",
     "cookie-parser": "~1.4.4",
     "current-git-branch": "^1.1.0",
     "debug": "~4.3.4",
     "dotenv": "^16.3.1",
     "express": "~4.18.2",
     "express-rate-limit": "^7.0.2",
+    "express-recaptcha": "^5.1.0",
+    "express-session": "^1.17.3",
     "hbs": "~4.2.0",
     "http-errors": "~1.6.3",
     "mongoose": "^7.5.3",

public/stylesheets/style.css

@@ -9,3 +9,7 @@ body {
 a {
   color: #00B7FF;
 }
+
+.grecaptcha-badge {
+  margin-bottom: 65px;
+}

routes/index.js

@@ -1,9 +1,36 @@
 const express = require('express')
 const router = express.Router()
+const { RecaptchaV3 } = require('express-recaptcha')
+
+// --- Google ReCaptcha
+const site_key = process.env?.CAPTCHA_SITE_KEY
+const site_secret = process.env?.CAPTCHA_SITE_SECRET
+const captcha_enabled = (site_key !== undefined) && (site_secret !== undefined)
+const recaptcha = captcha_enabled ? new RecaptchaV3(site_key, site_secret, {
+  callback: 'cb'
+}) : undefined
 
 /* GET home page. */
-router.get('/', function (req, res) {
-  res.render('index', { title: 'TechnicFlux' })
+router.get('/', captcha_enabled ? recaptcha.middleware.render : (req, res, next) => {next()}, function (req, res) {
+  res.render('index', {
+    title: 'TechnicFlux',
+    captcha: captcha_enabled ? res.recaptcha : false
+  })
+})
+
+/* POST home page (login info w/ captcha) */
+router.post('/', captcha_enabled ? recaptcha.middleware.verify : (req, res, next) => {next()}, function (req, res) {
+  // Validate captcha, if enabled.
+  if (captcha_enabled && req.recaptcha.error) {
+    return res.render('index', {
+      title: 'TechnicFlux',
+      captcha: captcha_enabled ? res.recaptcha : false,
+      error: "Captcha validation failed! Ensure that javascript is enabled!"
+    })
+  }
+
+  // Check login info
+  res.json({success: "yay"})
 })
 
 module.exports = router