@proteinjs/server 1.0.1

package/package.json

@@ -0,0 +1,77 @@
+{
+    "name": "@proteinjs/server",
+    "version": "1.0.1",
+    "description": "A server impl",
+    "publishConfig": {
+        "access": "public"
+    },
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/brentbahry/server.git"
+    },
+    "bugs": {
+        "url": "https://github.com/brentbahry/server/issues"
+    },
+    "homepage": "https://github.com/brentbahry/server#readme",
+    "author": "Brent Bahry",
+    "license": "ISC",
+    "scripts": {
+        "clean": "rm -rf dist/ generated/ node_modules/ package-lock.json",
+        "build": "reflection-build && tsc",
+        "watch": "reflection-watch",
+        "dev": "DEVELOPMENT=true node dist/generated/index.js"
+    },
+    "dependencies": {
+        "@proteinjs/db": "1.0.3",
+        "@proteinjs/reflection": "1.0.2",
+        "@proteinjs/server-api": "1.0.2",
+        "@proteinjs/util": "1.0.18",
+        "body-parser": "1.19.0",
+        "compression": "1.7.4",
+        "cookie-parser": "1.4.5",
+        "express": "4.17.1",
+        "express-session": "1.17.1",
+        "passport": "0.4.1",
+        "passport-local": "1.0.0",
+        "react": "18.2.0",
+        "react-helmet": "6.1.0",
+        "webpack": "5.88.2",
+        "webpack-dev-middleware": "7.0.0",
+        "webpack-hot-middleware": "2.26.0"
+    },
+    "devDependencies": {
+        "@emotion/react": "11.11.1",
+        "@emotion/styled": "11.11.0",
+        "@mui/icons-material": "5.14.11",
+        "@mui/joy": "5.0.0-beta.8",
+        "@mui/material": "5.14.11",
+        "@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
+        "@proteinjs/reflection-build": "1.0.5",
+        "@types/body-parser": "1.19.0",
+        "@types/compression": "1.7.0",
+        "@types/cookie-parser": "1.4.2",
+        "@types/express": "4.17.7",
+        "@types/express-session": "1.17.0",
+        "@types/node": "14.0.13",
+        "@types/passport": "1.0.4",
+        "@types/passport-local": "1.0.33",
+        "@types/react": "18.2.23",
+        "@types/react-helmet": "6.1.0",
+        "@types/webpack-hot-middleware": "2.25.9",
+        "buffer": "6.0.3",
+        "crypto-browserify": "3.12.0",
+        "events": "3.3.0",
+        "file-loader": "6.2.0",
+        "process": "0.11.10",
+        "react-refresh": "0.14.0",
+        "react-refresh-typescript": "2.0.9",
+        "stream-browserify": "3.0.0",
+        "ts-loader": "8.0.3",
+        "typescript": "5.2.2",
+        "url": "0.11.3",
+        "util": "0.12.5"
+    },
+    "main": "./dist/generated/index.js",
+    "types": "./dist/generated/index.d.ts",
+    "gitHead": "7609528bc63fb92c7b528fc31795bef1e6913cbf"
+}

package/src/NodeSessionDataStorage.ts

