@poince /身份验证
为React提供身份验证、嵌入式钱包和支付。
构建模块 身份验证,钱包和支付-从登录到CRM: 身份验证(密码,电子邮件/短信,社交/OAuth, SIWE, MFA),自我管理 嵌入式钱包 EVM和索拉纳 有了资金和支付流,以及 用户属性和事件用于您自己的后端。UI将在7分钟内发布 内置语言环境-英语,中文(简体和繁体),日语, 西班牙语,葡萄牙语和法语-所有这些都完全可以克服。
安装
npm install @poince/auth viem
# or
pnpm add @poince/auth viem
react (^18 || ^19) react-dom 和 viem (^2.38.6)是必需的对等依赖-
viem是对等的,因为SDK的公共API向您提供了viem对象(客户端、链、帐户)
必须来自应用程序自己的视图。NPM 7+和PNPM自动安装对等体;在Yarn v1或with上
auto-install-peers=false,自己安装。Solana软件包会自动安装
(常规的依赖关系)。
Pnpm:允许或跳过本地构建脚本
在 规划10.4 + 安装/构建脚本的一些可传递依赖关系 @reown/appkit,
bufferutil, keccak, utf-8-validate (在Next.js应用中, sharp) -被
默认值:您将看到 Ignored build scripts …等等 规划11 pnpm install (或任何命令)
首先自动安装,例如 pnpm dev)流产 ERR_PNPM_IGNORED_BUILDS. 没有一个
在运行时需要- bufferutil, utf-8-validate 和 keccak 有纯js的回退和
@reown/appkit的postinstall是不必要的-所以清除它一次,然后继续:
# review and approve (or skip) each script interactively — the simplest fix, any pnpm version
pnpm approve-builds
或者将选择声明为 pnpm-workspace.yaml 与 allowBuilds Map (pnpm 11;它被替换了
ignoredBuiltDependencies): false 跳过包的构建脚本(JS回退运行), true
编译本机加速。
# pnpm-workspace.yaml (pnpm 11)
allowBuilds:
'@reown/appkit': false
bufferutil: false
keccak: false
utf-8-validate: false
sharp: false # only if your app pulls sharp (e.g. a Next.js app)
npm和Yarn在没有提示的情况下运行这些脚本,所以这个步骤是pnpm-only。
快速启动
// app/layout.tsx — a Server Component is fine: the SDK's entries are marked "use client".
import { PoinceProvider } from "@poince/auth";
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<body>
<PoinceProvider appId="YOUR_APP_ID_25_CHARS_LONG">{children}</PoinceProvider>
</body>
</html>
);
}
appId 是 要求 -在你的 Poince开发者门户
获取(25个字符的id)。 Solana自动支持负载 在门户中启用时-
连接器由提供程序自动加载,无需额外导入。
从客户端组件触发登录 useLogin; login() 打开Poince登录UI,然后
usePoince() 公开授权状态。门上 ready 所以UI等待提供者初始化:
"use client";
import { useLogin, usePoince } from "@poince/auth";
export function SignIn() {
const { ready, authenticated, user } = usePoince();
const { login } = useLogin();
if (!ready) return <button disabled>Loading…</button>;
return authenticated ? (
<p>Signed in as {user?.id}</p>
) : (
<button onClick={() => login()}>Sign in</button>
);
}
其他挂钩(useLoginWithEmail, useLogout(钱包挂钩)遵循相同的形状。如果 appId
是缺失还是错误, <PoinceProvider> 在树的位置呈现诊断(使用
onProviderError / providerErrorFallback), login() 拒绝而不是吊死。
入口点
| 导入路径 | 它提供了什么 |
|---|---|
@poince/auth | 核心: PoinceProvider,身份挂钩,钱包挂钩,代币,链 |
@poince/auth/solana | 索拉纳签名&钱包挂钩;连接器自动加载——低级连接器导出也在这里(高级) |
@poince/auth/skin-contract | 服务主题作者的主题标记词汇表(仅限数据) |
@poince/auth/internal | ⚠️内部/不稳定-没有永久保证;不打算应用程序使用 |
框架和工具说明
- Next.js应用路由器/ RSC: 已发布的条目被标记
"use client",这样你就可以渲染<PoinceProvider>直接从服务器组件,如app/layout.tsx-不需要包装。 调用Poince钩子的组件是客户端组件,就像任何React钩子一样。一个例外: 从服务器组件传入的props必须是可序列化的,所以如果你使用onProviderError/providerErrorFallback,从一个小的"use client"文件。 - ESM-only: 没有CommonJS构建。通过捆绑器(Next, Vite, Remix,
webpack, Rollup, esbuild)。一个光秃秃的
<script type="module">将不能自己工作- SDK有 绑定器(或导入映射)必须解析的许多裸说明符导入。 - Jest / CommonJS: 因为这个方案是ESM,
require()抛出ERR_REQUIRE_ESM. 在开玩笑, 让它通过你的变换(例如;transformIgnorePatterns)或使用ESM测试设置。 - 打字稿: 使用
moduleResolution"bundler","node16",或者"nodenext". 类型发布为.d.mts背后的exports地图和不会解决下的遗产"node"模式。 - Content-Security-Policy: SDK注入
<style>标记(它的样式表和styled-components)。 在严格的style-src 'nonce-…'策略,通过nonce -<PoinceProvider nonce={nonce}>- - - - - - 或者将其暴露为<meta property="csp-nonce" nonce="…">(轻快地html.cspNonce就像这样) 或者__webpack_nonce__;然后没有'unsafe-inline'需要样式。通过服务器端呈现, 为您自己的样式组件注册表提供相同的nonce。内联style=服务器呈现的属性 加价是新手无法企及的。你还需要connect-src获取Poince API和script-src/frame-src为captcha和WalletConnect提供程序。
配置
appId (和可选的 clientId)标识您的应用程序 config 道具套装
客户端 机制 键-例如,您的UI提供哪些登录方法。Server-authored设置
(主题/外观,可用链,验证码,法律链接,索拉纳RPC)是 server-authoritative
如果通过就会被忽略 config;在开发人员门户中配置它们。
错误与调试
SDK抛出或拒绝的所有东西都是a PoinceError:一个 PoinceApiError 当Poince API
回答错误(status 保存HTTP状态, null 对于网络故障),a
PoinceClientError 当SDK在发送呼叫之前拒绝它时,或者 PoinceConnectorError 当一个
钱包连接失败。分支 error.code ——一个 PoinceErrorCode 值-绝不在消息文本上:
import { isPoinceApiError, isPoinceError, PoinceErrorCode, useLoginWithEmail } from "@poince/auth";
const { sendCode } = useLoginWithEmail();
try {
await sendCode({ email });
} catch (error) {
if (isPoinceApiError(error) && error.code === PoinceErrorCode.TOO_MANY_REQUESTS) {
// back off, then let the user retry
} else if (isPoinceError(error)) {
console.warn(error.code, error.message);
} else {
throw error;
}
}
如果 <PoinceProvider> 在构建其配置时失败,则在适当位置呈现内置诊断
你的树;通过 onProviderError 来记录它 providerErrorFallback 渲染你自己的UI。
无效的道具—例如an appId 这不是确切的25个字符-扔一个 PoinceClientError 在
渲染,您自己的错误边界捕获。包裹运送 没有源映射 -代码被设计混淆-所以
堆栈跟踪指向缩小的块:报告 code, message 和SDK版本,看看
docs.poince.com 每个代码的含义。
更新日志
看到 CHANGELOG.md 对于发行说明-它在这个包中发布。
许可证
商业、专有的。看到 许可证. 使用需要一个有效的point 帐户和协议通过Poince开发人员门户。