change the way static server works

now routes, directory & serve static are handled as simple middleware additions

Author: shakyShane

lib/server/proxy-server.js

@@ -67,27 +67,34 @@ module.exports = function createProxyServer (bs, scripts) {
     var target      = opt.get("target");
     var proxyReq    = getProxyReqFunctions(opt.get("proxyReq"), opt, bs);
     var proxyRes    = getProxyResFunctions(opt.get("proxyRes"), opt);
-    var app         = utils.getBaseApp(bs, scripts);
-
-    app.stack.push({
-        id: "Browsersync Proxy",
-        route: opt.get("route"),
-        handle: function (req, res) {
-            proxy.web(req, res, {
-                target: target
-            });
-        }
-    });
+
+    /**
+     * Add the proxy middleware to any given by the user
+     */
+    var middlewareAdded = bs.options
+        .update("middleware", function (mw) {
+            return mw.concat({
+                id: "Browsersync Proxy",
+                route: opt.get("route"),
+                handle: function (req, res) {
+                    proxy.web(req, res, {
+                        target: target
+                    });
+                }
+            })
+        });
+
+    var app  = utils.getBaseApp(bs, middlewareAdded, scripts);
 
     /**
      * @type {*|{server, app}}
      */
-    var p = utils.getServer(app, bs.options);
-    p.proxy = proxy;
+    var browserSyncServer = utils.getServer(app, bs.options);
+    browserSyncServer.proxy = proxy;
 
     if (opt.get("ws")) {
         // debug(`+ ws upgrade for: ${x.get("target")}`);
-        p.server.on("upgrade", function (req, socket, head) {
+        browserSyncServer.server.on("upgrade", function (req, socket, head) {
             proxy.ws(req, socket, head);
         });
     }
@@ -124,7 +131,7 @@ module.exports = function createProxyServer (bs, scripts) {
         });
     }
 
-    return p;
+    return browserSyncServer;
 };
 
 /**

lib/server/static-server.js

@@ -1,7 +1,11 @@
 "use strict";
 
 var connect      = require("connect");
-var utils        = require("./utils.js");
+var serverUtils  = require("./utils.js");
+var resolve      = require("path").resolve;
+var utils        = require("../utils.js");
+var serveStatic  = require("serve-static");
+var serveIndex   = require("serve-index");
 
 /**
  * @param {BrowserSync} bs
@@ -13,54 +17,60 @@ module.exports = function createServer (bs, scripts) {
     var options            = bs.options;
     var server             = options.get("server");
     var middleware         = options.get("middleware");
-    var basedir            = server.get("baseDir");
-    var serveStaticOptions = server.get("serveStaticOptions");
+    var basedirs           = utils.arrayify(server.get("baseDir"));
+    var serveStaticOptions = server.get("serveStaticOptions").toJS(); // passed to 3rd party
 
-    var app = connect();
+    var _serveStatic = 0;
+    var _routes = 0;
+    var middlewareAdded = bs.options
+        /**
+         * Add directory Middleware if given in server.directory
+         */
+        .update("middleware", function (mw) {
+            if (!server.has("directory")) {
+                return mw;
+            }
 
-    /**
-     * Handle Old IE
-     */
-    app.use(utils.handleOldIE);
+            return mw.concat({
+                route: "",
+                handle: serveIndex(resolve(basedirs[0]), {icons:true}),
+                id: "Browsersync Server Directory Middleware"
+            });
+        })
+        /**
+         * Add middleware for server.baseDir Option
+         */
+        .update("middleware", function (mw) {
+            return mw.concat(basedirs.map(function (root) {
+                return {
+                    route: "",
+                    id: "Browsersync Server ServeStatic Middleware - " + _serveStatic++,
+                    handle: serveStatic(resolve(root), serveStaticOptions)
+                }
+            }));
+        })
+        /**
+         * Add middleware for server.routes
+         */
+        .update("middleware", function (mw) {
 
-    /**
-     * Serve the Client-side JS from both version and static paths
-     */
-    app.use(options.getIn(["scriptPaths", "versioned"]), scripts)
-        .use(options.getIn(["scriptPaths", "path"]),     scripts);
+            if (!server.has("routes")) {
+                return mw;
+            }
 
-    /**
-     * Add directory middleware
-     */
-    if (server.get("directory")) {
-        utils.addDirectory(app, basedir);
-    }
-
-    /**
-     * Add snippet injection middleware
-     * This also includes any additional middleware given from the user
-     */
-    app.use(bs.snippetMw.middleware);
+            return mw.concat(server.get("routes").map(function (root, urlPath) {
+                return {
+                    route: urlPath,
+                    id: "Browsersync Server Routes Middleware - " + _routes++,
+                    handle: serveStatic(resolve(root))
+                }
+            }));
+        });
 
