@d-sports/wallet

中文文档

1.1.1发布于 2025/07/22MITTypeScriptESM + CJS近 30 天下载 2088

[进步] 包含有 Rainbow Kit 和 Wagmi 连接器的综合钱包包, 支持 Next.js 和 React Industrial 的社会登录功能

文档目录37 节

* 特性
* 安装
平台特有的依赖
QQ 快速启动
超级快起步(5分钟)
生产设置
下一个.js
原生反应
使用实例
基本钱包连接
自定义社会登录
彩虹套装集成
瓦格米融合组织
API 参考
DSports 钱包
反应钩
QQ 配置
自定义社会登录配置
支助社会提供者
设置 OAuth 应用程序
主题配置
OAuth 回调页面
深链接( 反应原生)
费用比较
发展
设置
构建
测试
开发脚本
QQ 软件包结构
安全特性
捐款
许可证
承认
快速启动生产迁移
发展到生产道路
D- 体育 OAuth 服务

@d-sports/wallet (英语)

请慎用.

一个强大的多平台钱包 SDK 用于 React, Next.js 和 React Indust 应用程序 免费、自定义的社会登录 并且支持"彩虹"和"瓦格米" 100%的D-体育品牌没有供应商依赖.

* 特性

🌐 多平台支持: 与 React 、 Next.js 和 React 本地公司合作
🔐 自定义社会登录:FREE OAuth与Google,Facebook,Twitter,Discord,GitHub和苹果的集成
🏆 D-体育品牌: 完全定制,没有供应商锁定
🌈 彩虹套装兼容: 与 Rainbow Kit 钱包连接 UI 的简单集成
⚡ Wagmi 兼容: 全力支持 Wagmi v1 和 v2
🎨 自定义 UI: 弹性主题和型式选项
🔒 安全存储: 平台专用安全存储解决方案
📱 移动第一: 深度链接和移动优化经验
🔄 自动重联: 会话间持续钱包连接
💰 零成本: 不向每个用户收费或外部依赖性
🎯 类型脚本: 包含全面类型定义的完整类型脚本支持

* 安装

npm install @d-sports/wallet
# or
yarn add @d-sports/wallet
# or
bun add @d-sports/wallet

平台特有的依赖

下个.js/反应:

# No additional dependencies required!

反应原生 :

npm install react-native-keychain react-native-url-polyfill

QQ 快速启动

超级快起步(5分钟)

立即开始 D-体育管理 OAuth 证书 - 不需要OAuth设置!

import { createDSportsWalletQuickStart, mainnet, polygon } from '@d-sports/wallet';

// 🎉 ONE LINE SETUP - No OAuth configuration needed!
const wallet = createDSportsWalletQuickStart({
  projectId: 'your-project-id',
  chains: [mainnet, polygon],
  metadata: {
    name: 'My Awesome App',
    description: 'Built with D-Sports Wallet',
    url: 'https://my-app.com',
    icons: ['https://my-app.com/icon.png']
  }
});

// Connect with social login (Google, Facebook, Twitter, Discord, GitHub ready!)
await wallet.connect({ socialLogin: true });

console.log('🎊 Wallet connected with zero OAuth setup!');

完美为:

🧪 原型制作 概念的证明
👨‍💻 发展测试
🎓 学习和辅导
🏁 开始快点

生产设置

对于生产应用,设置自己的 OAuth 应用程序:

下一个.js

import { createDSportsWallet } from '@d-sports/wallet/nextjs';

// Create wallet instance
const wallet = createDSportsWallet({
  projectId: 'your-project-id',
  chains: [/* your chains */],
  environment: 'production', // Validates production config
  socialLogin: {
    appSecret: 'your-app-secret', // For deterministic key generation
    redirectUri: 'https://your-app.com/auth/callback',
    providers: {
      google: {
        clientId: 'your-google-client-id',
      },
      facebook: {
        clientId: 'your-facebook-app-id',
      },
      twitter: {
        clientId: 'your-twitter-client-id',
      },
      discord: {
        clientId: 'your-discord-client-id',
      },
    },
  },
});

// Connect wallet
await wallet.connect();

原生反应

import { createDSportsWallet, setupURLPolyfill } from '@d-sports/wallet/react-native';

// Setup URL polyfill (required for React Native)
setupURLPolyfill();

// Create wallet instance
const wallet = createDSportsWallet({
  projectId: 'your-project-id',
  chains: [/* your chains */],
  socialLogin: {
    appSecret: 'your-app-secret',
    redirectUri: 'dsports://auth/callback', // Deep link for mobile
    providers: {
      google: {
        clientId: 'your-google-client-id',
      },
      apple: {
        clientId: 'your-apple-client-id',
      },
    },
  },
});

