@airyrooms/catela/server/ExpressUniversalApplicationServer.js

import 'logger/server'
import async from 'async'
import cookie from 'cookie'
import bodyParser from 'body-parser'
import cookieParser from 'cookie-parser'
import express from 'express'
import InternationalizationHandler from 'i18n/InternationalizationHandler'
import UniversalPageHandler from 'handler/UniversalPageHandler'
import path from 'path'
import preconditions from 'preconditions'
import querystring from 'querystring'
import React from 'react'
import { renderToStaticMarkup } from 'react-dom/server'
import { Provider } from 'react-redux'
import { Route, RouterContext, match } from 'react-router'
import { createStore, combineReducers, applyMiddleware } from 'redux'
import thunk from 'redux-thunk'
import SimpleHtmlRenderer from 'render/SimpleHtmlRenderer'
import { serverFetchReducer } from 'fetch/core'
import resolve from 'es6-template-strings/resolve-to-string'
import forceDomain from 'forcedomain'
import url from 'url'
import rfs from 'rotating-file-stream'
import morgan from 'morgan'
import fs from 'fs'
import parseUrl from 'parseurl'

let project = __PROJECT__
let logger = global.Logger.getLogger('ExpressUniversalApplicationServer')
// Currently supported locale is /{lang}-{country}/*
let LOCALE_REGEX = /^\/([a-z]{2})-([a-z]{2})(.*)$/
let LOCALE_DEFAULT = 'id-id'

let QS_REGEX = /^\?(.*)$/

const createStoreWithMiddleware = applyMiddleware(
  thunk
)(createStore)

// handle error, so that server won't crash
process.on('uncaughtException', function (err) {
  console.log("[CRASH] [ERROR] error log: ", err)
})

class ExpressUniversalApplicationServer {
  constructor (options) {
    let pc = preconditions.instance(options)
    pc.shouldBeDefined('port', 'port must be defined.')
    pc.shouldBeDefined('rootApplicationPath', 'rootApplicationPath must be defined.')
    pc.shouldBeDefined('rootDeploymentApplicationPath', 'rootDeploymentApplicationPath must be defined.')
    this._options = options
    this._app = express()
    this._routes = this.getRoutes()
    this._reducers = this.getReducers()
    this._initialize()
  }

  _initialize () {
    // this._setupRequestLogMiddleware()
    this._setupForceDomain()
    this._setupAssetsServing()
    this._setupCookieParser()
    this._setupBodyParser()
    this._setupHtmlRenderer()
    this._setupInternationalizedRoutes()
    this._setupI18nHandler()
  }

  _setupRequestLogMiddleware () {
    let logDirectory = '/logs/' + project.applicationName
    fs.existsSync(logDirectory) || fs.mkdirSync(logDirectory)

    function pad (num) {
      return (num > 9 ? '' : '0') + num
    }

    function generator (time, index) {
      logger.info('[GENERATOR] Request log rotation ' + time + '-' + index)
      if (!time) {
        // return request.log
      }

      var yearMonth = time.getFullYear() + '-' + pad(time.getMonth() + 1)
      var day = pad(time.getDate())
      var hour = pad(time.getHours())
      var minute = pad(time.getMinutes())
      var seconds = pad(time.getSeconds())

      logger.info('[GENERATOR] ' + logDirectory + '/request-' + yearMonth + '-' + day + '-' + hour + '-' + minute + '-' + seconds + '.log.gz')

      return 'request-' + yearMonth + '-' + day + '-' + hour + '-' + minute + '-' + seconds + 'log.gz'
    }

    this._accessLogStream = rfs(generator, {
      path: logDirectory,
      compress: true,
      interval: '10s',
      rotate: 7
    })

    logger.info('Setting up morgan (Request Log Middleware)')
    this._app.use(morgan('combined', { stream: this._accessLogStream }))
  }

