expo-alipay

React Native Alipay support. 支付宝授权登录&支付功能的Expo插件包，封装了最新版本的支付宝原生插件。无需任何原生配置。

安装

npx expo install expo-alikit

为什么是expo-alikit？因为expo-alipay的名字在npm中已经被占用，但后者看起来只是一个demo项目，目前我正在尝试联系作者，看看是否可以让他删掉那个仓库。目前为止，用户可能会在alikit和alipay之间产生歧义，只需要记住，alikit只是npm的包名，其他代码相关的地方保持不变。

配置

支付宝支付和授权登录，由于会涉及到唤起支付宝，跳回你的app，为了让支付宝能识别你的app，你需要配置URL Scheme或者 Universal Link。配置这两项，都需要在app.json中进行：

"ios": {
    "scheme": [
        "你的url scheme，需要与支付宝后台保持一致。"
    ],
    "associatedDomains": [
        "applinks:example.com"
    ]
}

通用连接配置部分可以参考一下苹果官方文档。

使用

注意，不支持在expo go中直接使用，请配合expo-dev-client一起使用。

import ExpoAlipay from "expo-alikit";
import type {
  PayResultEventPayload,
  AuthResultEventPayload,
  LogEventPayload,
} from "expo-alikit";

/// 安卓Only，防黑产操作，推荐在调用支付前调用此方法。
/// https://opendocs.alipay.com/open/00dn75?pathHash=22ed0058#%E5%95%86%E6%88%B7appId%E6%B3%A8%E5%86%8C
await ExpoAlipay.registerApp(appId);

支付

import { usePay } from "expo-alikit";

const { pay, result } = usePay();

// scheme和universalLink需要与app.json中的配置保持一致，仅iOS上需要提供这两个字段。
await pay({
  orderInfo: "orderString",
  scheme: undefined,
  universalLink: undefined,
});

// result 是最新的支付结果事件 payload，会在 onPayResult 事件触发时自动更新
console.log("支付结果:", result);

对于安卓平台，pay 方法会直接返回支付结果，同时也会发布一条 onPayResult 事件。对于iOS平台，pay 方法也会返回支付结果（但仅在 H5 支付场景下），建议统一通过 hook 返回的 result 来获取支付结果。

授权登录

import { useAuth } from "expo-alikit";

const { auth, result } = useAuth();

// scheme和universalLink需要与app.json中的配置保持一致，仅iOS上需要提供这两个字段。
await auth({
  authInfo: "authString",
  scheme: undefined,
  universalLink: undefined,
});

// result 是最新的授权结果事件 payload，会在 onAuthResult 事件触发时自动更新
console.log("授权结果:", result);

对于安卓平台，auth 方法会直接返回授权结果，同时也会发布一条 onAuthResult 事件。对于iOS平台，auth 方法也会返回授权结果（但仅在 H5 授权场景下），建议统一通过 hook 返回的 result 来获取授权结果。

事件监听

usePay 和 useAuth 这两个 hook 内部已经使用 useEvent 监听了对应的结果事件，组件卸载时会自动清理监听。如果你需要直接监听底层事件（如日志），可以使用 useEvent：

import ExpoAlipay from "expo-alikit";
import { useEvent } from "expo";

// 监听支付结果
const onPayResultPayload = useEvent(ExpoAlipay, "onPayResult");

// 监听授权结果
const onAuthResultPayload = useEvent(ExpoAlipay, "onAuthResult");

// 监听支付宝 SDK 日志（iOS Only）
const onLogPayload = useEvent(ExpoAlipay, "onLog");
console.log("Alipay Log:", onLogPayload?.message);

你也可以用 ExpoAlipay.addListener() 语法：

// 监听支付结果
const subscription = ExpoAlipay.addListener("onPayResult", (payload) => {
  console.log("Pay Result:", payload);
});

// 取消监听
subscription.remove();

日志调试（iOS Only）

iOS 平台支持开启支付宝 SDK 日志，用于调试。使用 useDebugLogger hook 即可自动在挂载时开启日志、卸载时停止日志，并将日志打印到控制台：

import { useDebugLogger } from "expo-alikit";

// 调用即开始监听日志，组件卸载时自动停止
useDebugLogger();

日志会通过 onLog 事件发送到 JS 层，包含 message 和 timestamp 字段。

如果需要手动控制，也可以直接调用底层方法：