// Connect wallet
await wallet.connect();

使用实例

基本钱包连接

import { createDSportsWallet } from '@d-sports/wallet';

const wallet = createDSportsWallet({
  projectId: 'your-project-id',
  chains: [
    {
      id: 1,
      name: 'Ethereum',
      network: 'homestead',
      nativeCurrency: { name: 'Ether', symbol: 'ETH', decimals: 18 },
      rpcUrls: {
        default: { http: ['https://mainnet.infura.io/v3/your-key'] },
        public: { http: ['https://mainnet.infura.io/v3/your-key'] }
      }
    }
  ]
});

// Connect to wallet
const account = await wallet.connect();
console.log('Connected account:', account);

// Get wallet state
const state = wallet.getState();
console.log('Wallet state:', state);

// Switch chain
await wallet.switchChain(137); // Polygon

// Disconnect
await wallet.disconnect();

import { createDSportsWallet, CustomSocialLoginProvider } from '@d-sports/wallet';

const wallet = createDSportsWallet({
  projectId: 'your-project-id',
  chains: [/* your chains */],
  socialLogin: {
    appSecret: 'your-unique-app-secret', // Used for deterministic key generation
    redirectUri: 'https://your-app.com/auth/callback',
    providers: {
      google: {
        clientId: 'your-google-oauth-client-id',
      },
      facebook: {
        clientId: 'your-facebook-app-id',
      },
      twitter: {
        clientId: 'your-twitter-oauth-client-id',
      },
      discord: {
        clientId: 'your-discord-oauth-client-id',
      },
      github: {
        clientId: 'your-github-oauth-client-id',
      },
    },
  },
});

// Connect with social login
await wallet.connect({ socialLogin: true });

// Get social login provider
const socialProvider = wallet.getConnector('dsports-wallet').customSocialLoginProvider;

// Login with specific provider
const result = await socialProvider.login('google');
console.log('Social login result:', result);

// Get wallet from social login
const ethersWallet = await socialProvider.getWalletFromSocial(result);
console.log('Generated wallet address:', ethersWallet.address);

彩虹套装集成

import { createDSportsRainbowKitConnector } from '@d-sports/wallet';

const connector = createDSportsRainbowKitConnector({
  chains: [/* your chains */],
  projectId: 'your-project-id',
  appName: 'My App',
  socialLogin: {
    appSecret: 'your-app-secret',
    redirectUri: 'https://your-app.com/auth/callback',
    providers: {
      google: {
        clientId: 'your-google-client-id',
      },
      facebook: {
        clientId: 'your-facebook-client-id',
      },
    },
  },
});

// Use with Rainbow Kit
const connectors = [
  connector,
  // ... other connectors
];

瓦格米融合组织

import { dsportsWagmiConnector } from '@d-sports/wallet';

const connector = dsportsWagmiConnector({
  chains: [/* your chains */],
  projectId: 'your-project-id',
  socialLogin: {
    appSecret: 'your-app-secret',
    redirectUri: 'https://your-app.com/auth/callback',
    providers: {
      google: {
        clientId: 'your-google-client-id',
      },
    },
  },
});

// Use with Wagmi
const connectors = [
  connector,
  // ... other connectors
];

API 参考

DSports 钱包

构造选项

interface DSportsWalletOptions {
  projectId: string;
  chains: Chain[];
  socialLogin?: CustomSocialLoginConfig;
  theme?: WalletTheme;
  metadata?: {
    name: string;
    description: string;
    url: string;
    icons: string[];
  };
}

方法

connect(config?: { socialLogin?: boolean }): Promise<WalletAccount>
disconnect(): Promise<void>
switchChain(chainId: number): Promise<void>
getState(): WalletState
isConnected(): boolean
getConnector(id: string): WalletConnector | undefined
addConnector(connector: WalletConnector): void
removeConnector(id: string): void

活动

connect: 钱包连接时发送
disconnect: 钱包断开时发送
accountsChanged: 账户变更时汇出
chainChanged: 当链条改变时发出
error: 发生错误时发出

反应钩

使用 DSports 钱包

const {
  account,
  isConnecting,
  isReconnecting,
  isDisconnected,
  error,
  connect,
  disconnect,
  switchChain,
  isConnected
} = useDSportsWallet(wallet);

使用社会记录

const {
  user,
  isLoading,
  error,
  login,
  logout
} = useSocialLogin(customSocialLoginProvider);

QQ 配置

