反应-链接

嵌入 Bindbee 连接器的回放 SDK 链接流

见详细文件: Bindbee SDK 文档

安装

npm install --save @bindbee/react-link

或者说

yarn add @bindbee/react-link

使用量

import React from "react";
// Run this in your React project:
// npm install --save @bindbee/react-link
import { useBindbeeMagiclink } from "@bindbee/react-link";

const App = () => {
  const handleOnSuccess = (temporary_token) => {
    // Use this token to get the connector_token
    console.log("Temporary Token:", temporary_token);
  };

  const handleOnClose = () => {
    // Optional: Perform any action when the user closes the linking flow
    console.log("Linking flow closed");
  };

  const { open } = useBindbeeMagiclink({
    linkToken: "LINK_TOKEN", // Replace LINK_TOKEN with the token retrieved from previous step,
    serverUrl: "https://api.bindbee.dev", // (OPTIONAL): use 'https://api-eu.bindbee.dev' for EU Region
    onSuccess: handleOnSuccess,
    onClose: handleOnClose,
  });

  return <button onClick={open}>Open Linking Flow</button>;
};

export default App;

自备部署

如果你在自己的基础设施上运行 Bindbee 链接应用程序和 API, 将钩子对准它们 linkUrl 财务报告和审定财务报表 serverUrl数字 :

const { open } = useBindbeeMagiclink({
  linkToken: "LINK_TOKEN",
  linkUrl: "https://link.your-domain.com", // Base URL of your self-hosted link app (defaults to https://link.bindbee.dev)
  serverUrl: "https://api.your-domain.com", // Base URL of your self-hosted API
  onSuccess: handleOnSuccess,
  onClose: handleOnClose,
});

• linkUrl 绝对的 https URL (中文(简体) ). 平面 http 仅为 localhost用于地方发展.
• 链接应用可能生活在子路径下(例如. https://your-domain.com/bindbee-link; 钩子负载 <linkUrl>/embed。 。 。 .
• 源流中的事件只接受来源于 linkUrl。 。 。 .
• 链接应用程序必须被您的应用程序嵌入: 确保不 X-Frame-Options 或者说 Content-Security-Policy: frame-ancestors 前面的页眉(比如在您反向代理)会屏蔽您的应用程序的出处.
• 您的 API 必须允许 CORS 从链接应用程序的来源请求 .