stripe 支付
简介
在这篇文档中会用Stripe的测试模式来给出一个在Zion上配置Stripe的示例,建议想自己配置的同学,也首先通过测试模式,把整个支付的流程跑通以后,再换成真实的配置 只读项目示例:https://editor.Zion.app/tool/nwLdKMXyBXG/WEB?code=cLtSsuCGhuPaN
stripe调用示例:https://7p927r3kwo531.cave.Momen.app/
详细步骤
Zion: 创建Stripe的Action Flow
并在Trigger处配置Stripe Callback
Stripe: 配置webhook
可以直接打开https://dashboard.stripe.com/test/webhooks,或者点击Developers->Webhooks,可以看到我们创建的Endpoints
EndPoint URL处填入之前在Zion中创建的Callback URL,Event处填入下面的两个
最终你的页面应该类似下面,然后点击Add Endpoint,Stripe上就会开始监听这个CallBack传来的事件
img | img |
---|---|
Zion: 配置支付设置
Stripe PublicKey & Secret key: 在https://dashboard.stripe.com/test/apikeys(测试模式)中可以找到
CallBack URL就是刚在第一步的时候创建的Callback URL,Endpoint Secret在Webhook页面中可以找到
保存并部署数据库
img | img |
---|---|
Zion: 创建合适的数据模型
一般来说,配置支付都是为了【购买】 某些东西,所以相应的就会存在订单等模型,但是需要注意的是,Stripe的订单是可以支付多次的,所以如果在你的逻辑里,一笔订单只能支付一次,需要在配置上对支付逻辑做某些限制(用户没有权限继续支付已经支付过的订单/一个订单可能有多个交易记录) 以下是一种处理的方式的示例,需要注意的是:不同的处理方式可能会有不同的数据模型
- 添加payment数据模型记录订单ID、stripe支付ID、支付状态(order_id、stripe_payment_id、status、amount、currency、description、payment_method),使用payment的id当作支付行为的订单ID进行操作
- 添加event_log数据模型记录payment支付的不同阶段event记录(content、type、payment_id),比如创建、进行时、失败、成功等
- 当成功时添加event_log记录、修改payment状态为succeeded、stripe_payment_id为返回的支付id、修改原始订单order的支付状态为paid
- 当失败时添加event_log记录、修改payment状态为payment_failed、stripe_payment_id为返回的支付id
- 当返回类型是其他状态时,修改payment中stripe_payment_id为返回的支付id, 添加event_log记录数据模型如下图所示
Zion: 修改Actionflow
其实到目前为止,我们已经可以通过action中的payment调用起stripe的付款界面,但是还需要对付款的结果进行一个解析和调用,这件事情最终会在actionflow中完成。 首先我们需要增加一个custom code的节点
const body = context.getArg('fz_payment_callback_input');
const eventType = body.type;
const stripeObject = body.data.object;
const stripePaymentId = stripeObject.id;
const orderId = context.getOrderIdByStripePaymentId(stripePaymentId);
const paymentStatus = stripeObject.status;
context.setReturn('eventType', eventType);
context.setReturn('orderId', orderId);
context.setReturn('paymentStatus', paymentStatus);
context.setReturn('body', JSON.stringify(body));
代码中的'fz_payment_callback_input'是Zion内部自定义的一个参数,他会获取到Stripe给出的本次付款的结果,然后我们把他分成四个参数通过Zion定义的setReturn函数返回,同时要记得在这一步中把对应的参数作为output出来,这样才可以在后面的步骤中使用这些参数
第二步是为这笔订单创建一个event_log
最后一步是根据返回的status,对相应的payment订单进行修改,我们需要用到Condtion
然后相应的,为不同的结果执行不同的行为
Zion: 在网页中调用Stripe
在网页中调用,需要在某个事件中调用stripe这个行为,一般都是放在一个按钮的点击事件中进行调用 需要注意的是:
- 用户发起支付前必须是已登录状态,所以需要在发起支付前需要配置注册和登录行为
- 配置步骤
- 设置页打开用户名登录并部署数据库
- 分别在不同按钮添加注册和登录行为
img | img | img |
---|---|---|
配置完注册登陆以后,我们就可以正常调用stripe
- 订单ID:长整数,同一笔订单可以支付多次(非唯一),需要用户在逻辑上限制订单唯一,避免重复支付
- 币种:支持的币种👉https://stripe.com/docs/currencies#supported-payment-methods
- 支付的金额:需要换算成最小货币数👉(https://stripe.com/docs/currencies#zero-decimal)
- 支付方式:默认只支持银行卡,无需填写
- 成功时/失败时行为:分别在成功/失败时配置用户支付成功和失败时需要做的操作(如:添加提示)