-    /**
-     * Add user-provided middlewares
-     */
-    utils.addMiddleware(app, middleware);
-
-    /**
-     * Add Serve static middlewares
-     */
-    utils.addBaseDir(app, basedir, serveStaticOptions);
-
-    /**
-     * Add further Serve static middlewares for routes
-     */
-    if (server.get("routes")) {
-        utils.addRoutes(app, server.get("routes").toJS());
-    }
+    var app = serverUtils.getBaseApp(bs, middlewareAdded, scripts);
 
     /**
      * Finally, return the server + App
      */
-    return utils.getServer(app, bs.options);
+    return serverUtils.getServer(app, bs.options);
 };

lib/server/utils.js

@@ -2,70 +2,12 @@
 
 var fs           = require("fs");
 var filePath     = require("path");
-var serveIndex   = require("serve-index");
-var serveStatic  = require("serve-static");
-var _            = require("lodash");
 var connect      = require("connect");
 var http         = require("http");
 var https        = require("https");
-var Immutable    = require("immutable");
-var isList       = Immutable.List.isList;
-var snippetUtils = require("./../snippet").utils;
+var snippet      = require("./../snippet").utils;
 
 var utils = {
-    /**
-     * @param app
-     * @param middleware
-     * @returns {*}
-     */
-    addMiddleware: function (app, middleware) {
-
-        middleware.forEach(function (item) {
-            app.use(item);
-        });
-
-        return app;
-    },
-    /**
-     * @param app
-     * @param base
-     * @param opts
-     */
-    addBaseDir: function (app, base, opts) {
-
-        opts = opts.toJS();
-
-        if (isList(base)) {
-            base.forEach(function (item) {
-                app.use(serveStatic(filePath.resolve(item), opts));
-            });
-        } else {
-            if (_.isString(base)) {
-                app.use(serveStatic(filePath.resolve(base), opts));
-            }
-        }
-    },
-    /**
-     * @param app
-     * @param base
-     */
-    addDirectory: function (app, base) {
-        if (isList(base)) {
-            base = base.get(0);
-        }
-        app.use(serveIndex(filePath.resolve(base), {icons:true}));
-    },
-    /**
-     * @param app
-     * @param {Object} routes
-     */
-    addRoutes: function (app, routes) {
-        Object.keys(routes).forEach(function (key) {
-            if (_.isString(key) && _.isString(routes[key])) {
-                app.use(key, serveStatic(filePath.resolve(routes[key])));
-            }
-        });
-    },
     /**
      * @param options
      * @returns {{key, cert}}
@@ -85,16 +27,6 @@ var utils = {
             pfx: fs.readFileSync(filePath)
         };
     },
-    /**
-     * @param req
-     * @param res
-     * @param next
-     * @returns {*}
-     */
-    handleOldIE: function (req, res, next) {
-        snippetUtils.isOldIe(req);
-        return next();
-    },
     /**
      * Get either an http or https server
      */
@@ -112,7 +44,7 @@ var utils = {
             app: app
         };
     },
