为什么选择 Buession Shiro

在前后端分离项目中（如：Vue、Angular、React等），前端常常涉及到根据权限显示数据、操作等等重复的实现所困惑。每当开启一个新项目时，我们都得手动重复去编写这些代码，而且还难免代码逻辑不一致，质量参差不齐。

Buession ShiroJs 旨在提供便捷的、统一的、可靠的权限前端权限验证功能。在业务开发中省去的那些“脏活累活”，专注于业务核心的开发。

Buession ShiroJs 的核心思想参考 Apache Shiro 。

安装

您可以通过 NPM、YARN 或者通过 <script> 的方式引入 unpkg.com 上的包。

NPM

npm install @buession/shiro
# or
yarn add @buession/shiro

CDN

对于生产环境，我们推荐链接到一个明确的版本号和构建文件，以避免新版本造成的不可预期的破坏。

最新版：<script src="https://unpkg.com/@buession/shiro/dist/shiro.min.js" type="text/javascript"></script>
具体版本：<script src="https://unpkg.com/@buession/shiro@版本/dist/shiro.min.js" type="text/javascript"></script>

示例

<template>
  <div>
    <div v-if="shiro.hasRole('admin')">Admin</div>
    <div v-if="shiro.hasPermission('user:edit')">Edit</div>
    <div v-if="shiro.hasPermissions(['user:add', 'user:edit'])">Action</div>
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
  setup() {
  }
});
</script>

<script type="text/javascript">
  function Principal(){
    this.id = '1';
  }

  Principal.prototype.getId = function(){
    return this.id;
  }

  Principal.prototype.getRoles = function(){
    return ["admin", "admin1"];
  }

  Principal.prototype.getPermissions = function(){
    return ["user:add", "user:edit"];
  }

  var shiro = new Shiro(new Principal());
  if (shiro.hasRole("admin")) {
    
  }
</script>

License

MIT License © 2020-2023