// 开始监听日志（建议仅在调试时使用）
await ExpoAlipay.startLog();

// 停止监听日志
await ExpoAlipay.stopLog();

API 参考

方法

`getVersion(): Promise<string>`

获取支付宝 SDK 版本号。

支持平台: iOS, Android

返回值: SDK 版本字符串

`registerApp(appId: string): Promise<boolean>`

注册支付宝应用（Android 防黑产场景使用）。

支持平台: Android

参数:

appId: 支付宝开放平台应用 ID

返回值: 是否注册成功

参考: 支付宝官方文档

`setSandboxMode(mode: 'sandbox' | 'online' | 'pre_sandbox'): Promise<void>`

设置沙箱模式（仅 Android）。

支持平台: Android

参数:

mode: 环境模式
- 'sandbox': 沙箱环境
- 'online': 生产环境
- 'pre_sandbox': 预发布环境

`pay(options: PayOptions): Promise<any>`

发起支付宝支付。

支持平台: iOS, Android

参数:

options.orderInfo: 订单信息字符串（由后端生成）
options.scheme: iOS URL Scheme，需与 app.json 配置一致
options.universalLink: iOS Universal Link，需与 app.json 配置一致

返回值:

Android: 直接返回支付结果
iOS: 通过 onPayResult 事件返回结果

注意: iOS 必须通过事件监听获取结果

`auth(options: AuthOptions): Promise<any>`

发起支付宝授权登录。

支持平台: iOS, Android

参数:

options.authInfo: 授权信息字符串（由后端生成）
options.scheme: iOS URL Scheme，需与 app.json 配置一致
options.universalLink: iOS Universal Link，需与 app.json 配置一致

返回值:

Android: 直接返回授权结果
iOS: 通过 onAuthResult 事件返回结果

注意: iOS 必须通过事件监听获取结果

`startLog(): Promise<void>`

开启支付宝 SDK 日志（用于调试）。

支持平台: iOS（Android 为 no-op）

说明: 日志会通过 onLog 事件发送到 JS 层

`stopLog(): Promise<void>`

关闭支付宝 SDK 日志。

支持平台: iOS（Android 为 no-op）

Hooks

Hooks 封装了常用方法与事件监听，组件卸载时会自动清理监听，无需手动调用 addListener / remove。

`usePay(): { pay: (options: PayOptions) => Promise<any>; result: PayResultEventPayload | null }`

支付宝支付 Hook。

支持平台: iOS, Android

行为: 内部使用 useEvent 监听 onPayResult 事件，组件卸载时自动移除监听。

返回值:

pay(options): 发起支付的方法，参数与 ExpoAlipay.pay 一致
result: 最新的支付结果事件 payload（null 表示尚未收到事件）

参数 (PayOptions):

orderInfo: 订单信息字符串（由后端生成）
scheme: iOS URL Scheme，需与 app.json 配置一致
universalLink: iOS Universal Link，需与 app.json 配置一致

`useAuth(): { auth: (options: AuthOptions) => Promise<any>; result: AuthResultEventPayload | null }`

支付宝授权登录 Hook。

支持平台: iOS, Android

行为: 内部使用 useEvent 监听 onAuthResult 事件，组件卸载时自动移除监听。

返回值:

auth(options): 发起授权的方法，参数与 ExpoAlipay.auth 一致
result: 最新的授权结果事件 payload（null 表示尚未收到事件）

参数 (AuthOptions):

authInfo: 授权信息字符串（由后端生成）
scheme: iOS URL Scheme，需与 app.json 配置一致
universalLink: iOS Universal Link，需与 app.json 配置一致

`useDebugLogger(): void`

支付宝 SDK 日志调试 Hook（iOS Only）。

支持平台: iOS（Android 为 no-op）

行为:

挂载时调用 ExpoAlipay.startLog() 开启日志
卸载时调用 ExpoAlipay.stopLog() 停止日志
内部使用 useEvent 监听 onLog 事件，将日志通过 console.log 打印到控制台

返回值: 无

示例:

import { useDebugLogger } from "expo-alikit";

function DebugComponent() {
  // 调用即开始监听日志，组件卸载时自动停止
  useDebugLogger();
  return null;
}

事件

`onPayResult`

支付结果回调。

Payload 类型: PayResultEventPayload

