需求概述

某项目后台使用nodejs和express，前端js需要获取后台的某些配置信息，例如前端需要请求另外一个项目，需要知道它的IP、端口、应用名等信息。

常规做法

前端js添加一个“配置文件”：config.js，内容为固定的配置信息，例如 var config = { "other_app_host": "192.168.100.100", "other_app_port": "8080", "other_app_name": "OtherApp", ... } 引入该“配置文件”，即引入config全局变量，js代码中直接使用该变量

这样做有几个问题：

前端需要手动引入“配置文件”修改配置项实际上还是修改代码，需要打包、加密如果后台也需要这些配置信息，就需要前后各配置一份，一不小心就可能配置不同步

改良做法

---

首先，解决前后端统一的问题

目标：前后端使用同一个配置文件。 1. 我们在后台修改config.js文件：

module.exports = { "other_app_host": "192.168.100.100", "other_app_port": "8080", "other_app_name": "OtherApp", ... } 然后我们编写express中间件，来处理前端请求 ... var app = express(); app.get("/config.js", function(req, res){ var config = require("./config.js") res.send("var config = " + JSON.stringify(config)); }); app.listen(3000);

到这里我们解决了前后端统一的问题，统一使用config.json来设置配置信息。 前端使用

然后，解决硬编码的问题

目标：修改配置信息后无需打包、加密 需要做的是把这些配置项改为读取环境变量（或参数），而非固定值。 1. 修改config.js文件：

module.exports = { "other_app_host": process.env.OTHER_APP_HOST || "192.168.100.100", "other_app_port": process.env.OTHER_APP_PORT || "8080", "other_app_name": process.env.OTHER_APP_NAME || "OtherApp", ... } 设置环境变量： $ export OTHER_APP_HOST=... 启动应用 略

process.env.NAME是后台读取环境变量的方式，如果是启动参数，可以用process.argv[1]这种方式来获取。

---

最后，解决前端自动引入的问题

目标：前端页面无需使用

app.get("/*.html", function(req, res){ var html = fs.readFileSync(path.join(__dirname, req.path)); var $ = cheerio.load(html); var script0 = $("script").length > 0 ? $("script").eq(0) : null; if(script0 != null){ $("<script type='text/javascript'>" + "var config = " + JSON.stringify(require('./config')) +";" + </script>\n").insertBefore(script0); } res.send($.html()); })

cheerio 是一个精简版的 jquery 库，需用 require(‘cheerio’) 引入，可用于在后台操作 Dom 。

至此，我们完成了前边三个问题的改进，实现了：

前端无需显示引入配置信息配置信息与代码分离前后台共用一套配置信息

进一步优化

将匿名函数提取为config-parser.js，进行模块化管理config-parser.js添加路径参数，指定需要处理的请求路径config-parser.js添加命令行参数读取（目前为读取环境变量）config-parser.js添加配置文件路径参数，指定配置文件所在路径config-parser.js添加更多类型的配置文件支持（json、properties、txt、xml）config-parser.js添加配置文件读取模式参数，每次都读取、或系统启动时读取一次…

未完待续…