feat(server): add host replace middleware

Author: yuhaoju

lib/commands/server.js

@@ -32,6 +32,7 @@ var connect = require('connect'),
     logSymbols = require('log-symbols'),
     favicon = require('serve-favicon'),
     webpackDevMiddleware = require('webpack-dev-middleware'),
+    hostReplaceMiddleware = require('../modules/HostReplaceMiddleware'),
     httpProxy = require('http-proxy-middleware');
 
 var Manager = require('../modules/manager.js');
@@ -193,6 +194,8 @@ exports.run = function (options) {
         }
     });
 
+    app.use(hostReplaceMiddleware);
+
     // compiler
     app.use(function (req, res, next) {
         var url = req.url,

lib/modules/HostReplaceMiddleware.js

@@ -0,0 +1,61 @@
+'use strict';
+
+var _keys = require('babel-runtime/core-js/object/keys');
+
+var _keys2 = _interopRequireDefault(_keys);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var fs = require('fs');
+var path = require('path');
+
+var Manager = require('../modules/manager.js');
+var utilMw = require('../utils/middleware.js');
+var utilFs = require('../utils/fs.js');
+
+var tmplExtensions = ['.html', '.vm', '.string'];
+
+module.exports = function (req, res, next) {
+    var projectInfo = utilMw.getProjectInfo(req);
+    var project = Manager.getProject(projectInfo.projectCwd, { cache: false });
+    var extName = path.extname(req.url);
+
+    if (tmplExtensions.indexOf(extName) > -1) {
+        var htmlFilePath = path.join(projectInfo.projectCwd, req.url.replace(/.+\/src\//, 'src/'));
+
+        var replacedContent = handleHtmlContent(htmlFilePath);
+
+        if (!replacedContent) {
+            next();
+        } else {
+            res.setHeader('Content-Type', 'text/html; charset=UTF-8');
+            res.writeHead(200);
+            res.end(replacedContent);
+        }
+    } else {
+        next();
+    }
+
+    function handleHtmlContent(htmlFilePath) {
+        if (!utilFs.fileExists(htmlFilePath)) {
+            return '';
+        }
+
+        var htmlContent = fs.readFileSync(htmlFilePath, 'utf-8');
+
+        var staticHost = project.server && project.server.staticHost;
+        if (staticHost) {
+            (0, _keys2.default)(staticHost).map(function (hostName) {
+                var hostReg = new RegExp('(src|href)=("|\')//(' + hostName + ')', 'g');
+
+                var matches = void 0;
+                while ((matches = hostReg.exec(htmlContent)) !== null) {
+                    var host = matches[3];
+                    htmlContent = htmlContent.replace(host, staticHost[hostName]);
+                }
+            });
+        }
+
+        return htmlContent;
+    }
+};

lib/utils/middleware.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var path = require('path');
+
+module.exports = {
+    getProjectInfo: function getProjectInfo(req) {
+        var url = req.url,
+            keys = url.split('/'),
+            projectName = keys[1],
+            projectCwd = path.join(process.cwd(), projectName);
+
+        return {
+            projectName: projectName,
+            projectCwd: projectCwd
+        };
+    }
+};

src/commands/server.js

@@ -14,6 +14,7 @@ const connect = require('connect'),
     logSymbols = require('log-symbols'),
     favicon = require('serve-favicon'),
     webpackDevMiddleware = require('webpack-dev-middleware'),
+    hostReplaceMiddleware = require('../modules/HostReplaceMiddleware'),
     httpProxy = require('http-proxy-middleware');
 
 const Manager = require('../modules/manager.js');
@@ -175,6 +176,8 @@ exports.run = (options) => {
         }
     });
 
+    app.use(hostReplaceMiddleware);
+
     // compiler
     app.use(function (req, res, next) {
         let url = req.url,

src/modules/HostReplaceMiddleware.js

@@ -0,0 +1,58 @@
+'use strict';
+
+const fs = require('fs');
+const path = require('path');
+
+const Manager = require('../modules/manager.js');
+const utilMw = require('../utils/middleware.js');
+const utilFs = require('../utils/fs.js');
+
+const tmplExtensions = ['.html', '.vm', '.string'];
+
+module.exports = function(req, res, next) {
+    const projectInfo = utilMw.getProjectInfo(req);
+    const project = Manager.getProject(projectInfo.projectCwd, { cache: false });
+    const extName = path.extname(req.url);
+
+    if(tmplExtensions.indexOf(extName) > -1) {
+        const htmlFilePath = path.join(
+            projectInfo.projectCwd,
+            req.url.replace(/.+\/src\//, 'src/')
+        );
+
+        const replacedContent = handleHtmlContent(htmlFilePath);
+
+        if(!replacedContent) {
+            next();
+        } else {
+            res.setHeader('Content-Type', 'text/html; charset=UTF-8');
+            res.writeHead(200);
+            res.end(replacedContent);
+        }
+    } else {
+        next();
+    }
+
+    function handleHtmlContent(htmlFilePath) {
+        if(!utilFs.fileExists(htmlFilePath)) {
+            return '';
+        }
+
+        let htmlContent = fs.readFileSync(htmlFilePath, 'utf-8');
+
+        const staticHost = project.server && project.server.staticHost;
+        if(staticHost) {
+            Object.keys(staticHost).map((hostName) => {
+                const hostReg = new RegExp(`(src|href)=("|')\/\/(${hostName})`, 'g');
+
+                let matches;
+                while((matches = hostReg.exec(htmlContent)) !== null) {
+                    const host = matches[3];
+                    htmlContent = htmlContent.replace(host, staticHost[hostName]);
+                }
+            });
+        }
+
+        return htmlContent;
+    }
+};

src/utils/middleware.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var path = require('path');
+
+module.exports = {
+    getProjectInfo: function(req) {
+        var url = req.url,
+            keys = url.split('/'),
+            projectName = keys[1],
+            projectCwd = path.join(process.cwd(), projectName);
+
+        return {
+            projectName: projectName,
+            projectCwd: projectCwd
+        };
+    }
+};