{
  resultStatus?: string;    // 结果状态码 (如 "9000" 表示成功)
  result_status?: string;   // 兼容字段
  result?: string;          // 结果详情（JSON 字符串）
  memo?: string;            // 提示信息
  [key: string]: any;       // 其他可能的字段
}

常见 resultStatus:

9000: 订单支付成功
8000: 正在处理中
4000: 订单支付失败
5000: 重复请求
6001: 用户中途取消
6002: 网络连接出错

`onAuthResult`

授权结果回调。

Payload 类型: AuthResultEventPayload

{
  resultStatus?: string;    // 结果状态码
  result_status?: string;   // 兼容字段
  result?: string;          // 授权结果（包含 auth_code）
  memo?: string;            // 提示信息
  [key: string]: any;       // 其他可能的字段
}

`onLog`

支付宝 SDK 日志（iOS Only）。

Payload 类型: LogEventPayload

{
  message: string; // 日志内容
  timestamp: number; // 时间戳（毫秒）
}

类型导出

import type {
  PayOptions,
  AuthOptions,
  PayResultEventPayload,
  AuthResultEventPayload,
  LogEventPayload,
  ExpoAlipayModuleEvents,
} from "expo-alikit";

Hooks 导出

import { usePay, useAuth, useDebugLogger } from "expo-alikit";

平台差异说明

功能	iOS	Android	Web
支付	✅ 支持	✅ 支持	❌ 不支持
授权	✅ 支持	✅ 支持	❌ 不支持
获取版本	✅ 支持	✅ 支持	❌ 不支持
注册应用	❌ 无需	✅ 支持	❌ 不支持
沙箱模式	❌ 无需	✅ 支持	❌ 不支持
SDK 日志	✅ 支持	⚠️ No-op	❌ 不支持

联系我

QQ 群：682911244，Telegram

Navigation Menu

expo-alipay

安装

配置

使用

支付

授权登录

事件监听

日志调试（iOS Only）

API 参考

方法

`getVersion(): Promise<string>`

`registerApp(appId: string): Promise<boolean>`

`setSandboxMode(mode: 'sandbox' | 'online' | 'pre_sandbox'): Promise<void>`

`pay(options: PayOptions): Promise<any>`

`auth(options: AuthOptions): Promise<any>`

`startLog(): Promise<void>`

`stopLog(): Promise<void>`

Hooks

`usePay(): { pay: (options: PayOptions) => Promise<any>; result: PayResultEventPayload | null }`

`useAuth(): { auth: (options: AuthOptions) => Promise<any>; result: AuthResultEventPayload | null }`

`useDebugLogger(): void`

事件

`onPayResult`

`onAuthResult`

`onLog`

类型导出

Hooks 导出

平台差异说明

相关链接

联系我

FilesExpand file tree

README.md

Latest commit

History

README.md

File metadata and controls

expo-alipay

安装

配置

使用

支付

授权登录

事件监听

日志调试（iOS Only）

API 参考

方法

getVersion(): Promise<string>

registerApp(appId: string): Promise<boolean>

setSandboxMode(mode: 'sandbox' | 'online' | 'pre_sandbox'): Promise<void>

pay(options: PayOptions): Promise<any>

auth(options: AuthOptions): Promise<any>

startLog(): Promise<void>

stopLog(): Promise<void>

Hooks

usePay(): { pay: (options: PayOptions) => Promise<any>; result: PayResultEventPayload | null }

useAuth(): { auth: (options: AuthOptions) => Promise<any>; result: AuthResultEventPayload | null }

useDebugLogger(): void

事件

onPayResult

onAuthResult

onLog

类型导出

Hooks 导出

平台差异说明

相关链接

联系我

`getVersion(): Promise<string>`

`registerApp(appId: string): Promise<boolean>`

`setSandboxMode(mode: 'sandbox' | 'online' | 'pre_sandbox'): Promise<void>`

`pay(options: PayOptions): Promise<any>`

`auth(options: AuthOptions): Promise<any>`

`startLog(): Promise<void>`

`stopLog(): Promise<void>`

`usePay(): { pay: (options: PayOptions) => Promise<any>; result: PayResultEventPayload | null }`

`useAuth(): { auth: (options: AuthOptions) => Promise<any>; result: AuthResultEventPayload | null }`

`useDebugLogger(): void`

`onPayResult`

`onAuthResult`

`onLog`