interface CustomSocialLoginConfig {
  appSecret?: string; // Used for deterministic wallet generation
  redirectUri?: string; // OAuth callback URL
  providers: {
    [key in SocialProvider]?: {
      clientId: string;
      clientSecret?: string; // For backend token exchange
    };
  };
}

谷歌 (单位:千美元)google: OAuth 2.0 (英语)
脸书 (单位:千美元)facebook: Facebook 登录
微博 (单位:千美元)twitter: OAuth 2.0 (英语)
解析器 (单位:千美元)discord: OAuth 2.0 (英语)
GitHub 图像 (单位:千美元)github: OAuth 2.0 (英语)
苹果公司 (单位:千美元)apple: 与苹果公司签约

设置 OAuth 应用程序

谷歌 OAuth 设置

转到谷歌云控台
创建新工程或选择已有项目
启用 Google+ API
创建 OAuth 2. 0 证书
将您的域添加到授权的起源
复制 客户身份

Facebook OAuth 设置

转到 Facebook 开发者
创建新应用程序
设置 Facebook 登录
将您的域添加到有效的 OAuth 重定向 URI
复制 应用标识

Twitter OAuth 设置

转到 Twitter 开发者门户网站
创建新应用程序
设置 OAuth 2. 0
配置回调 URL
复制 客户身份

主题配置

interface WalletTheme {
  colors?: {
    primary?: string;
    secondary?: string;
    background?: string;
    text?: string;
    border?: string;
  };
  borderRadius?: number;
  fontFamily?: string;
}

OAuth 回调页面

在您创建回调页面 redirectUri 处理 OAuth 回复:

<!DOCTYPE html>
<html>
<head>
  <title>D-Sports Authentication</title>
  <style>
    body { font-family: Arial, sans-serif; text-align: center; padding: 50px; }
    .loading { color: #666; }
    .logo { width: 64px; height: 64px; margin: 20px auto; }
  </style>
</head>
<body>
  <div class="logo">🏆</div>
  <h2>D-Sports Authentication</h2>
  <p class="loading">Processing your login...</p>
  <script>
    // Handle OAuth callback
    const urlParams = new URLSearchParams(window.location.search);
    const code = urlParams.get('code');
    const error = urlParams.get('error');
    
    if (error) {
      window.parent.postMessage({
        type: 'OAUTH_ERROR',
        error: error
      }, window.location.origin);
    } else if (code) {
      // Exchange code for user data (implement your backend logic)
      window.parent.postMessage({
        type: 'OAUTH_SUCCESS',
        payload: {
          code,
          user: {
            id: 'user-id-from-your-backend',
            email: '[email protected]',
            name: 'User Name',
            avatar: 'https://example.com/avatar.jpg'
          },
          token: 'access-token-from-your-backend',
          expiresAt: Date.now() + 3600000
        }
      }, window.location.origin);
    }
  </script>
</body>
</html>

深链接( 反应原生)

import { handleDeepLink } from '@d-sports/wallet/react-native';

// Handle deep link
handleDeepLink('dsports://wallet/connect?connector=dsports-wallet', wallet);

费用比较

提供者	费用	锁定	标记
@d-sports/wallet (英语)	自由主义	无	完全D运动
Web3 认证	0.05/MAU美元	对	有限
魔术	0.02/毛利美元	对	有限
枢密院	0.05/MAU美元	对	有限

发展

设置

git clone https://github.com/D-Sports-Ecosystem/wallet.git
cd wallet
bun install

构建

bun run build

测试

bun test

开发脚本

bun run dev: 启动开发模式
bun run build: 构建所有软件包
bun run build:core: 构建核心软件包
bun run build:nextjs: 构建下一个.js 软件包
bun run build:react-native: 构建本地反应软件包
bun run clean: 清洁的建筑文物
bun run lint: 运行 ESLint
bun run test: 运行测试
bun run test:watch: 在监视模式下运行测试

QQ 软件包结构

@d-sports/wallet/
├── core              # Core wallet functionality
├── nextjs            # Next.js specific exports
├── react-native      # React Native specific exports
├── custom-social-login # Custom social login provider
└── types             # TypeScript type definitions

安全特性

决定密钥生成: 钱包是由社会登录数据决定性生成的
安全存储: 平台专用安全存储(localStorage, AsyncStorage, Keychain)
无私钥传输: 密钥是本地生成的, 从未发送到服务器
自定义应用程序机密: 使用你自己的秘密来增加安全性
OAuth 最佳做法: 遵循 OAuth 2.0 安全准则

捐款

叉子存储器
创建您的特性分支( E)git checkout -b feature/amazing-feature(中文(简体) )
提交更改( E)git commit -m 'Add some amazing feature'(中文(简体) )
推向分行(git push origin feature/amazing-feature(中文(简体) )
打开拉请求

许可证

麻省理工学院的执照 - 看自由主义详细文件.

承认

乙醚(js) 用于Ethereum 相互作用
彩虹夹钱包连接 UI
瓦格米语Name 用于 Ethereum 的反应钩
滚动模块捆绑

由D体育队制作 - 一个免费、开源的替代物,取代昂贵的钱包提供者.

快速启动生产迁移

发展到生产道路

从快速启动开始 (5分钟):

const wallet = createDSportsWalletQuickStart({
  projectId: 'your-project-id',
  chains: [mainnet, polygon]
});

创建您的 OAuth 应用程序 (30分钟):

切换到生产配置数字 :

const wallet = createDSportsWallet({
  projectId: 'your-project-id',
  chains: [mainnet, polygon],
  environment: 'production', // Validates config
  socialLogin: {
    appSecret: 'your-production-secret',
    redirectUri: 'https://your-app.com/auth/callback',
    providers: {
      google: { clientId: 'your-google-client-id' },
      facebook: { clientId: 'your-facebook-app-id' },
      // ... other providers
    }
  }
});

D- 体育 OAuth 服务

D-体育 oAuth 证书 用于即时开发:

import { DSportsOAuthService, createQuickStartSocialLogin } from '@d-sports/wallet';

// Get managed credentials
const managed = DSportsOAuthService.getManagedCredentials({ 
  environment: 'development' 
});

// Quick start config (auto-generated)
const quickStartConfig = createQuickStartSocialLogin();

// Validate production config
const productionConfig = validateSocialLoginConfig(myConfig, 'production');

管理的OAuth包括:

✅ 谷歌 - 准备使用
✅ 脸书 - 准备使用
✅ 微博 - 准备使用
✅ 解析器 - 准备使用
✅ GitHub 图像 - 准备使用
⚠️ 苹果公司 - 需要个人设置

福利:

🚀 即时设置 - 没有 OAuth 配置
🛡️ 生产警告 - 自动验证
🔄 易行移徙 - 相同的API,不同的配置
📚 适合演示 - 立即显示特性

版本与发布记录

@d-sports/wallet 共发布 4 个版本，首次发布于 2025/07/04；过去 12 个月发布了 0 个版本。

版本	发布日期	距今
`1.1.1`latest	2025/07/22	1.3 年前
`1.1.0`	2025/07/05	1.4 年前
`1.0.4`	2025/07/05	1.4 年前
`1.0.0`	2025/07/04	1.4 年前

关于 @d-sports/wallet 的常见问题

@d-sports/wallet 是什么？

[进步] 包含有 Rainbow Kit 和 Wagmi 连接器的综合钱包包, 支持 Next.js 和 React Industrial 的社会登录功能

如何安装 @d-sports/wallet？

在项目目录运行 npm install @d-sports/wallet，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（^18.0.0）、react-dom（^18.0.0）、tailwindcss（^3.0.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

@d-sports/wallet 支持 TypeScript 吗？

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

@d-sports/wallet 支持 ESM 还是 CommonJS？

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

@d-sports/wallet 可以商用吗？

@d-sports/wallet 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

@d-sports/wallet 的下载量有多少？

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

@d-sports/wallet 还在维护吗？

最新版本 1.1.1 发布于 2025/07/22（1.3 年前）；至今共发布 4 个版本，其中过去 12 个月发布了 0 个；首次发布于 2025/07/04。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。

npm install @d-sports/wallet

pnpmpnpm add @d-sports/wallet
yarnyarn add @d-sports/wallet
bunbun add @d-sports/wallet

peer 依赖react ^18.0.0react-dom ^18.0.0tailwindcss ^3.0.0react-native ^0.72.0可选react-native-keychain ^8.0.0可选react-native-url-polyfill ^2.0.0可选

npm 7+ 与 pnpm 8+ 会自动安装必需的 peer 依赖，Yarn 需手动安装。

在你的项目目录中运行此命令。

近 30 天下载

2,088

约 2088 次日均 70 次

统计周期 2026/10/11 – 2026/11/09
数据来自 npm 官方下载统计，3 天前更新

最新版本1.1.1发布于 1.3 年前

开源许可MIT宽松许可

包体积6.7 MB396 个文件 · 解压后

运行依赖21 个另有 6 个 peer 依赖

模块格式ESM + CJS

TypeScript自带类型

发布版本4 个近 12 个月 0 个

首次发布2025/07/041.4 年前

元数据更新2026/07/31

每一个软件包背后，
都有分享与创造的人。