@bigbinary/neeto-access-control-frontend

中文文档
1.6.0发布于 2026/11/03UNLICENSEDTypeScriptESM + CJS近 30 天下载 1.2万

Neeto 访问控制

中文使用文档
文档目录8 节
  1. 发动机
  2. 安装
  3. 前端软件包
  4. 安装
  5. 构成部分
  6. 钩子
  7. 自定义主机应用程序中带有翻译的选项标签
  8. 密码认证在开发期间不工作于嵌入式页面

需要进入控制纳诺

这个 neeto-access-control-nano 管理对neto产品的访问控制. 纳米出口 @bigbinary/neeto-access-control-frontend 国家防范机制一揽子计划 财务报告和审定财务报表 neeto-access-control-engine 铁路发展引擎.

目录

  1. 用主机应用程序开发
  2. 出版指令
  3. 释放β版本

用主机应用程序开发

发动机

该引擎用于管理对neto产品的访问控制.

安装

  1. 添加宝石 Gemfile

      source "NEETO_GEM_SERVER_URL" do
        # ..existing gems
    
        gem "neeto-access-control-engine"
      end
    
  2. 安装宝石

      bundle install
    
  3. 在表格中添加所需的迁移 db/migrate 文件夹。 运行以下 命令复制从引擎到主机应用程序的迁移。 实例: 需要论坛

      bundle exec rails neeto_access_control_engine:install:migrations
      bundle exec rails db:migrate
    
  4. 将此行添加到您的应用程序 config/routes.rb 文件 :

      mount NeetoAccessControlEngine::Engine => "/secure"
    
  5. 添加 has_one 连接到您想要添加访问控制的模式 配置 。 示例 - 组织只需要单次访问 控制系统.

      class Organization < ApplicationRecord
        has_one :access_control_configuration, as: :owner, class_name: "NeetoAccessControlEngine::Configuration", dependent: :destroy
      end
    
  6. 您的控制器必须包含关注和访问 control 配置 方法.

      class PublicController < ApplicationController
        .
        .
        include NeetoAccessControlEngine::Authenticate
        .
        private
    
          def access_control_configuration
            @_access_control_configuration ||= @organization.access_control_configuration
          end
      end
    
  7. 添加以下文件的覆盖 :

  • 7.1. 谷歌 控制器 override.rb

      NeetoAccessControlEngine::GoogleController.class_eval do
        private
    
          def access_control_configuration
            @_access_control_configuration ||= @organization.access_control_configuration
          end
      end
    
  • 7.2. 邀请 控制器 override.rb(可选)

    • 方法
      • access_control_configuration
      • after_invitations_created

        如果主机应用程序没有控制器的覆盖方法,那么 neeto_access_control_configuration_id 参数必须包含在 请求段落.

      NeetoAccessControlEngine::Api::V1::Configurations::InvitationsController.class_eval do
        private
    
          def access_control_configuration
            @_access_control_configuration ||= @organization.access_control_configuration
          end
    
          # after_action callback, called after invitations are created.
          # Use to send invitation emails or perform any post-invitation tasks.
          def after_invitations_created
            # @invited_emails is loaded in engine
            return if @invited_emails.blank?
    
            EmailInvitationsJob.perform_async(@invited_emails, current_user.id)
          end
      end
    
  • 7.3. 嘉宾 会议 控制器 override.rb

      NeetoAccessControlEngine::GuestSessionsController.class_eval do
        private
    
          def access_control_configuration
            @_access_control_configuration ||= @organization.access_control_configuration
          end
      end
    
  • 7.4. 配置 控制器 override.rb

      NeetoAccessControlEngine::Api::V1::ConfigurationsController.class_eval do
    
        private
    
          def owner
            @organization
          end
    
          def update_owner!
            # Optional override to update the owner if required when configuration is updated
          end
      end
    
  1. 添加 Google OAuth 支持
  • 8.1. 创建谷歌OAuth账户 观看演示视频 关于创建谷歌OAuth账户的分步指示。 添加 授权重定向 URI : https://connect.neetokb.net/secure/google_oauth2/callback

  • 8.2. 设置嵌入变量 将以下秘密值添加到 config/secrets.yml。 。 。 .

    google:
      client_id: <%= ENV['GOOGLE_OAUTH_CLIENT_ID'] %>
      client_secret: <%= ENV['GOOGLE_OAUTH_CLIENT_SECRET'] %>
    

