@fvaa/monitor

通用的路由监听处理架构，它主要分两中模式：

• hashchange 传统hash路由模式
• popstate 基于html5路由模式

它能够快速为你创建路由监听，省去您的工作时间，同时保障质量和效率。

Usage

从npm下载模块：

npm i @fvaa/monitor

在代码中使用

import Monitor, { Request, Response } from '@fvaa/monitor';

// create instance
const createServer = Monitor({
  // prefix: '/api',
  event: 'hashchange'
});

// create server 
// and listen url redirection maps on start time.
createServer(
  async (req: Request, res: Response) => console.log(req, res)
).listen({
  '/': '/abc'
});

Monitor.options

• prefix 指定当前路由前缀
• event 您期望使用的监听事件名 hashchange 或 popstate 默认：hashchange
• error 错误处理函数

错误处理函数可以这样这样写

// ts type: error?(e: Error, req: Request, res: Response): void
Monitor({
  error(err, req, res) {
    console.log(err, req, res);
  }
})

createServer

它用来处理请求变化时候的响应函数。它的参数即回调函数，每个回调函数必须是async函数。我们来看下它的ts定义：

export type AsyncRequestPromiseLike<T> = (req: Request, res: Response) => Promise<T>;
// ...
(...fns: Array<AsyncRequestPromiseLike<void>>) => MonitorContext

所以我们可以这样使用

createServer(
  async (req: Request, res: Response) => console.log(1, req, res),
  async (req: Request, res: Response) => console.log(2, req, res),
  async (req: Request, res: Response) => console.log(3, req, res),
  ...
)

listen

在初始化页面的时候，我们可以通过定义一个redirection map来转接路由地址：

createServer(...).listen({
  '/': '/abc',
  '/test': '/yyyyyy/123'
})

当我们当前的URL在/的时候，自动转换为/abc路由；当我们当前的URL在/test的时候，自动转换为/yyyyyy/123路由。

注意，此功能值在页面初始化时候有效。

Response

我们提供3中交互方法：

• redirect(url:string) 为浏览器历史记录添加一条数据
• replace(url:string) 替换当前浏览器历史记录为新记录
• reload() 重载历史记录。

await res.redirect('/test');
await res.replace('/test');
await res.reload();

License

MIT

Copyright (c) 2018-present, yunjie (Evio) shen