@@ -0,0 +1,40 @@
+import asyncHooks from 'async_hooks';
+import { SessionData, SessionDataStorage } from '@proteinjs/server-api';
+
+export class NodeSessionDataStorage implements SessionDataStorage {
+    private static HOOK_INITIALIZED = false;
+    private static readonly SESSION_DATA: {[id: string]: SessionData} = {};
+    environment = 'node' as 'node';
+
+    setData(data: SessionData) {
+        if (!NodeSessionDataStorage.HOOK_INITIALIZED)
+            this.initHook();
+
+        if (NodeSessionDataStorage.SESSION_DATA[asyncHooks.executionAsyncId()])
+            return;
+
+        NodeSessionDataStorage.SESSION_DATA[asyncHooks.executionAsyncId()] = data;
+    }
+
+    getData(): SessionData {
+        if (!NodeSessionDataStorage.HOOK_INITIALIZED)
+            this.initHook();
+
+        return NodeSessionDataStorage.SESSION_DATA[asyncHooks.executionAsyncId()];
+    }
+
+    private initHook() {
+        asyncHooks.createHook({
+            init: (asyncId: number, type: string, triggerAsyncId: number, resource: Object) => {
+                if (!NodeSessionDataStorage.SESSION_DATA[triggerAsyncId])
+                    return;
+
+                NodeSessionDataStorage.SESSION_DATA[asyncId] = NodeSessionDataStorage.SESSION_DATA[triggerAsyncId];
+            },
+            destroy: (asyncId: number) => {
+                delete NodeSessionDataStorage.SESSION_DATA[asyncId];
+            }
+        }).enable();
+        NodeSessionDataStorage.HOOK_INITIALIZED = true;
+    }
+}

package/src/loadRoutes.ts

@@ -0,0 +1,126 @@
+import express from 'express';
+import passport from 'passport';
+import { ServerConfig, Route, getRequestListeners, Session, SessionData, getSessionDataCaches } from '@proteinjs/server-api';
+import { createReactApp } from './routes/reactApp';
+import { Logger } from '@proteinjs/util';
+
+const logger = new Logger('Server');
+
+export function loadRoutes(routes: Route[], server: express.Express, config: ServerConfig) {
+    let starRoute: Route|null = null;
+    const wildcardRoutes: Route[] = [];
+    for (const route of routes) {
+        logger.info(`Loading route: ${route.path}`);
+        if (route.path == '*') {
+            starRoute = route;
+            continue;
+        }
+
+        if (route.path.includes('*')) {
+            wildcardRoutes.push(route);
+            continue;
+        }
+
+        server[route.method](getPath(route.path), wrapRoute(route.onRequest.bind(route), config));
+    }
+
+    for (const wildcardRoute of wildcardRoutes)
+        server[wildcardRoute.method](getPath(wildcardRoute.path), wrapRoute(wildcardRoute.onRequest.bind(wildcardRoute), config));
+
+    if (starRoute)
+        server[starRoute.method](starRoute.path, wrapRoute(starRoute.onRequest.bind(starRoute), config));
+}
+
+export function loadDefaultStarRoute(routes: Route[], server: express.Express, config: ServerConfig) {
+    let starRouteSpecified = false;
+    for (const route of routes) {
+        if (route.path == '*') {
+            starRouteSpecified = true;
+            break;
+        }
+    }
+    
+    if (!starRouteSpecified && config.staticContent?.bundlePaths) {
+        const reactApp = createReactApp(config);
+        server[reactApp.method](reactApp.path, wrapRoute(reactApp.onRequest, config));
+    }
+}
+
+function getPath(path: string) {
+    return path.startsWith('/') ? path : `/${path}`;
+}
+
+function wrapRoute(route: (request: express.Request, response: express.Response) => Promise<void>, config: ServerConfig) {
+    return async function (request: express.Request, response: express.Response, next: express.NextFunction) {
+        if (response.locals['responseHandled']) {
+            next();
+            return;
+        }
+        
+        if (config.authenticate) {
+            await new Promise<void>((resolve, reject) => {
+                passport.authenticate('local', function (err, user, info) {
+                    if (err)
+                        reject(err);
+
+                    resolve();
+                })(request, response, next);
+            });
+        }
+
+        const sessionData: SessionData = { sessionId: request.sessionID, user: request.user as string, data: {} };
+        for (const sessionDataCache of getSessionDataCaches())
+            sessionData.data[sessionDataCache.key] = await sessionDataCache.create(sessionData.sessionId, sessionData.user);
+        Session.setData(sessionData);
+
+        const requestListeners = getRequestListeners();
+        for (const listener of requestListeners) {
+            if (!listener.beforeRequest)
+                continue;
+
+            try {
+                await listener.beforeRequest(request, response);
+            } catch (error: any) {
+                logger.error(`Caught error when running listener before request`, error);
+            }
+        }
+
+        const sixtyMinutes = 1000 * 60 * 60;
+        const timeout = typeof config.request?.timeoutMs !== 'undefined' ? config.request.timeoutMs : sixtyMinutes;
+        request.setTimeout(timeout, () => {
+            if (response.locals.requestNumber)
+                logger.warn(`[#${response.locals.requestNumber}] Timed out ${request.originalUrl}`);
+            else
+                logger.warn(`Timed out ${request.originalUrl}`);
+        });
+
+        try {
+            await route(request, response);
+        } catch(error) {
+            console.error(error);
+        }
+        response.locals['responseHandled'] = true;
+
+        for (const listener of requestListeners) {
+            if (!listener.afterRequest)
+                continue;
+
+            try {
+                await listener.afterRequest(request, response);
+            } catch (error: any) {
+                logger.error(`Caught error when running listener after request`, error);
+            }
+        }
+
+        next();
+    };
+}
+
+function basicAuthCredentials(request: express.Request): { username: string, password: string } | null {
+    const b64auth = (request.headers.authorization || '').split(' ')[1] || '';
+    const [username, password] = Buffer.from(b64auth, 'base64').toString().split(':');
+    if (!username || !password)
+        return null;
+
+    return { username, password };
+}

