npm 包 @keyhub/keyhub-vault-nxt 使用教程

什么是 @keyhub/keyhub-vault-nxt

@keyhub/keyhub-vault-nxt 是 Keyhub 公司开发的一个为 Web 应用提供身份认证和权限管理的 npm 包。它可以实现对应用的安全访问控制,使得用户仅能访问到他有权限的页面或功能,并能够在使用可信的身份信息的情况下,有条件地使用 Keyhub 中的安全服务。

安装

在使用 @keyhub/keyhub-vault-nxt 之前,你需要先通过 npm 安装该包。在终端输入以下命令即可进行安装:

--- ------- ------------------------

使用

安装完成 @keyhub/keyhub-vault-nxt 后,你可以使用它提供的类及方法来实现认证和权限管理。

初始化

首先,你需要实例化 KeyhubVault 对象并调用它的 init 方法。init 方法接受一个对象作为参数,该对象包括以下属性:

  • vaultUrl: 你的 Keyhub Vault 的 API Endpoint
  • appId: 你在 Keyhub 中创建的应用的 ID
  • appSecret: 你在 Keyhub 中创建的应用的 Secret

以下是一个初始化 KeyhubVault 对象并调用 init 方法的示例代码:

------ - ----------- - ---- ---------------------------

----- ----------- - --- --------------
------------------
  --------- -------------------------------
  ------ --------------
  ---------- -----------------
---

登录

接下来,你可以使用 KeyhubVault 对象的 login 方法,来进行身份认证。login 方法接受一个 loginOptions 对象作为参数,该对象包括以下属性:

  • userId: 用户的 ID
  • password: 用户的密码

登录成功后,登录回调函数将会被调用。在登录回调函数中,你可以将用户的身份信息存储到 sessionStorage 或 localStorage 中,以实现用户的持久化登录。

以下是一个登录并将用户信息存储到 sessionStorage 中的示例代码:

----- ------------ - -
  ------- ---------------
  --------- ---------------
--

------------------------------- ----- ----- -- - 
  -- ----- - 
    ---------------------------
  - ---- - 
    ------------------------------ ---------------------- 
  - 
---

权限管理

KeyhubVault 还提供了 checkPermission 方法,用于判断用户是否有权限访问某个页面或功能。该方法接受一个对象作为参数,该对象包括以下属性:

  • userId: 用户的 ID
  • resource: 要访问的资源
  • action: 要执行的操作

以下是一个 checkPermission 的示例代码:

----- ----------------- - - 
  ------- ---------------
  --------- -------------
  ------- -----
-- 

---------------------------------------------- ----- ------- -- - 
  -- ----- - 
    --------------------------- 
  - ---- - 
    -------------------- -- ---- -- ----- 
  - 
---

总结

通过以上示例代码,你可以使用 @keyhub/keyhub-vault-nxt 来实现 Web 应用的身份认证和权限管理。当然,这只是它的一个部分功能,更多功能你可以自行参考官方文档。不过需要注意的是,使用 @keyhub/keyhub-vault-nxt 要求你必须拥有 Keyhub 的账号并在其中提前创建应用,才能开发和调试该包。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/60066b5451ab1864dac669f1