-    getBaseApp: function (bs, scripts) {
+    getBaseApp: function (bs, options, scripts) {
 
         var app  = connect();
 
@@ -123,7 +55,7 @@ var utils = {
             {
                 id: "Browsersync IE8 Support",
                 route: "",
-                handle: utils.handleOldIE
+                handle: snippet.isOldIe(options.get("excludedFileTypes").toJS())
             },
             {
                 id: "Browsersync Response Modifier",
@@ -145,8 +77,13 @@ var utils = {
         /**
          * Add user-provided middlewares
          */
-        bs.options.get("middleware").forEach(function (item) {
-            app.use(item);
+        options.get("middleware").forEach(function (item) {
+            if (typeof item === "function") {
+                return app.use(item);
+            }
+            if ((item.route !== undefined) && item.handle) {
+                app.stack.push(item);
+            }
         });
 
         return app;

lib/snippet.js

@@ -5,14 +5,14 @@ var config       = require("./config");
 
 var lrSnippet    = require("resp-modifier");
 var path         = require("path");
-var List         = require("immutable").List;
 var _            = require("lodash");
+var utils        = require("./utils");
 var fs           = require("fs");
 
 /**
  * Utils for snippet injection
  */
-var utils = {
+var snippetUtils = {
     /**
      * @param {String} url
      * @param {Array} excludeList
@@ -51,46 +51,48 @@ var utils = {
         };
     },
     getSnippetMiddleware: function (snippet, options, rewriteRules) {
-        return lrSnippet.create(utils.getRules(snippet, options, rewriteRules));
+        return lrSnippet.create(snippetUtils.getRules(snippet, options, rewriteRules));
     },
     getRules: function (snippet, options, rewriteRules) {
 
-        var rules = [utils.getRegex(snippet, options)];
+        var rules = [snippetUtils.getRegex(snippet, options)];
 
         if (rewriteRules) {
             rules = rules.concat(rewriteRules);
         }
 
         return {
             rules: rules,
-            blacklist: utils.arrify(options.get("blacklist")),
-            whitelist: utils.arrify(options.get("whitelist"))
+            blacklist: utils.arrayify(options.get("blacklist")),
+            whitelist: utils.arrayify(options.get("whitelist"))
         };
     },
     /**
      * @param {Object} req
      * @param {Array} [excludeList]
      * @returns {Object}
      */
-    isOldIe: function (req, excludeList) {
-        var ua = req.headers["user-agent"];
-        var match = /MSIE (\d)\.\d/.exec(ua);
-        if (match) {
-            if (parseInt(match[1], 10) < 9) {
-                if (!utils.isExcluded(req.url, excludeList)) {
-                    req.headers["accept"] = "text/html";
+    isOldIe: function (excludeList) {
+        return function (req, res, next) {
+            var ua = req.headers["user-agent"];
+            var match = /MSIE (\d)\.\d/.exec(ua);
+            if (match) {
+                if (parseInt(match[1], 10) < 9) {
+                    if (!snippetUtils.isExcluded(req.url, excludeList)) {
+                        req.headers["accept"] = "text/html";
+                    }
                 }
             }
+            next();
         }
-        return req;
     },
     /**
      * @param {Number} port
      * @param {BrowserSync.options} options
      * @returns {String}
      */
     getClientJs: function (port, options) {
-        var socket = utils.getSocketScript();
+        var socket = snippetUtils.getSocketScript();
         var noConflictJs = "window.___browserSync___oldSocketIo = window.io;";
         return noConflictJs + socket + ";" + connectUtils.socketConnector(options);
     },
@@ -99,16 +101,6 @@ var utils = {
      */
     getSocketScript: function () {
         return fs.readFileSync(path.join(__dirname, config.socketIoScript), "utf-8");
-    },
-    /**
-     * @param {Immutable.List|Array|String} incoming
-     * @returns {Array}
-     */
-    arrify: function (incoming) {
-        if (List.isList(incoming)) {
-            return incoming.toArray();
-        }
-        return [].concat(incoming).filter(Boolean);
     }
 };
-module.exports.utils = utils;
+module.exports.utils = snippetUtils;