package/src/routes/healthCheck.ts

@@ -0,0 +1,10 @@
+import { Route } from '@proteinjs/server-api';
+
+export const healthCheck: Route = {
+    path: 'health-check',
+    method: 'get',
+    useHttp: true,
+    onRequest: async (request, response): Promise<void> => {
+        response.send();
+    }
+}

package/src/routes/reactApp.ts

@@ -0,0 +1,57 @@
+import path from 'path';
+import ReactHelmet from 'react-helmet';
+import { ServerConfig, getServerRenderedScripts } from '@proteinjs/server-api';
+
+export const createReactApp = (serverConfig: ServerConfig) => {
+    return {
+        path: '*',
+        method: 'get' as 'get',
+        onRequest: async (request: any, response: any): Promise<void> => {
+            if (request.path.startsWith('/static'))
+                return;
+
+            if (!serverConfig.staticContent?.bundlePaths)
+                throw new Error(`ServerConfig.bundlePath must be provided to serve react app`);
+
+            const helmet = ReactHelmet.renderStatic();
+            response.send(`<!DOCTYPE html>
+                <html ${helmet.htmlAttributes}>
+                    <head>
+                        <meta charset='utf-8' />
+                        <meta name='viewport' content='width=device-width, initial-scale=1.0'>
+                        <link href='${serverConfig.staticContent?.faviconPath ? path.join('/static/', serverConfig.staticContent.faviconPath) : ''}' rel='icon' type='image/x-icon' />
+                        ${helmet.title.toString()}
+                        ${helmet.meta.toString()}
+                        ${helmet.link.toString()}
+                    </head>
+                    <body ${helmet.bodyAttributes.toString()}>
+                        <div id='app'></div>
+                        <script>proteinjs = {};</script>
+                        ${await serverRenderedScriptTags()}
+                        ${bundleScriptTags(serverConfig)}
+                    </body>
+                </html>`
+            );
+        }
+    }
+}
+
+function bundleScriptTags(serverConfig: ServerConfig) {
+    if (!serverConfig.staticContent?.bundlePaths)
+        return;
+
+    const scriptTags: string[] = [];
+    for (const bundlePath of serverConfig.staticContent.bundlePaths)
+        scriptTags.push(`<script src='${path.join('/static/', bundlePath)}'></script>`);
+
+    return scriptTags.join('\n');
+}
+
+async function serverRenderedScriptTags() {
+    const scripts = getServerRenderedScripts();
+    const scriptTags: string[] = [];
+    for (const script of scripts)
+        scriptTags.push(`<script>${await script.script()}</script>`);
+
+    return scriptTags.join('\n');
+}