猜你喜欢

  • npm 包 @ambit-ai/ambit-client 使用教程

    介绍 @ambit-ai/ambit-client 是一个用于连接 Ambit AI 平台的 JavaScript 客户端库。它是一个开源项目,托管在 GitHub 上,并且可以通过 npm 下载和使...

    3 年前
  • npm 包 @rgba-image/pixel 使用教程

    前言 在前端开发过程中,图像处理一直是不可避免的一部分。@rgba-image/pixel 是一个轻量级的 npm 包,可以方便地对图片像素进行复杂操作。它提供了灵活的选项,支持多种 RGBA 图像格...

    3 年前
  • npm 包 react-native-plaid 使用教程

    前言 随着移动互联网的普及,金融行业也在不断的转型升级,移动支付、互联网银行等已经成为人们生活中不可或缺的一部分。然而,随着人们对金融产品服务的要求越来越高,安全、便捷、高效成为了人们选择金融产品的重...

    3 年前
  • npm 包 gulp-ifcompile 使用教程

    前言 gulp 是一款流式构建工具,常用于前端项目中对资源进行自动化构建。而 gulp-ifcompile npm 包是在 gulp 中使用条件编译的强大扩展,可以帮助前端工程师更加高效地开发和维护项...

    3 年前
  • npm 包 pifall 使用教程

    在前端开发中,用到的技术和工具越来越多。其中,npm 是一个不可或缺的工具,而 pifall 是 npm 上一款优秀的图片处理包。本文将为大家介绍 pifall 的使用教程,并提供示例代码。

    3 年前
  • npm 包 ngx-activity-log 使用教程

    在现代网站或应用中,记录用户或系统的活动日志变得非常重要。在前端开发中,我们可以使用 ngx-activity-log 这个 npm 包轻松地在 Angular 应用程序中实现此功能。

    3 年前
  • npm 包 ngx-spreadmodal 使用教程

    前言 在前端开发中,常常需要使用弹框来实现各种交互效果。而 ngx-spreadmodal 是一个针对 Angular 开发的弹框组件,可以方便开发者以及用户更好地使用和交互。

    3 年前
  • npm 包 react-id-swiper-support-style 使用教程

    npm 包 react-id-swiper-support-style 使用教程 React-id-swiper-support-style 是一个基于 React 构建,针对 Swiper.js 的...

    3 年前
  • npm 包 @ournet/places-domain 使用教程

    介绍 @ournet/places-domain 是一个 NPM 包,它通过提供一套简单的 API,使得使用地理位置信息变得简单和方便。它可以用于处理各种地理位置数据,包括城市、省份、国家和地区等等。

    3 年前
  • npm 包 evilbrisket 使用教程

    前言 在前端开发中,我们经常会使用到各种各样的第三方库和插件,这些工具可以让我们的开发过程更加高效,同时也能够提升代码质量和可维护性。evilbrisket 就是其中一个非常有用的 npm 包,它可以...

    3 年前
  • npm 包 @tornography/nms-glyphs 使用教程

    前言 在前端页面开发中,常常需要使用图标来丰富页面样式,但是手写 SVG 图标代码繁琐而且容易出错,因此使用图标字体库是一个很好的解决方案。本文将介绍一款优秀的 iconfont 库:@tornogr...

    3 年前
  • npm 包 react-breadcrumbs-bootstrap4 使用教程

    介绍 react-breadcrumbs-bootstrap4 是一个基于 React 的面包屑导航组件,使用 bootstrap4 样式风格。该组件易于集成,拥有灵活的配置选项和可自定义的渲染方式,...

    3 年前
  • npm 包 cordova-plugin-pdascanner 使用教程

    简介 cordova-plugin-pdascanner 是一个可以让 Cordova 应用访问条形码扫描仪的插件。PDA 扫描仪已经成为许多物流公司及仓储公司使用的必备工具。

    3 年前
  • npm 包 @flixpress/ts-foundations 使用教程

    如果你是一位前端开发人员,并且使用 TypeScript 进行开发,那么你一定需要使用一些基础库来帮助你构建应用程序。 @flixpress/ts-foundations 是一个 npm 包,提供了许...

    3 年前
  • npm 包 @mi6gan/redux-coreapi 使用教程

    在前端开发中,Redux 是一个基于 Flux 架构的状态管理库,它通过单一数据源和单向数据流的方式,简化了前端应用的状态管理。而在使用 Redux 时,我们通常会使用一些辅助工具,如 @reduxj...

    3 年前
  • npm 包 apstorymq-client-angular 使用教程

    介绍 apstorymq-client-angular 是一个基于 Angular 框架的 npm 包,可以用于与 apstorymq 消息队列进行交互。它可以轻松地在 Angular 应用程序中引入...

    3 年前
  • npm 包 data-schemas 使用教程

    介绍 data-schemas 是一个用来验证和处理数据的 npm 包,可用于前端和后端的开发。此包通过定义数据的结构和约束来限制和标准化数据输入和输出,从而提高应用程序的健壮性和可维护性。

    3 年前
  • npm 包 mapkit-token 使用教程

    简介 mapkit-token 是一个 npm 包,用于获取 Apple MapKit JS 的密钥 token。MapKit JS 是一个基于 JavaScript 的框架,可用于在 Web 应用程...

    3 年前
  • npm包numbani-react使用教程

    简介 Numbani-React是一个基于React开发的数字输入框组件,可以帮助开发者快速构建数字输入框,支持设置最大值、最小值、步长等属性,同时支持自定义格式化显示。

    3 年前
  • npm 包 react-native-sssa 使用教程

    简介 react-native-sssa 是一款用于实现安全分享秘密的 npm 包。其基于 SSS(Shamir's Secret Sharing)算法,可以将秘密分割成多个部分,分发给不同的人,只有...

    3 年前

相关推荐

    暂无文章