diff --git a/docs/user-guide/shop/payments.mdx b/docs/user-guide/shop/payments.mdx index 45165b10..ece455b5 100644 --- a/docs/user-guide/shop/payments.mdx +++ b/docs/user-guide/shop/payments.mdx @@ -10,6 +10,8 @@ import TabItem from '@theme/TabItem'; - 支付宝 - 微信支付 +- 易支付 +- Stripe - 银行转账(手动) - 收款码支付(手动) @@ -20,7 +22,7 @@ import TabItem from '@theme/TabItem'; ![](/img/user-guide/shop/settings-payments.png) - ![](/img/user-guide/shop/settings-payments-create.png) + ![](/img/user-guide/shop/settings-payments-create-2.23.png) @@ -62,7 +64,7 @@ import TabItem from '@theme/TabItem'; 打开新建支付方式的界面,支付提供商选择 **支付宝支付**,并填写以下信息: -- 是否启用:勾选 +- 启用:勾选 - 名称:给用户展示的支付方式名称 - 场景:选择 **PC 网页支付** - 网关地址:`https://openapi.alipay.com` @@ -126,7 +128,7 @@ import TabItem from '@theme/TabItem'; 打开新建支付方式的界面,支付提供商选择 **微信支付**,并填写以下信息: -- 是否启用:勾选 +- 启用:勾选 - 名称:给用户展示的支付方式名称 - 场景:选择 **PC 网页支付** - 应用 ID:上一步获取的微信 AppID @@ -141,13 +143,122 @@ import TabItem from '@theme/TabItem'; ![](/img/user-guide/shop/preview-payments-wechat.png) +## 易支付 + +### 注册易支付 + +访问 [易支付官网](https://z-pay.cn),注册并登录账号。 + +### 开通支付渠道 + +访问 [易支付 -> 我的支付渠道](https://member.z-pay.cn/member/channel.html),新增支付宝或者微信渠道,根据平台的要求填写相关信息。 + +开通成功之后,需要记录 **渠道 ID**,后续在 Halo 中配置时可能需要使用。 + +![](/img/user-guide/shop/settings-payments-zpayz-channels.png) + +### 获取 API 信息 + +访问 [易支付 -> API 安全](https://member.z-pay.cn/member/myapi.html),记录 **网关**、**商户 ID(PID)** 和 **商户密钥(KEY)**,后续在 Halo 中配置时需要使用。 + +![](/img/user-guide/shop/settings-payments-zpayz-api.png) + +### 在 Halo 中配置 + +打开新建支付方式的界面,支付提供商选择 **易支付**,并填写以下信息: + +- 启用:勾选 +- 名称:给用户展示的支付方式名称 +- 场景:选择 **PC 网页支付** +- 自定义图标:由于易支付同时支持微信和支付宝,推荐自定义图标来区分 +- 网关地址:上一步中记录的 **网关** +- 商户号:上一步中记录的 **商户 ID(PID)** +- 商户私钥:上一步中记录的 **商户密钥(KEY)** +- 支付方式:选择 **微信** 或 **支付宝**,需要确保已经在易支付开通对应的渠道 +- 支付渠道 ID:上一步中记录的 **渠道 ID**,支持填写多个,使用英文逗号, 隔开,如果不填则随机调用 + +配置完成之后,还需要在 [销售渠道](./sales-channels.mdx) 中绑定该支付方式。 + +支付预览: + +![](/img/user-guide/shop/preview-payments-zpayz.png) + +## Stripe + +### 登录或者注册 Stripe + +访问 [Stripe 官网](https://stripe.com),登录或者注册账号,并且需要完成必要的信息填写,确保可以正常使用 Stripe 的支付功能。 + +### 获取 API 信息 + +登录到 [Stripe 控制台](https://dashboard.stripe.com),进入设置 -> 开发人员 -> 管理 API 密钥,复制 **密钥** 即可,后续在 Halo 中配置时需要使用。 + +### 创建 WebHook + +1. 打开工作台 + + ![](/img/user-guide/shop/settings-payments-stripe-1.png) + +2. 切换到 WebHook 选项卡,并点击 **添加接收端** + + ![](/img/user-guide/shop/settings-payments-stripe-2.png) + +3. 在事件中选择 `checkout.session.completed` + + ![](/img/user-guide/shop/settings-payments-stripe-3.png) + +4. 接收端类型选择 **Webhook 端点** + + ![](/img/user-guide/shop/settings-payments-stripe-4.png) + +5. 填写端点 URL + + :::note + 端点 URL 的格式为: + + ```bash + https://your-domain.com/apis/api.ecommerce.halo.run/v1alpha1/payment-providers/stripe/callback + ``` + + 其中 `your-domain.com` 需要替换为你的域名,并且需要确保该域名可以访问。 + ::: + + ![](/img/user-guide/shop/settings-payments-stripe-5.png) + + 最后点击 **创建** 按钮即可。 + +6. 获取签名密钥 + + 创建完成之后可以在页面的 **签名密钥** 部分复制 **签名密钥**,后续在 Halo 中配置时需要使用。 + + ![](/img/user-guide/shop/settings-payments-stripe-6.png) + + +### 在 Halo 中配置 + +打开新建支付方式的界面,支付提供商选择 **Stripe**,并填写以下信息: + +- 启用:勾选 +- 名称:给用户展示的支付方式名称 +- 场景:选择 **PC 网页支付** +- API Key:上一步中获取的 **密钥** +- WebHook Secret:上一步中获取的 **签名密钥** + +配置完成之后,还需要在 [销售渠道](./sales-channels.mdx) 中绑定该支付方式。 + +支付预览: + +![](/img/user-guide/shop/preview-payments-stripe.png) + +![](/img/user-guide/shop/preview-payments-stripe-2.png) + ## 银行转账 银行转账支付方式不经过 Halo 的支付系统,仅仅是在支付的时候显示商家的银行收款信息,让买家转账到商家的银行账户,后续再通过人工审核的方式确认订单。 打开新建支付方式的界面,支付提供商选择 **银行转账**,并填写以下信息: -- 是否启用:勾选 +- 启用:勾选 - 名称:给用户展示的支付方式名称 - 场景:选择 **PC 网页支付** - 收款银行:银行名称 @@ -168,7 +279,7 @@ import TabItem from '@theme/TabItem'; 打开新建支付方式的界面,支付提供商选择 **收款码支付**,并填写以下信息: -- 是否启用:勾选 +- 启用:勾选 - 名称:给用户展示的支付方式名称 - 场景:选择 **PC 网页支付** - 收款码二维码图片链接 diff --git a/static/img/user-guide/shop/preview-payments-stripe-2.png b/static/img/user-guide/shop/preview-payments-stripe-2.png new file mode 100644 index 00000000..7fdc8911 Binary files /dev/null and b/static/img/user-guide/shop/preview-payments-stripe-2.png differ diff --git a/static/img/user-guide/shop/preview-payments-stripe.png b/static/img/user-guide/shop/preview-payments-stripe.png new file mode 100644 index 00000000..0e77f0b8 Binary files /dev/null and b/static/img/user-guide/shop/preview-payments-stripe.png differ diff --git a/static/img/user-guide/shop/preview-payments-zpayz.png b/static/img/user-guide/shop/preview-payments-zpayz.png new file mode 100644 index 00000000..e83a56b1 Binary files /dev/null and b/static/img/user-guide/shop/preview-payments-zpayz.png differ diff --git a/static/img/user-guide/shop/settings-payments-create-2.23.png b/static/img/user-guide/shop/settings-payments-create-2.23.png new file mode 100644 index 00000000..c24fc680 Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-create-2.23.png differ diff --git a/static/img/user-guide/shop/settings-payments-stripe-1.png b/static/img/user-guide/shop/settings-payments-stripe-1.png new file mode 100644 index 00000000..379893a1 Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-stripe-1.png differ diff --git a/static/img/user-guide/shop/settings-payments-stripe-2.png b/static/img/user-guide/shop/settings-payments-stripe-2.png new file mode 100644 index 00000000..8cdaf5d0 Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-stripe-2.png differ diff --git a/static/img/user-guide/shop/settings-payments-stripe-3.png b/static/img/user-guide/shop/settings-payments-stripe-3.png new file mode 100644 index 00000000..cc266a96 Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-stripe-3.png differ diff --git a/static/img/user-guide/shop/settings-payments-stripe-4.png b/static/img/user-guide/shop/settings-payments-stripe-4.png new file mode 100644 index 00000000..a6ed7c82 Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-stripe-4.png differ diff --git a/static/img/user-guide/shop/settings-payments-stripe-5.png b/static/img/user-guide/shop/settings-payments-stripe-5.png new file mode 100644 index 00000000..2097e566 Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-stripe-5.png differ diff --git a/static/img/user-guide/shop/settings-payments-stripe-6.png b/static/img/user-guide/shop/settings-payments-stripe-6.png new file mode 100644 index 00000000..6f845ad6 Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-stripe-6.png differ diff --git a/static/img/user-guide/shop/settings-payments-zpayz-api.png b/static/img/user-guide/shop/settings-payments-zpayz-api.png new file mode 100644 index 00000000..61452cba Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-zpayz-api.png differ diff --git a/static/img/user-guide/shop/settings-payments-zpayz-channels.png b/static/img/user-guide/shop/settings-payments-zpayz-channels.png new file mode 100644 index 00000000..2b3cafbf Binary files /dev/null and b/static/img/user-guide/shop/settings-payments-zpayz-channels.png differ