前端软件包

安装

  1. 安装最新的 neeto-access-control-frontend 使用下列软件包 命令 :
      yarn add @bigbinary/neeto-access-control-frontend
    

构成部分

1. 联合国. Configuration (单位:千美元)源代码(中文(简体) )

道具

  • ownerId:指定模型实例的标识。 ID是用来 获取和更新访问控制配置 .
  • ownerType:型号类型.
  • onReset: 重设按钮时触发的回调函数 点击.
  • onSuccess: 当配置时触发的召回函数 成功更新 .
  • handleCancel: 当取消按钮时触发的回调函数 点击.
  • invitationsTableExtraColumnsData: 支持添加邀请的列数据 页:1 如果密钥已经存在, 这将覆盖现有的列 . 参考 列数据
  • onConfigurationChangedToInviteOnly: 当 配置改为 invited默认 : noop。 。 。 .
  • headerProps: 传递给 Header 从netoMolecules的组件.
  • hideAddEmailsFromInvitationPane: 支持隐藏来自 请柬窗格。 默认 : false。 。 。 .
  • className: 表格中将增加附加类.
  • onDestroyInvitationsSuccess: 当 成功销毁邀请 .
  • inviteButtonProps: 如果指定, 这将显示在顶部的按钮 皮内. 它可以用来让用户在 请柬Pane.
  • additionalFieldsInitialValues: 支持添加自定义字段到 形式.
  • fieldsWrapper: 将字段包裹在窗体中的组件。 用于 在窗体上添加自定义字段.
  • translationContext: 翻译的上下文,可用于覆盖 字段标签的翻译。 参考: https://www.i18next.com/ translation-函数/context
  • transProps: 推进器 Trans 用于窗体字段标签的组件. 每个字段标签都可以通过在 transProps 映射到认证类型的对象 : no, (中文(简体) ), basic, (中文(简体) ), email, (中文(简体) ), session, (中文(简体) ), invited。 。 。 .
  • enableNavigationBlocking: 如果 true,使 BlockNavigation 组件 在表格中未保存的更改时, 从 netoUI 显示提醒 .

2. 联合国. Invitations 对象

这个 Invitations 对象提供访问邀请相关组件, 钩而并常.

构成部分

InvitationsPane (单位:千美元)源代码(中文(简体) )

道具

检查默认值的源代码

  • onClose: 关闭按钮时触发的回调函数 点击.
  • isOpen: profile for pane,将反映平板状态.
  • extraColumnsData: 支持为邀请表添加列数据。 这个会 如果键已经存在, 则覆盖已存在的列 。 参考 列数据
  • ownerId:指定模型实例的标识。 ID是用来 获取和更新访问控制配置 .
  • ownerType:型号类型.
  • hideAddEmailsForm: 支持从邀请面板上隐藏添加电子邮件表 .
  • configurationId: 主张指定模型实例的ID. 身份证 用于装入访问控制配置. 注:如果该道具不是 通过,确保 invitations_controller_override.rb 添加为 access_control_configuration 在添加覆盖时采用上述方法 节.
  • onDestroyInvitationsSuccess: 当 成功销毁邀请 .
  • inviteButtonProps: 如果指定, 这将显示在顶部的按钮 皮内. 它可以用来让用户在 请柬Pane.

钩子

  • useBulkCreateInvitations 源代码: 散装 创建邀请。 检查 使用量。 。 。 .

常数

  • INVITATIONS_QUERY_KEY: 用于响应邀请的查询缓存

邀请对象使用

/* Required imports */
import { Invitations } from "@bigbinary/neeto-access-control-frontend";

const { InvitationsPane, useBulkCreateInvitations, INVITATIONS_QUERY_KEY } =
  Invitations;