  _setupAssetsServing () {
    console.log(path.join(this._options.rootDeploymentApplicationPath, 'build', this._options.environment, 'client'))
    // TODO : this should be configurable, but we hard code it for now
    logger.info('Using ' + path.join(this._options.rootDeploymentApplicationPath, 'build', this._options.environment, 'client') + ', with /assets as assets serving routes')
    this._app.use('/assets', express.static(path.join(this._options.rootDeploymentApplicationPath, 'build', this._options.environment, 'client')))

    logger.info('Using ' + path.join(this._options.rootDeploymentApplicationPath, 'build', this._options.environment, 'server', 'debugging') + ', with /__dev/assets/server/debugging as server-debugging serving routes')
    this._app.use('/__dev/assets/server/debugging', express.static(path.join(this._options.rootDeploymentApplicationPath, 'build', this._options.environment, 'server', 'debugging')))

    // TODO : this should be configurable, but we hard code it for now
    logger.info('Using ' + path.join(this._options.rootDeploymentApplicationPath, 'assets') + ', with /assets/static as static non-compileable assets serving routes')
    this._app.use('/assets/static', express.static(path.join(this._options.rootDeploymentApplicationPath, 'assets')))
  }

  _setupCookieParser () {
    this._app.use(cookieParser())
  }

  _setupBodyParser () {
    this._app.use(bodyParser.urlencoded({ extended: true }))
    this._app.use(bodyParser.json())
  }

  _setupHtmlRenderer () {
    let htmlRendererOptions = {
      path: path.join(this._options.rootDeploymentApplicationPath, 'html'),
      cache: !(this._options.environment === 'development')
    }
    this._renderer = new SimpleHtmlRenderer(htmlRendererOptions)
  }

  _setupInternationalizedRoutes () {
    let finalRoutes = null
    let originalRoutes = this.getRoutes()
    let generatedRoutes = []
    this._options.locales.forEach((locale) => {
      let internationalRoute = (
        <Route key={locale} path={locale} component={InternationalizationHandler}>
          {originalRoutes}
        </Route>
      )
      generatedRoutes.push(internationalRoute)
    })

    generatedRoutes.push(originalRoutes)

    finalRoutes = (
      <Route path='/' component={UniversalPageHandler}>
        {
          generatedRoutes.map((route) => {
            return route
          })
        }
      </Route>
    )

    this._routes = finalRoutes
  }

  _setupI18nHandler () {
    this._app.use((req, res, next) => {
      let match = LOCALE_REGEX.exec(req.url)
      let url = null
      if (match != null) {
        let lang = match[1]
        let country = match[2]
        url = match[3]
        req.locale = lang + '-' + country
      } else {
        req.locale = LOCALE_DEFAULT
      }
      if (this._options.locales.indexOf(req.locale) >= 0) {
        next()
      } else {
        if (this._options.locales.length === 0) {
          next()
        } else {
          if (url == null || typeof url === 'undefined' || url.length === 0) {
            res.redirect('/')
          } else {
            res.redirect(url)
          }
        }
      }
    })
  }

  _isIP (host) {
    let ipRegex = /^(?!0)(?!.*\.$)((1?\d?\d|25[0-5]|2[0-4]\d)(\.|$)){4}$/
    return ipRegex.test(host)
  }

  _setupForceDomain () {
    let protocol = 'http'
    if (this._options.forceHttps === true) {
      protocol = 'https'
    }
    let hostName = this._stripProtocol(this._options.applicationHost)
    if (!this._isIP(hostName)) {
      let parsedApplicationHost = url.parse(this._options.applicationHost)
      if (parsedApplicationHost.port == null) {
        this._app.use(forceDomain({
          hostname: parsedApplicationHost.host,
          protocol: protocol
        }))
      }
    }
  }