package/src/startServer.ts

@@ -0,0 +1,184 @@
+import express from 'express';
+import expressSession from 'express-session';
+import compression from 'compression';
+import cookieParser from 'cookie-parser';
+import bodyParser from 'body-parser';
+import passport from 'passport';
+import passportLocal from 'passport-local';
+import webpack from 'webpack';
+import webpackDevMiddleware from 'webpack-dev-middleware';
+import webpackHotMiddleware from 'webpack-hot-middleware';
+import { Db } from '@proteinjs/db';
+import { ServerConfig, getRoutes } from '@proteinjs/server-api';
+import { loadRoutes, loadDefaultStarRoute } from './loadRoutes';
+import { Logger } from '@proteinjs/util';
+
+const webpackConfig = require('../webpack.config');
+const staticContentPath = '/static/';
+const logger = new Logger('Server');
+
+export async function startServer(config: ServerConfig) {
+    const routes = getRoutes();
+    await runStartupEvents(config);
+    const server = express();
+    configureRequests(server);
+    initializeHotReloading(server, config);
+    beforeRequest(server, config);
+    loadRoutes(routes.filter(route => route.useHttp), server, config);
+    configureHttps(server);  // registering here forces static content to be redirected to https
+    configureStaticContentRouter(server, config);  // registering here prevents sessions from being created on static content requests
+    configureSession(server, config);
+    loadRoutes(routes.filter(route => !route.useHttp), server, config);
+    loadDefaultStarRoute(routes, server, config);
+    afterRequest(server, config);
+    start(server, config);
+}
+
+async function runStartupEvents(config: ServerConfig) {
+    await new Db().init();
+
+    if (config.onStartup)
+        await config.onStartup();
+}
+
+function configureRequests(server: express.Express) {
+    server.use(compression());
+    server.use(cookieParser());
+    server.use(bodyParser.json({ limit: '100mb' }));
+    server.use(bodyParser.urlencoded({
+        extended: true,
+        limit: '100mb'
+    }));
+    server.disable('x-powered-by');
+}
+
+function initializeHotReloading(server: express.Express, config: ServerConfig) {
+    if (!process.env.DEVELOPMENT || process.env.DISABLE_HOT_CLIENT_BUILDS || config.disableHotClientBuilds || !config.staticContent?.staticContentDir || !config.staticContent?.appEntryPath)
+        return;
+
+    let wpConfig = Object.assign({}, webpackConfig);
+    wpConfig['entry'] = { app: ['webpack-hot-middleware/client', config.staticContent.appEntryPath] };
+    wpConfig['output']['path'] = config.staticContent.staticContentDir;
+    wpConfig['output']['publicPath'] = staticContentPath;
+    const webpackCompiler = webpack(wpConfig);
+    server.use(webpackDevMiddleware(webpackCompiler, {
+        publicPath: staticContentPath,
+    }));
+    server.use(webpackHotMiddleware(webpackCompiler));
+}
+
+function configureHttps(server: express.Express) {
+    server.use((request: express.Request, response: express.Response, next: express.NextFunction) => {
+        if (request.protocol == 'https' || response.headersSent || process.env.DEVELOPMENT) {
+            next();
+            return;
+        }
+
+        logger.debug(`Redirecting to https: ${request.headers.host + request.url}`);
+        response.redirect('https://' + request.headers.host + request.url);
+    });
+}
+
+function configureStaticContentRouter(server: express.Express, config: ServerConfig) {
+    if (!config.staticContent?.staticContentDir)
+        return;
+
+	server.use(staticContentPath, express.static(config.staticContent.staticContentDir));
+	logger.info(`Serving static content on path: ${staticContentPath}, serving from directory: ${config.staticContent.staticContentDir}`);
+}
+
+function configureSession(server: express.Express, config: ServerConfig) {
+    const sixtyDays = 1000 * 60 * 60 * 24 * 60;
+    let sessionOptions: expressSession.SessionOptions = {
+        secret: config.session.secret,
+        store: config.session.store,
+        resave: false,
+        saveUninitialized: false,
+        cookie: {
+            maxAge: sixtyDays
+        },
+        rolling: true
+    };
+
+    if (!process.env.DEVELOPMENT) {
+        server.set('trust proxy', 1);
+        if (!sessionOptions.cookie)
+            sessionOptions.cookie = {};
+        sessionOptions.cookie.secure = true;
+    }
+
+    if (config.session)
+        sessionOptions = Object.assign(sessionOptions, config.session);
+
+    server.use(expressSession(sessionOptions));
+    server.use(passport.initialize());
+    server.use(passport.session());
+    if (config.authenticate)
+        initializeAuthentication(config.authenticate);
+}
+
+function initializeAuthentication(authenticate: (username: string, password: string) => Promise<true | string>) {
+    passport.use(new passportLocal.Strategy(async function (username, password, done) {
+        logger.info(`Authenticating`);
+        const result = await authenticate(username, password);
+        if (result === true)
+            return done(null, { username });
+
+        return done(new Error(result));
+    }));
+
+    passport.serializeUser(function (user, done) {
+        done(null, user);
+    });
+
+    passport.deserializeUser(function (id, done) {
+        done(null, id);
+    });
+}
+
+function beforeRequest(server: express.Express, config: ServerConfig) {
+    let requestCounter: number = 0;
+    if (config.request?.disableRequestLogging == false || typeof config.request?.disableRequestLogging === 'undefined') {
+        server.use((request: express.Request, response: express.Response, next: express.NextFunction) => {
+            if (request.path.startsWith('/static') || request.path.startsWith('/favicon.ico')) {
+                next();
+                return;
+            }
+
+            const requestNumber = ++requestCounter;
+            logger.info(`[#${requestNumber}] Started ${request.originalUrl}`);
+            response.locals = { requestNumber };
+            next();
+        });
+    }
+    
+    if (config.request?.beforeRequest)
+        server.use(config.request.beforeRequest);
+}
+
+function afterRequest(server: express.Express, config: ServerConfig) {
+    if (config.request?.afterRequest)
+        server.use(config.request.afterRequest);
+
+    if (config.request?.disableRequestLogging == false || typeof config.request?.disableRequestLogging === 'undefined') {
+        server.use((request: express.Request, response: express.Response, next: express.NextFunction) => {
+            if (request.path.startsWith('/static') || request.path.startsWith('/favicon.ico')) {
+                next();
+                return;
+            }
+            
+            logger.info(`[#${response.locals.requestNumber}] Finished ${request.originalUrl}`);
+            next();
+        });
+    }
+}
+
+function start(server: express.Express, config: ServerConfig) {
+    const port = config.port ? config.port : 3000;
+    server.listen(port, () => {
+        if (process.env.DEVELOPMENT)
+            logger.info(`Starting in development mode`);
+
+        logger.info(`Server listening on port: ${port}`);
+    });
+}