const MyComponent = () => {
  const [showInviationsPane, setShowInviationsPane] = useState(false);
  const [emails, setEmails] = useState("");

  const { mutateAsync: addEmails } = useBulkCreateInvitations({
    configurationId: null,
  });

  const queryClient = useQueryClient();

  const addTestEmails = async () => {
    const payload = { emails: emails.split(",") };
    await addEmails(payload);
    setEmails("");
    queryClient.invalidateQueries({
      queryKey: [INVITATIONS_QUERY_KEY],
    });
  };

  return (
    <div className="space-4 p-5">
      <Input
        label="Email"
        value={emails}
        onChange={e => setEmails(e.target.value)}
      />
      <Button label="Add test email " onClick={addTestEmails} />
      <Button
        label="Open Invitation pane"
        onClick={() => setShowInviationsPane(true)}
      />
      <InvitationsPane
        hideAddEmailsForm
        isOpen={showInviationsPane}
        onClose={() => setShowInviationsPane(false)}
      />
    </div>
  );
};

使用量

这是在 neetoKB 中使用的例子

import React from "react";

import { Configuration } from "@bigbinary/neeto-access-control-frontend";

import { HELP_SECURITY_DOC_URL } from "src/constants/urls";

import { buildDefaultBreadcrumbs } from "./utils";

const AccessControl = () => {
  return (
    <Configuration
      className="mx-auto max-w-3xl md:px-0 lg:px-6"
      handleCancel={() => {}}
      headerProps={{
        title: "Access control",
        description: "Access control description",
        helpLink: HELP_SECURITY_DOC_URL,
        breadcrumbs: buildDefaultBreadcrumbs({
          title: "Access control",
        }),
      }}
    />
  );
};

export default AccessControl;

钩子

1. 联合国. useShowConfiguration

这是用于获取访问控制配置的 React 查询钩 指定所有者.

参数

  • ownerId:指定模型实例的标识。 此ID将被用于 获取访问控制配置 .
  • ownerType:型号类型.

使用量

const {
  data: { configuration },
} = useShowConfiguration({ ownerId, ownerType });

自定义主机应用程序中带有翻译的选项标签

要自定义用于认证的选项标签, 您可以设置从 主机应用程序。 要设定主机应用程序的翻译 :

  • 打开 en.json 文档.
  • 添加该选项下认证选项标签的翻译 neetoAccessControl.auth 名称空间。 示例:
    {
      "neetoAccessControl": {
        "auth": {
          "no": "No auth label",
          "basic": "Basic auth label",
          "email": "Email auth label"
          "session": "Session auth label"
        }
      }
    }
    

解决问题

密码认证在开发期间不工作于嵌入式页面

当密码保护的页面嵌入到iframe中时,认证可能 开发失败 —— 密码页即使在输入后仍然显示 正确的密码。 这是因为Iframe的会话饼干被当成 第三方饼干 浏览器在HTTP上屏蔽第三方饼干.