  _stripProtocol (url) {
    if (url != null && typeof url !== 'undefined') {
      let result = url.replace(/.*?:\/\//g, '')
      return result
    }
    return null
  }

  _handleError500 (message, err, res) {
    logger.error(message, err)
    if (this._options.environment === 'production') {
      res.redirect(this.getErrorHandler())
    } else {
      let error = '<br />'
      if (this._options.environment === 'development') {
        if (err != null && typeof err !== 'undefined') {
          error += err.stack
        }
      }
      error = error.replace('\n', '<br />')
      this._renderer.render('500.html', (err, rendered) => {
        if (err) {
          logger.error('[ERROR_RENDER_FATAL] An unknown error occurred when trying to render error 500.', err)
          return res.status(500).end('An unknown error occurred when trying to render error 500\n' + err.stack)
        } else {
          return res.status(500).end(resolve(rendered, { ERROR: error }))
        }
      })
    }
  }

  _handleNotFound404 (res) {
    this._renderer.render('404.html', (err, rendered) => {
      if (err) {
        logger.error('[ERROR_RENDER_FATAL] An unknown error occurred when trying to render error 404.', err)
        return res.status(500).end('An unknown error occurred when trying to render error 404\n' + err.stack)
      } else {
        return res.status(404).end(resolve(rendered, {}))
      }
    })
  }

  _runFilterPreFetchStage (filterQueue, renderProps, renderedServerComponents, req, res, context) {
    if (filterQueue.length > 0) {
      let filterFnQueue = []
      filterQueue.reverse().forEach((filterFn) => {
        filterFnQueue.push((callback) => {
          let filterCallContext = {
            get: function () {
              return context
            },
            next: function (booleanResult) {
              if (typeof booleanResult === 'undefined' || booleanResult == null) {
                booleanResult = true
              }
              callback(null, booleanResult)
            },
            redirect: function (redirect) {
              callback({ type: 'REDIRECTION', redirect: redirect }, false)
            },
            notFound: function () {
              callback({ type: 'NOT_FOUND' }, false)
            },
            abortWithError: function () {
              callback({ type: 'SERVER_ERROR' }, false)
            }
          }
          filterFn(filterCallContext)
        })
      })
      async.series(filterFnQueue, (err, results) => {
        if (err) {
          if (err.type === 'REDIRECTION') {
            return res.redirect(err.redirect)
          } else if (err.type === 'NOT_FOUND') {
            this._renderer.render('404.html', (err, rendered) => {
              if (err) {
                logger.error('[ERROR_RENDER_FATAL] An unknown error occurred when trying to render error 404.', err)
                return res.status(500).end('An unknown error occurred when trying to render error 404\n' + err.stack)
              } else {
                return res.status(404).end(resolve(rendered, {}))
              }
            })
          } else if (err.type === 'SERVER_ERROR') {
            this._renderer.render('500.html', (err, rendered) => {
              if (err) {
                logger.error('[ERROR_RENDER_FATAL] An unknown error occurred when trying to render error 500.', err)
                return res.status(500).end('An unknown error occurred when trying to render error 500\n' + err.stack)
              } else {
                return res.status(500).end(resolve(rendered, {}))
              }
            })
          } else {
            this._renderer.render('500.html', (err, rendered) => {
              if (err) {
                logger.error('[ERROR_RENDER_FATAL] An unknown error occurred when trying to render error 500.', err)
                return res.status(500).end('An unknown error occurred when trying to render error 500\n' + err.stack)
              } else {
                return res.status(500).end(resolve(rendered, {}))
              }
            })
          }
        } else {
          this._runFetchStage(
            renderProps,
            renderedServerComponents,
            req,
            res,
            context)
        }
      })
    } else {
      this._runFetchStage(
        renderProps,
        renderedServerComponents,
        req,
        res,
        context)
    }
  }

  _runFetchStage (renderProps, renderedServerComponents, req, res, context) {
    let fetchDataQueue = []
    let dataContextObject = {}

    renderedServerComponents.forEach((rsc) => {
      if (rsc.__fetchData != null && typeof rsc.__fetchData !== 'undefined') {
        let fnFetchCall = (callback) => {
          setTimeout(() => {
            rsc.__fetchData(dataContextObject, context, callback)
          }, 1)
        }
        fetchDataQueue.push(fnFetchCall)
      }
    })

    let reducers = this._reducers

    async.series(fetchDataQueue, (err, results) => {
      if (err) {
        return this._handleError500('[FETCH_DATA_ERROR] An unknown error occurred when trying to fetch data.', err, res)
      } else {
        let fetchedDataContext = {}
        results.forEach((result) => {
          fetchedDataContext = {
            ...fetchedDataContext,
            ...result
          }
        })

        let allReducers = {
          ...reducers,
          view: serverFetchReducer
        }
        const store = createStoreWithMiddleware(combineReducers(allReducers))

        store.dispatch({
          type: '__SET_VIEW_STATE__',
          data: fetchedDataContext
        })

        const InitialComponent = (
          <Provider store={store}>
            <RouterContext {...renderProps} />
          </Provider>
        )

        let postFetchFilterQueue = []

        renderedServerComponents.forEach((rsc) => {
          if (rsc.__postFetchFilter != null && typeof rsc.__postFetchFilter !== 'undefined') {
            postFetchFilterQueue = postFetchFilterQueue.concat(rsc.__postFetchFilter)
          }
        })
        this._runFilterPostFetchStage(
          postFetchFilterQueue,
          store,
          InitialComponent,
          renderedServerComponents,
          req,
          res,
          context)
      }
    })
  }

  _runFilterPostFetchStage (filterQueue, store, InitialComponent, renderedServerComponents, req, res, context) {
    if (filterQueue.length > 0) {
      let filterFnQueue = []
      filterQueue.reverse().forEach((filterFn) => {
        filterFnQueue.push((callback) => {
          let filterCallContext = {
            store: function () {
              return store.getState().view
            },
            get: function () {
              return context
            },
            next: function (booleanResult) {
              if (typeof booleanResult === 'undefined' || booleanResult == null) {
                booleanResult = true
              }
              callback(null, booleanResult)
            },
            redirect: function (redirect) {
              callback({ type: 'REDIRECTION', redirect: redirect }, false)
            },
            notFound: function () {
              callback({ type: 'NOT_FOUND' }, false)
            }
          }
          filterFn(filterCallContext)
        })
      })
      async.series(filterFnQueue, (err, results) => {
        if (err) {
          if (err.type === 'REDIRECTION') {
            return res.redirect(err.redirect)
          } else if (err.type === 'NOT_FOUND') {
            this._renderer.render('404.html', (err, rendered) => {
              if (err) {
                logger.error('[ERROR_RENDER_FATAL] An unknown error occurred when trying to render error 404.', err)
                return res.status(500).end('An unknown error occurred when trying to render error 404\n' + err.stack)
              } else {
                return res.status(404).end(resolve(rendered, {}))
              }
            })
          } else {
            // TODO what case need to be handled?
          }
        } else {
          this._runRenderStage(
            store,
            InitialComponent,
            renderedServerComponents,
            req,
            res,
            context)
        }
      })
    } else {
      this._runRenderStage(
        store,
        InitialComponent,
        renderedServerComponents,
        req,
        res,
        context)
    }
  }

  _createCookieSerializationOption (header) {
    let option = {
      path: header.path,
      domain: header.domain,
      version: header.version
    }

    if (header.maxAge > 0) {
      option.maxAge = header.maxAge
    }

    return option
  }

  _runSendResponseStage (res, PAGE_HTML, context) {
    let responseCookies = context.response.cookies
    let responseHeaders = context.response.headers.cookies

    Object.keys(responseCookies).forEach((krc) => {
      let __cookie = responseCookies[krc]
      let __cookieHeader = {}
      if (responseHeaders != null && typeof responseHeaders !== 'undefined') {
        __cookieHeader = responseHeaders[krc]
      }
      if (__cookie != null && typeof __cookie !== 'undefined') {
        let serializedCookie = cookie.serialize(krc, __cookie, this._createCookieSerializationOption(__cookieHeader))
        res.append('Set-Cookie', serializedCookie)
      }
    })
    res.end(PAGE_HTML)
  }

  _runRenderStage (store, InitialComponent, renderedServerComponents, req, res, context) {
    let finalRenderPage = 'main.html'
    renderedServerComponents.forEach((rsc) => {
      if (rsc.__renderPage != null && typeof rsc.__renderPage !== 'undefined') {
        finalRenderPage = rsc.__renderPage
      }
    })
    let renderBindFnQueue = []
    renderedServerComponents.forEach((rsc) => {
      if (rsc.__renderBindFn != null && typeof rsc.__renderBindFn !== 'undefined') {
        let bindFnCall = (callback) => {
          setTimeout(() => {
            rsc.__renderBindFn(store.getState(), context, callback)
          }, 1)
        }
        renderBindFnQueue.push(bindFnCall)
      }
    })

    if (renderBindFnQueue.length > 0) {
      async.series(renderBindFnQueue, (err, results) => {
        if (err) {
          return this._handleError500('[RENDER_BIND_PHASE] FATAL_ERROR in render data binding phase.', err, res)
        } else {
          this._renderer.render(finalRenderPage, (err, rendered) => {
            if (err) {
              return this._handleError500('[RENDER_VIEW_PHASE] FATAL_ERROR in render view template phase.', err, res)
            } else {
              let bindData = {}
              if (results != null && typeof results !== 'undefined') {
                results.forEach((r) => {
                  bindData = {
                    ...bindData,
                    ...r
                  }
                })
              }
              try {
                const HTML = renderToStaticMarkup(InitialComponent)
                const PAGE_HTML = resolve(rendered, {
                  ...bindData,
                  HTML: HTML,
                  DATA: store.getState()
                }, { partial: true })
                return this._runSendResponseStage(res, PAGE_HTML, context)
              } catch (err) {
                return this._handleError500('[RENDER_STATIC_MARKUP_PHASE] FATAL_ERROR in render staticMarkup phase.', err, res)
              }
            }
          })
        }
      })
    } else {
      this._renderer.render(finalRenderPage, (err, rendered) => {
        if (err) {
          return this._handleError500('[RENDER_VIEW_PHASE] FATAL_ERROR in render view template phase.', err, res)
        } else {
          let bindData = {}
          try {
            const HTML = renderToStaticMarkup(InitialComponent)
            const PAGE_HTML = resolve(rendered, {
              ...bindData,
              HTML: HTML,
              DATA: store.getState()
            }, { partial: true })
            return this._runSendResponseStage(res, PAGE_HTML, context)
          } catch (err) {
            return this._handleError500('[RENDER_STATIC_MARKUP_PHASE] FATAL_ERROR in render staticMarkup phase.', err, res)
          }
        }
      })
    }
  }

  _importRequestCookie (context, req) {
    let cookies = req.cookies
    Object.keys(cookies).forEach((ck) => {
      context.request.cookies[ck] = req.cookies[ck]
    })
  }

  _handleHealthCheck(res) {
    return res.status(200).send('ok')
  }

  _setupRoutingHandler () {
    const routes = this._routes
    this._app.use((req, res) => {
      const location = req.url
      const pathname = parseUrl(req).pathname
      const locale = req.locale

      if (req.url == '/healthz') {
        return this._handleHealthCheck(res)
      }

      logger.info('[HANDLING_ROUTE] path: ' + req.url + ', locale: ' + locale)
      match({ routes, location }, (err, redirectLocation, renderProps) => {
        if (err) {
          return this._handleError500('[MATCH_ROUTE_FATAL_ERROR] An unknown error occurred when trying to match routes.', err, res)
        }

        if (!renderProps) {
          logger.info('[ROUTE_NOT_FOUND] path: ' + req.url + ', locale: ' + locale)
          return this._handleNotFound404(res)
        }

        let query = {}
        let queryStringMatch = QS_REGEX.exec(renderProps.location.search)
        let queryString = ''
        if (queryStringMatch != null && typeof queryStringMatch !== 'undefined') {
          queryString = queryStringMatch[1]
        }
        if (queryString != null && typeof queryString !== 'undefined') {
          query = querystring.parse(queryString)
        }

        let simplifiedRoutes = {
          name: renderProps.routes[renderProps.routes.length - 1].name,
          path: renderProps.routes[renderProps.routes.length - 1].path
        }

        let context = {
          host: this._options.applicationHost,
          url: req.url,
          path: pathname,
          locale: locale,
          params: renderProps.params,
          query: query,
          routes: simplifiedRoutes,
          environment: this._options.environment,
          server: true,
          client: false,
          useragent: req.useragent,
          request: {
            cookies: {},
            headers: {}
          },
          response: {
            cookies: {},
            headers: {}
          }
        }

        this._importRequestCookie(context, req)

        let renderedServerComponents = renderProps.components
        let preFetchFilterQueue = []

        renderedServerComponents.forEach((rsc) => {
          if (rsc.__preFetchFilter != null && typeof rsc.__preFetchFilter !== 'undefined') {
            preFetchFilterQueue = preFetchFilterQueue.concat(rsc.__preFetchFilter)
          }
        })

        this._runFilterPreFetchStage(
          preFetchFilterQueue,
          renderProps,
          renderedServerComponents,
          req,
          res,
          context
        )
      })
    })
  }

  app () {
    return this._app
  }

  getErrorHandler () {
    return '/'
  }

  run () {
    this._setupRoutingHandler()
    this._app.listen(this._options.port, (err) => {
      if (err) logger.error(err)
      else {
        logger.info('[EXPRESS_UNIVERSAL_APPLICATION_SERVER] Server listening on port : ' + this._options.port)
      }
    })

    let pingApp = express()
    pingApp.use('/ping', (req, res) => {
      res.end('pong')
    })
    pingApp.listen(this._options.pingPort, (err) => {
      if (err) logger.error(err)
      else {
        logger.info('[EXPRESS_UNIVERSAL_APPLICATION_SERVER] Ping server listening on port : ' + this._options.pingPort)
      }
    })
  }
}

export default ExpressUniversalApplicationServer