@mindful-web/marko-web 1.0.0

package/express/error-handlers.js

@@ -0,0 +1,113 @@
+const { STATUS_CODES } = require('http');
+const createError = require('http-errors');
+const setRouteKind = require('@mindful-web/marko-express/utils/set-route-kind');
+const errorTemplate = require('../components/document/components/error');
+const getRedirect = require('./get-redirect');
+const findContentAlias = require('./find-content-alias');
+const applyQueryParams = require('../utils/apply-query-params');
+
+const { isArray } = Array;
+const { error } = console;
+
+const noCache = (res) => {
+  res.setHeader('Surrogate-Control', 'no-store');
+  res.setHeader('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
+  res.setHeader('Pragma', 'no-cache');
+  res.setHeader('Expires', '0');
+};
+
+const renderError = (res, { statusCode, err, template }) => {
+  setRouteKind(res, { kind: 'error', type: statusCode });
+  res.status(statusCode);
+  res.marko(template || errorTemplate, {
+    statusCode,
+    statusMessage: STATUS_CODES[statusCode],
+    error: err,
+  });
+};
+
+const handleNetworkErrorResult = (res, { statusCode, result, template }) => {
+  const message = result.errors && isArray(result.errors) ? result.errors[0].message : 'Unknown fatal.';
+  return renderError(res, { statusCode, err: new Error(message), template });
+};
+
+const render = (res, { statusCode, err, template }) => {
+  const { networkError } = err;
+  if (networkError) {
+    if (networkError.result) {
+      return handleNetworkErrorResult(res, { statusCode, result: networkError.result, template });
+    }
+    return renderError(res, { statusCode, err: networkError, template });
+  }
+  return renderError(res, { statusCode, err, template });
+};
+
+const redirectOrError = ({
+  app,
+  req,
+  res,
+  err,
+  redirectHandler,
+  statusCode,
+  template,
+  fatalErrorHandler,
+}) => {
+  getRedirect(req, redirectHandler, app).then((redirect) => {
+    if (redirect) {
+      const { code, to } = redirect;
+      // attempt to disable cache on temporary redirects
+      if ([302, 307].includes(code)) noCache(res);
+      res.redirect(code, to);
+    } else {
+      render(res, { statusCode, err, template });
+    }
+  }).catch(() => {
+    try {
+      render(res, { statusCode, err, template });
+    } catch (e) {
+      fatalErrorHandler(err);
+    }
+  });
+};
+
+module.exports = (app, { template, redirectHandler, onFatalError }) => {
+  // Force Express to throw an error on 404s.
+  app.use((req, res, next) => { // eslint-disable-line no-unused-vars
+    throw createError(404, `No page found for '${req.path}'`);
+  });
+
+  const fatalErrorHandler = (err) => {
+    error('Unable to render error template!', err);
+    if (typeof onFatalError === 'function') onFatalError(err);
+  };
+
+  // Error handler.
+  // @todo handle logging
+  app.use((err, req, res, next) => { // eslint-disable-line no-unused-vars
+    const statusCode = err.status || err.statusCode || 500;
+    const opts = {
+      app,
+      req,
+      res,
+      err,
+      redirectHandler,
+      statusCode,
+      template,
+      fatalErrorHandler,
+    };
+
+    // Attempt to load aliased content (when applicable).
+    if (statusCode === 404) {
+      findContentAlias({ req }).then((redirectTo) => {
+        if (redirectTo) {
+          const { query } = req;
+          res.redirect(301, applyQueryParams({ path: redirectTo, query }));
+        } else {
+          redirectOrError(opts);
+        }
+      }).catch(() => redirectOrError(opts));
+    } else {
+      redirectOrError(opts);
+    }
+  });
+};

package/express/find-content-alias.js

@@ -0,0 +1,30 @@
+const gql = require('graphql-tag');
+const { get } = require('@mindful-web/object-path');
+const buildContentInput = require('../utils/build-content-input');
+
+const query = gql`
+
+query WebsiteContentPageAlias($input: ContentAliasQueryInput!) {
+  contentAlias(input: $input) {
+    id
+    siteContext {
+      path
+    }
+  }
+}
+
+`;
+
+module.exports = async ({ req }) => {
+  const { apollo, path } = req;
+  if (!path) return null;
+  const alias = path.replace(/\/+$/, '').replace(/^\/+/, '');
+  if (!alias) return null;
+
+  const input = buildContentInput({ req });
+  input.alias = alias;
+  const variables = { input };
+  const { data } = await apollo.query({ query, variables });
+  if (!data || !data.contentAlias) return null;
+  return get(data, 'contentAlias.siteContext.path');
+};

package/express/get-redirect.js

@@ -0,0 +1,44 @@
+const gql = require('graphql-tag');
+
+const query = gql`
+  query WebsiteRedirect($input: WebsiteRedirectQueryInput!) {
+    websiteRedirect(input: $input) {
+      to
+      code
+    }
+  }
+`;
+
+/**
+ * @param {object} req The Express request object.
+ * @param {function} [handler] An optional redirect handler to execute if no redirect was found.
+ *                             Must return an object of `{ to, code }` or `null`
+ * @param {object} app The Express app object.
+ */
+module.exports = async (req, handler, app) => {
+  const { apollo, path, query: params } = req;
+  const from = path.replace(/\/$/, '');
+  const variables = { input: { from, params } };
+  const { data } = await apollo.query({ query, variables });
+  const { websiteRedirect } = data;
+  const { to } = websiteRedirect || {};
+  if (to) return websiteRedirect;
+  const pathDecoded = decodeURIComponent(from);
+  if (pathDecoded !== from) {
+    const variablesForDecoded = { input: { from: pathDecoded, params } };
+    const { data: dataForDecoded } = await apollo.query({ query, variables: variablesForDecoded });
+    const { websiteRedirect: decodedRedirect } = dataForDecoded;
+    const { to: redirectToDecoded } = decodedRedirect || {};
+    if (redirectToDecoded) return decodedRedirect;
+  }
+  // Attempt to find a redirect using the handler.
+  if (typeof handler !== 'function') return null;
+  const result = await handler({
+    from,
+    params,
+    req,
+    app,
+  });
+  if (!result || !result.to) return null;
+  return { ...result, code: result.code || 301 };
+};

package/express/graphql-proxy.js

@@ -0,0 +1,17 @@
+const proxy = require('express-http-proxy');
+
+module.exports = (app, { graphqlUri, headers }) => {
+  const mountPoint = '/__graphql';
+  const opts = {
+    proxyReqPathResolver: ({ originalUrl }) => originalUrl.replace(mountPoint, ''),
+    proxyReqOptDecorator: (reqOpts, req) => {
+      const proxyHeaders = {
+        ...reqOpts.headers,
+        ...headers,
+        'x-forwarded-proto': req.protocol,
+      };
+      return { ...reqOpts, headers: proxyHeaders };
+    },
+  };
+  app.use(mountPoint, proxy(graphqlUri, opts));
+};

package/express/index.js

@@ -0,0 +1,153 @@
+const { buildRequestHeaders } = require('@mindful-web/tenant-context');
+const createApolloClient = require('@mindful-web/apollo-ssr');
+const { cleanMarkoResponse, markoMiddleware } = require('@mindful-web/marko-express/middleware');
+const cookieParser = require('cookie-parser');
+const express = require('express');
+const path = require('path');
+const helmet = require('helmet');
+const { nanoid } = require('nanoid');
+const apollo = require('./apollo');
+const graphqlProxy = require('./graphql-proxy');
+const embeddedMedia = require('./embedded-media');
+const loadObject = require('./load-object');
+const loadDocument = require('./load-document');
+const oembed = require('./oembed');
+const cdn = require('./cdn');
+const assetLoader = require('./asset-loader');
+const cssLoader = require('./css-loader');
+const rss = require('./rss');
+const sitemaps = require('./sitemaps');
+const { version } = require('../package.json');
+const websiteContext = require('./website-context');
+const CoreConfig = require('../config/core');
+const SiteConfig = require('../config/site');
+
+module.exports = (config = {}) => {
+  const {
+    rootDir,
+    tenantKey,
+    siteId,
+    sitePackage,
+    graphqlUri,
+    baseBrowseGraphqlUri,
+    gqlCacheResponses,
+    gqlCacheSiteContext,
+  } = config;
+  const distDir = path.resolve(rootDir, 'dist');
+  const app = express();
+  const serverDir = path.resolve(rootDir, 'server');
+
+  app.use((req, res, next) => {
+    // set unique request id.
+    req.id = nanoid();
+    next();
+  });
+
+  // Add async block error handler.
+  app.locals.onAsyncBlockError = config.onAsyncBlockError;
+
+  // Register global document, components and fragments.
+  app.locals.components = loadObject(config.components);
+  app.locals.fragments = loadObject(config.fragments);
+  app.locals.document = loadDocument(config.document);
+
+  // Register compiled Vue components for use with SSR rendering
+  app.locals.compiledVueComponents = require(path.join(distDir, 'ssr.js')); // eslint-disable-line
+
+  // Add cookie parsing
+  app.use(cookieParser());
+
+  // Add helment
+  if (config.helmetConfig !== false) {
+    app.use(helmet({
+      ...config.helmetConfig,
+      frameguard: false,
+    }));
+  }
+
+  // Set the tenant key to the app.
+  app.locals.tenantKey = tenantKey;
+
+  // Set the core config.
+  app.locals.config = new CoreConfig({ ...config.coreConfig, rootDir, distDir });
+
+  // Set the website config to the app.
+  app.locals.site = new SiteConfig(config.siteConfig);
+
+  // Apply embedded media handlers.
+  embeddedMedia(app, config.embeddedMediaHandlers);
+
+  // Apply request origin.
+  app.use((req, res, next) => {
+    res.locals.requestOrigin = `${req.protocol}://${req.get('host')}`;
+    next();
+  });
+
+  // Apply versions.
+  app.use((req, res, next) => {
+    res.set('x-version', `Site:${sitePackage.version}|Core:${version}`);
+    next();
+  });
+
+  // Register apollo client and server proxy.
+  const headers = {
+    ...buildRequestHeaders({ tenantKey, siteId }),
+    ...(gqlCacheSiteContext && { 'x-cache-site-context': 'true' }),
+    ...(gqlCacheResponses && { 'x-cache-responses': 'true' }),
+  };
+  apollo(app, graphqlUri, {
+    name: sitePackage.name,
+    version: sitePackage.version,
+    link: { headers },
+  });
+  graphqlProxy(app, { graphqlUri, headers });
+
+  // Base browse middleware
+  if (baseBrowseGraphqlUri) {
+    app.use((req, res, next) => {
+      const client = createApolloClient({
+        uri: baseBrowseGraphqlUri,
+        headers: { 'x-tenant-key': tenantKey },
+        config: { name: sitePackage.name, version: sitePackage.version },
+      });
+      req.$baseBrowse = client;
+      res.locals.$baseBrowse = client;
+      next();
+    });
+  }
+
+  // Set website context.
+  app.use(websiteContext(app.locals.config));
+
+  // Load CDN info before dist and CSS loading (but after the website context).
+  app.use(cdn({
+    enabled: ['true', '1'].includes(process.env.USE_ASSET_CDN),
+    origin: process.env.ASSET_CDN_ORIGIN || 'https://cdn.parameter1.com',
+    siteVersion: sitePackage.version,
+  }));
+  app.use(cssLoader({ distDir }));
+  app.use(assetLoader({ distDir }));
+
+  // Register the Marko middleware.
+  app.use(markoMiddleware());
+  app.use(cleanMarkoResponse());
+
+  // Serve static assets
+  app.use('/dist/css', express.static(`${distDir}/css`, { maxAge: '2y', immutable: true }));
+  app.use('/dist/js', express.static(`${distDir}/js`, { maxAge: '2y', immutable: true }));
+  app.use('/dist', express.static(distDir));
+
+  // Register public files.
+  app.use(express.static(path.join(serverDir, 'public')));
+
+  // Register sitemaps.
+  sitemaps(app, { ...config.sitemapsHeaders, ...headers });
+
+  // Register RSS Feeds.
+  rss(app, headers);
+
+  // Register oEmbed
+  oembed(app);
+
+  return app;
+};

package/express/json-error-handler.js

@@ -0,0 +1,30 @@
+const isDev = require('../utils/is-dev');
+
+const { isArray } = Array;
+
+const render = (res, { status, err }) => {
+  const { message, stack } = err;
+  const obj = { error: true, status, message };
+  if (isDev && stack) obj.stack = stack.split('\n');
+  res.status(status).json(obj);
+};
+
+const renderNetworkErrorResult = (res, { status, result }) => {
+  const message = result.errors && isArray(result.errors) ? result.errors[0].message : 'Unknown fatal.';
+  render(res, { status, err: new Error(message) });
+};
+
+// eslint-disable-next-line no-unused-vars
+module.exports = () => (err, req, res, next) => {
+  const status = err.statusCode || err.status || 500;
+  const { networkError } = err;
+  if (networkError) {
+    if (networkError.result) {
+      renderNetworkErrorResult(res, { status, result: networkError.result });
+    } else {
+      render(res, { status, err: networkError });
+    }
+  } else {
+    render(res, { status, err });
+  }
+};

package/express/load-document.js

@@ -0,0 +1,3 @@
+const defaultDocument = require('../components/document');
+
+module.exports = (document) => document || defaultDocument;

package/express/load-more.js

@@ -0,0 +1,6 @@
+const withLoadMore = require('../middleware/with-load-more');
+
+module.exports = (app) => {
+  const { config } = app.locals;
+  app.use(config.loadMoreMountPoint(), withLoadMore());
+};

package/express/load-object.js

@@ -0,0 +1,10 @@
+const { getAsObject, get } = require('@mindful-web/object-path');
+const { dasherize } = require('@mindful-web/inflector');
+
+const { keys } = Object;
+
+module.exports = (value) => {
+  const v = getAsObject(value);
+  const obj = keys(v).reduce((o, k) => ({ ...o, [dasherize(k)]: v[k] }), {});
+  return { get: (name) => get(obj, dasherize(name)) };
+};

package/express/oembed.js

@@ -0,0 +1,18 @@
+const proxy = require('express-http-proxy');
+
+const { OEMBED_URI } = process.env;
+if (!OEMBED_URI) throw new Error('Missing required environment variable: OEMBED_URI.');
+
+module.exports = (app) => {
+  const { config } = app.locals;
+  const mountPoint = config.oembedMountPoint();
+  const opts = {
+    proxyReqPathResolver: ({ originalUrl }) => originalUrl.replace(mountPoint, '/'),
+    proxyReqOptDecorator: (reqOpts, req) => {
+      const headers = { ...reqOpts.headers };
+      headers['x-forwarded-proto'] = req.protocol;
+      return { ...reqOpts, headers };
+    },
+  };
+  app.use(mountPoint, proxy(OEMBED_URI, opts));
+};

package/express/rss.js

@@ -0,0 +1,19 @@
+const proxy = require('express-http-proxy');
+
+const SERVICE_URI = process.env.RSS_URI;
+if (!SERVICE_URI) throw new Error('Missing required environment variable: RSS_URI.');
+
+module.exports = (app, tenantContext) => {
+  const { config } = app.locals;
+  const mountPoint = config.rssMountPoint();
+  const opts = {
+    proxyReqPathResolver: ({ originalUrl }) => originalUrl.replace(mountPoint, ''),
+    proxyReqOptDecorator: (reqOpts, req) => {
+      const headers = { ...reqOpts.headers, ...tenantContext };
+      headers['x-forwarded-proto'] = req.protocol;
+      headers['x-mount-point'] = mountPoint;
+      return { ...reqOpts, headers };
+    },
+  };
+  app.use(`${mountPoint}/:query([a-z-]+).xml`, proxy(SERVICE_URI, opts));
+};

package/express/sitemaps.js

@@ -0,0 +1,16 @@
+const proxy = require('express-http-proxy');
+
+const SERVICE_URI = process.env.SITEMAPS_URI;
+if (!SERVICE_URI) throw new Error('Missing required environment variable: SITEMAPS_URI.');
+
+module.exports = (app, tenantContext) => {
+  const opts = {
+    proxyReqPathResolver: ({ originalUrl }) => originalUrl,
+    proxyReqOptDecorator: (reqOpts, req) => {
+      const headers = { ...reqOpts.headers, ...tenantContext };
+      headers['x-forwarded-proto'] = req.protocol;
+      return { ...reqOpts, headers };
+    },
+  };
+  app.use('/sitemap*', proxy(SERVICE_URI, opts));
+};

package/express/website-context.js

@@ -0,0 +1,19 @@
+const loadWebsite = require('@mindful-web/web-common/website-context');
+const { asyncRoute } = require('@mindful-web/utils');
+const { setDayjsLocale } = require('@mindful-web/dayjs/utils');
+
+module.exports = (coreConfig) => asyncRoute(async (req, res, next) => {
+  const { apollo } = res.locals;
+  const websiteContext = await loadWebsite(apollo);
+  coreConfig.setWebsiteContext(websiteContext);
+
+  const locale = coreConfig.website('date.locale');
+  // Set marko core date config.
+  req.app.locals.markoCoreDate = {
+    timezone: coreConfig.website('date.timezone'),
+    locale,
+    format: coreConfig.website('date.format'),
+  };
+  setDayjsLocale({ locale });
+  next();
+});

package/index.js

@@ -0,0 +1,8 @@
+if (process.env.MARKO_REQUIRE_PREBUILT_TEMPLATES == null) {
+  // force prebuilt templates if env not set
+  process.env.MARKO_REQUIRE_PREBUILT_TEMPLATES = true;
+}
+
+const startServer = require('./start-server');
+
+module.exports = { startServer };