修补 : 将测试 HTML 文件放入主机应用程序 public/ 目录 ,并在与dev服务器(例如,, http://spinkart.lvh.me:9026/test-embed.html) (中文(简体) ). 这使得Iframe的会话 饼干第一派对,避免第三方饼干限制.

这不是生产问题,因为HTTPS允许 SameSite=None; Secure 饼干在iframes工作.

出版指令

咨询 构建和释放软件包 关于如何出版的详细指南.

释放β版本

  • 将更改推向目标分支以释放β版本.
  • 更新软件包版本至 {latest-version}-beta (如果有的话) 1.2.34 这是 最新版本,将 1.2.34-beta在目标分支中为 β释放.
  • 起草新版本 从与目标分支的回波.
  • 在格式中添加一个新的标签和标题: 前缀的版本 v,例如: v1.2.34-beta。 。 。 .
  • 生成放行笔记.
  • 将发行设定为发行前期,并公布发行.

如果我们要发布一个β版本的产品, 我们必须通知 遵守团队也避免用最新版本覆盖版本 在下一次遵守发布.

版本与发布记录

@bigbinary/neeto-access-control-frontend 共发布 71 个版本,首次发布于 2024/03/21;过去 12 个月发布了 35 个版本。

版本发布日期距今
1.6.0latest2026/11/035 天前
1.6.0-beta1beta2026/11/035 天前
1.5.22026/11/017 天前
1.5.2-beta22026/11/017 天前
1.5.2-beta12026/10/309 天前
1.5.12026/10/309 天前

关于 @bigbinary/neeto-access-control-frontend 的常见问题

@bigbinary/neeto-access-control-frontend 是什么?

Neeto 访问控制

如何安装 @bigbinary/neeto-access-control-frontend?

在项目目录运行 npm install @bigbinary/neeto-access-control-frontend,或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖:qs(6.16.2)、url(0.11.4)、yup(0.32.11)、antd(5.22.1)、util(^0.12.5)、axios(1.20.0)、ramda(0.29.0)、react(18.3.1)、buffer(^6.0.3)、formik(2.4.6)、i18next(22.5.1)、zustand(4.4.2)、dompurify(3.4.17)、js-logger(1.6.1)、react-dom(18.3.1)、classnames(2.5.1)、stream-http(3.2.0)、tailwindcss(^4.1.17)、lucide-react(^1.7.0)、react-helmet(^6.1.0)、os-browserify(0.3.0)、react-i18next(12.3.1)、vm-browserify(1.1.2)、@babel/runtime(7.29.7)、react-toastify(8.0.2)、tty-browserify(0.0.1)、path-browserify(^1.0.1)、https-browserify(1.0.0)、mixpanel-browser(^2.45.0)、react-router-dom(5.3.3)、crypto-browserify(3.12.1)、source-map-loader(4.0.1)、stream-browserify(^3.0.0)、@bigbinary/neetoui(8.8.3)、@honeybadger-io/js(6.10.1)、@bigbinary/neeto-cist(1.0.17)、@honeybadger-io/react(6.1.25)、@tanstack/react-query(5.59.20)、@bigbinary/neeto-atoms(1.1.2)、@bigbinary/neeto-icons(1.20.89)、@bigbinary/neeto-molecules(5.9.15)、@tailwindcss/container-queries(^0.1.1)、@tanstack/react-query-devtools(5.59.20)、@bigbinary/neeto-commons-frontend(4.14.8)、@bigbinary/neeto-filters-frontend(4.7.0)。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖,Yarn 需要手动安装。

@bigbinary/neeto-access-control-frontend 支持 TypeScript 吗?

支持。包内自带 TypeScript 类型声明(package.json 声明了 types 入口),安装后即可获得类型提示,无需再安装 @types 包。

@bigbinary/neeto-access-control-frontend 支持 ESM 还是 CommonJS?

同时提供 ES Module 与 CommonJS 入口,import 和 require() 都可以使用,打包工具会自动选择合适的版本。

@bigbinary/neeto-access-control-frontend 需要什么版本的 Node.js?

package.json 的 engines 字段要求 Node.js >=22.13。版本不符时 npm 默认只给出警告,开启 engine-strict 后会拒绝安装。

@bigbinary/neeto-access-control-frontend 可以商用吗?

@bigbinary/neeto-access-control-frontend 使用 UNLICENSED 许可。作者声明为 UNLICENSED,即不授予公开使用许可(与公共领域的 Unlicense 不同)。使用前需获得作者授权。以上为概括,不构成法律意见,请以许可原文为准。

@bigbinary/neeto-access-control-frontend 的下载量有多少?

根据 npm 官方下载统计,@bigbinary/neeto-access-control-frontend 在 2026/10/08 – 2026/11/06 这 30 天内被下载 11,522 次,日均约 384 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入,适合横向比较热度,不能直接等同于使用人数。

@bigbinary/neeto-access-control-frontend 还在维护吗?

最新版本 1.6.0 发布于 2026/11/03(5 天前);至今共发布 71 个版本,其中过去 12 个月发布了 35 个;首次发布于 2024/03/21。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。