在前端开发任务中,url 重写是非常常见的一个需求。这个需求通常会出现在如下场景:
- 需要校验 url 中的参数并根据校验结果决定是否重定向;
- 根据不同的路由,渲染不同的组件;
- 系统更新后,特定 url 需要重新定向到更新后的页面。
不同的情境需要使用不同的重写方案,但是无论是哪种方案都需要类似的模式。这就是 rewrite-async,一个非常方便实用的 npm 包。
安装
首先,打开终端,输入以下命令进行安装:
npm install rewrite-async --save
这会下载 rewrite-async 并将其添加到 package.json
文件中。
实战
假设我们有这样一个需求:对于来自某些网站的 url,我们需要路由到一个特定的页面。我们需要编写 middleware 函数来完成这个任务。
-- -------------------- ---- ------- --- ----- - ------------- --- ----- - ------------- --- ----- - ------------- --- ------- - ------------------------ --- -------- - --------- ---- ----- -------- ------ - -- --------------------- -- -------------------- -- --------------------- - -------- - ------------------- ----- ------ - ---- - ----- ------ - - -- --- ---- - --------------- -------------------------- ----- ---- - -------------------- ------------- ---- ----- -------- -- - -------------------- ------------------ ---------- --------- -- ---------------
现在,我们启动服务器(例如执行 node server.js
)并访问 http://localhost:3000/contact,我们就会被重定向到 http://localhost:3000/redirect-to-here。
API
rewrite(rules, [opts])
rules
表示规则,可以是函数或对象。函数接受一个参数this
,代表重写上下文,返回一个 Promise;对象包含匹配规则和回调函数。规则支持 express 风格的通配符;opts
可选,是一个对象,它可以包含silent
属性(Boolean)和verbose
属性(Boolean)。silent
表示是否静默失败。默认情况下,rewrite-async
在遇到匹配规则没有处理的 url 时会抛出异常;verbose
表示是否启用详情日志。默认情况下,rewrite-async
不会输出任何日志。
总结
rewrite-async
是一个非常方便实用的 npm 包,它提供了一种处理 url 重写需求的方式。- 它支持 express 风格的通配符,因此可以方便地定义规则。
- 它是异步的,因此可以很好地处理 I/O 密集型任务。
- 它提供了丰富的 API,可以灵活地控制处理细节。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005539681e8991b448d0cba