编写插件

ZanProxy插件是是一个npm包，这个npm包需要导出一个类，这个类要实现两个方法：proxy和manage，除此之外没有任何特殊要求。 proxy方法用于请求的处理，manage方法用于插件的配置。

可以参考的例子：点击这里。

注意

写好ZanProxy插件包后需要发包，可以发布到私有仓库，添加时可以指定私有仓库的地址。

proxy方法

proxy方法需要返回一个ZanProxy中间件，该中间件会被加载到代理服务器中。

中间件

ZanProxy中间件是一个处理请求的函数，形如async (ctx, next) => {…}。其中ctx是请求的上下文，默认有两个属性req和res。

req是一个http.IncomingMessage实例，代表着请求。如果req.body被赋值，则请求体的body会被替代。目前req.body只支持字符串类型。

res是一个http.ServerResponse实例，代表着响应。如果res.body被赋值，则响应体的body会被替代，且请求不会被转发。res.body

添加Access-Control-Allow-Origin响应头的中间件的例子

  1.     async (ctx, next) => {
  2.         ctx.res.setHeader('Access-Control-Allow-Origin', '*');
  3.         await next()
  4.     }

manage方法

manage方法需要返回一个Koa的App，该app会被挂载到ZanProxy管理服务器的/plugins/{插件名}路径，用于插件的可视化数据管理。该app可以有自己的http接口和静态资源。

管理Access-Control-Allow-Origin响应头数据的manage例子

  1.     manage() {
  2.         const router = new Router();
  3.         const root = path.join(__dirname, '../ui/site/') // 静态页面的路径
  4.         router.post('/save', async ctx => {
  5.             const cors = ctx.request.body.cors;
  6.             this.cors = cors;
  7.             ctx.body = {
  8.                 status: 200,
  9.                 msg: 'OK'
  10.             }
  11.         })
  12.         router.get('/cors', async ctx => {
  13.             ctx.body = {
  14.                 status: 200,
  15.                 msg: 'OK',
  16.                 data: {
  17.                     cors: this.cors
  18.                 }
  19.             }
  20.         })
  21.         const app = new Koa()
  22.         app
  23.             .use(bodyparser())
  24.             .use(router.routes())
  25.             .use(router.allowedMethods())
  26.             .use(KoaStatic(root))
  27.         return app;
  28.     }

完整的添加Access-Control-Allow-Origin响应头的插件的例子

  1.     const Router = require('koa-router');
  2.     const KoaStatic = require('koa-static');
  3.     const path = require('path');
  4.     const bodyparser = require('koa-bodyparser');
  5.     const Koa = require('koa');
  7.     module.exports = class CorsPlugin {
  8.         constructor() {
  9.             this.cors = '*'
  10.         }
  11.         manage() {
  12.             const router = new Router();
  13.             const root = path.join(__dirname, '../ui/site/') // 静态页面的路径
  14.             router.post('/save', async ctx => {
  15.                 const cors = ctx.request.body.cors;
  16.                 this.cors = cors;
  17.                 ctx.body = {
  18.                     status: 200,
  19.                     msg: 'OK'
  20.                 }
  21.             })
  22.             router.get('/cors', async ctx => {
  23.                 ctx.body = {
  24.                     status: 200,
  25.                     msg: 'OK',
  26.                     data: {
  27.                         cors: this.cors
  28.                     }
  29.                 }
  30.             })
  31.             const app = new Koa()
  32.             app
  33.                 .use(bodyparser())
  34.                 .use(router.routes())
  35.                 .use(router.allowedMethods())
  36.                 .use(KoaStatic(root))
  37.             return app;
  38.         }
  39.         proxy() {
  40.             return async (ctx, next) => {
  41.                 ctx.res.setHeader('Access-Control-Allow-Origin', this.cors || '*');
  42.                 await next()
  43.             }
  44.         }
  45.     }

编写插件 - 图1

原文: https://youzan.github.io/zan-proxy/book/plugin/code.html