前言
使用angular
开发项目,进行前后端联调时,常见的状态是所有静态文件放于nginx
根目录下,使用nginx
的反向代理功能调用真实API
。因为经验缺乏,之前调试之时,不得不在静态文件目录下直接修改文件,修复成功后再回传代码线的方式,带来诸多不便,也相当不合理,所以周末搞出来自己的处理方案,记录如下。如有其它解决方案,烦请告知。
关于nginx模拟
此处模拟仅包括静态文件,反向代理基础功能的模拟,目的在于保障与真实后台API
联调时,可以直接在代码线下修改,带来版本控制等便利。koa
:https://www.npmjs.com/package/koa
基于koa实现koa-static
:https://www.npmjs.com/package/koa-static
静态文件提供koa-proxy2
:https://www.npmjs.com/package/koa-proxy2
反向代理模拟
完整可用代码如下:
javascript
var path = require('path'); var koa = require('koa'); var serve = require('koa-static'); var koaProxy = require('koa-proxy2'); var app = koa(); app.use(koaProxy({ map: { '~/v1': 'http://127.0.0.1' }, keepQueryString: true })); app.use(serve(path.join(__dirname, 'static'))); app.use(function *() { this.type = 'html'; this.body = fs.readFileSync(path.join(__dirname, 'static/index.html'), {encoding: 'utf-8'}); }); app.listen(1336);
实际使用之时,只需修改proxy map
和静态文件目录位置即可。
后记
koa-proxy2
基本功能已出,由本人所维护,后续会陆续更新,如有问题,请及时告知。