antd权限管理_Antd Pro的权限组件

前端其实是很难有权限验证的，因为从安全的角度来说，前端没有绝对的安全，攻击者总是可以修改前端的代码。对于 API 的权限可以由服务端保证，但是对于页面的权限可能就比较麻烦了。最好的方法当然还是后端控制——也就是 NodeJs 的后端。如果不能达到这个安全级别的话(不过许多应用也没必要)，那么剩下的方法都没有什么太大区别，不过如果需要支持动态配置，就需要服务端路由。

Antd Pro 权限路由

这一块算是 Antd Pro 的模板代码，因为 React Router 和 umi 并没有对于权限流(workflow)的封装(虽然实现起来很简单)。umi 可以在配置中增加Routes字段来进入鉴权组件，Antd Pro 的Routes使用了自己实现的Authorized组件。

Antd Pro 增加了另一个authority字段，用来判断每个路由的权限。Antd Pro 团队应该准备把这里设置的很灵活，因为在checkPermissions里是可以接受 promise 的，但是在src/pages/Authorized里最终看到的getRouteAuthority的 ts 定义只接受string和string[]。这也是有原因的，我猜测是 umi 对配置里的 routeData 做了序列化，导致里面的函数丢失。如果需要写自定义的路由鉴权方式，可能需要从这个地方改起。

Antd Pro 的权限组件在src/components/Authorized模块下。这个模块默认导出一个RenderAuthorize的高阶函数，分别接受Authorized组件和currentAuthority作为参数。这个高阶函数的作用在于根据传入的currentAuthority来解析(parse)当前用户的权限，其内部使用了一个CURRENT变量来缓存解析的结果，并暴露给模块外部使用，这样可以避免