package/tsconfig.json

@@ -0,0 +1,18 @@
+{
+    "compilerOptions": {
+        "rootDir": "./",
+        "target": "es5",
+        "module": "commonjs",
+        "declaration": true,
+        "declarationMap": true,
+        "sourceMap": true,
+        "outDir": "./dist/",
+        "strict": true,
+        "noImplicitAny": true,
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "forceConsistentCasingInFileNames": true,
+        "resolveJsonModule": true,
+        "allowJs": true
+    }
+}

package/webpack.config.js

@@ -0,0 +1,112 @@
+var path = require('path');
+var webpack = require('webpack');
+const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
+const ReactRefreshTypeScript = require('react-refresh-typescript');
+
+// if there are module resolution issues, verify assumptions about pathing
+// console.log(`__dirname in webpack.config: ${__dirname}`);
+
+// see  https://github.com/webpack/webpack/issues/11467#issuecomment-808618999/
+// for details
+const webpack5esmInteropRule = {
+  test: /\.m?js/,
+  resolve: {
+    fullySpecified: false
+  }
+};
+
+module.exports = {
+  mode: 'development',
+  devtool: 'inline-source-map',
+  // entry provided dynamically in startServer.initializeHotReloading
+  // entry: {
+  //   app: ['webpack-hot-middleware/client', './generated/index.ts'],
+  // },
+  output: {
+    filename: '[name].js',
+    // path and publicPath provided in startServer.initializeHotReloading
+    // path: path.join(__dirname, 'dist'),
+    library: '[name]'
+  },
+  resolve: {
+    extensions: ['.tsx', '.ts', '.js', '.json'],
+    alias: {
+      'react': path.join(__dirname, '../node_modules/react'),
+      'process': 'process/browser',
+      '@mui/joy': path.join(__dirname, '../node_modules/@mui/joy'),
+      '@mui/material': path.join(__dirname, '../node_modules/@mui/material'),
+      '@mui/icons-material': path.join(__dirname, '../node_modules/@mui/icons-material'),
+      'webpack-hot-middleware': path.join(__dirname, '../node_modules/webpack-hot-middleware'),
+    },
+    // provide shims for node libraries for webpack >= 5
+    fallback: { 
+      'crypto': require.resolve('crypto-browserify'),
+      'util': require.resolve('util/'),
+      'events': require.resolve('events/'),
+      'url': require.resolve('url/'),
+      'buffer': require.resolve('buffer/'),
+      'stream': require.resolve('stream-browserify'),
+      'process/browser': require.resolve('process/browser'),
+    },
+  },
+  // since this webpack.config is invoked via webpack-dev-middleware in the process of the consuming server package (not this package)
+  // we need to let webpack know where to look for loaders like: file-loader and ts-loader
+  // it's ideal to keep those dependencies within this package instead of requiring them installed by the consumer
+  resolveLoader: {
+    modules: [path.resolve(__dirname, '../node_modules'), 'node_modules'],
+  },
+  module: {
+    rules: [
+      webpack5esmInteropRule,
+      // all files with a '.ts' or '.tsx' extension will be handled by 'ts-loader'
+      // this will only transpile (to integrate with babel via ReactRefreshTypeScript); rely on the ide for compiler checks
+      {
+        test: /\.[jt]sx?$/,
+        exclude: /node_modules/,
+        use: [
+          {
+            loader: require.resolve('ts-loader'),
+            options: {
+              getCustomTransformers: () => ({
+                before: [ReactRefreshTypeScript()],
+              }),
+              transpileOnly: true,
+            },
+          },
+        ],
+      },
+      // image files
+      {
+        test: /\.(png|jpe?g|gif|svg)$/i,
+        use: [
+          {
+            loader: 'file-loader',
+            options: {
+              name: '[path][name].[ext]', // This line will keep the original path and filename
+            },
+          },
+        ],
+      },
+    ],
+  },
+  optimization: {
+    splitChunks: {
+      cacheGroups: {
+        vendor: {
+          test: /[\\/]node_modules[\\/]/,  // Matches node_modules folder
+          name: 'vendor',
+          chunks: 'all',
+          priority: -10
+        }
+      }
+    }
+  },
+  plugins: [
+    new webpack.ProvidePlugin({
+        process: 'process/browser',                 
+        Buffer: ['buffer', 'Buffer'],
+    }),
+    new webpack.HotModuleReplacementPlugin(),
+    new ReactRefreshWebpackPlugin(),
+  ],
+};