Stripe支付流程

   近幾天因爲公司的項目中遇到了需要支持給國外本土支付提供支持，經過調研了市面上幾款的產品後選擇了stripe支付

由於資料比較少沒有太多討論，慢慢查看官方文檔以下是我對官方文檔梳理和對接過程中的一些經驗和理解記錄了下來

 

關於Stripe

Stripe是一家提供給個人或公司在網上接受付款服務的科技公司 ，支持可以在無需開設商家賬戶的情況下在網上接受付款。Stripe在付款後兩天內等候期檢查交易所涉及的公司，以防止潛在的詐騙，然後Stripe便會把資金髮送到收款人的戶口 而且Stripe還可以支持使用比特幣付款

 

Stripe的優勢

• Stripe接受135類型的貨幣
• Stripe對所有交易都採用統一費率，這使它透明且易於理解，統一費率是2.9％+ $ 0.30
• api接口便於對接調試，只需要少量代碼就可以完成功能

 

  理解

  Stripe的支付和操作大部分都掌握在我們自己手裏，使用stripe提供的Checkout可以安全的收集和標記卡信息，創建嵌入式支付表單，將表單提交到服務端，然後調用他提供的api就可以完成支付 整個過程非常簡潔方便

  Stipe不像支付寶和微信支付那樣，他不存在訂單的概念，只管支付本筆交易操作

  但他的設計流程都是大同小異大致情況：

• 客戶端通過stripe提供的Checkout插件收集付款所需要的信息
• 將信息傳遞給服務端，服務端收集整理後請求stripe提供的所需api
• 在stripe官方配置頁配置各事件的webhook
• 先驗籤 通過後根據不同事件先回應stripe 然後在處理我們自己的業務操作

 

Stripe集成

1. 在官方https://stripe.com/申請註冊賬戶 按照官方的提示操作成功頁面

 

    2.支付方式採用信用卡支付

          當我們遇到一個新東西的時候，仔細的查看官方文檔往往可以解決我們80%的問題 ，stripe文檔寫的還是很有好的，當你註冊後，查看官方文檔裏面給的案列測試代碼的時候，所有的變量都是關於你自身的真實數據。

 

  信用卡支付方式

第一步直接在頁面裏面添加一個form表單，其中一些屬性是變量值

<form action="serverApi" method="POST">
    <script
            src="https://checkout.stripe.com/checkout.js" class="stripe-button"
            data-key="pk_test_k7wYXLcKJqGM75Ag25Kiwx"
            data-amount="500"
            data-name="UVIC Limited"
            data-description="Example charge"
            data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
            data-locale="auto"
            data-currency="gbp">
    </script>

     成功嵌入後我們點擊提交會看到這個彈框頁面  卡號和信息在官方都有測試信息

 

 

第二步直接請求付款接口  （下面是我寫的node案例的部分代碼）

 async createCharges() {
    const {ctx} = this
    const orderId = ctx.query.order_id
    ctx.tryThrow(!orderId, 'orderId miss')
    const orderResult = await this.service.emall.order.getOrderDetail(orderId)
    ctx.tryThrow(!orderResult, 'order not exist')
    const data = _.pick(ctx.request.body, ['stripeToken', 'stripeEmail'])

    const result = await stripe(this.config.stripe.key).charges.create({
      amount: (orderResult.SKUs[0].price) * 100,
      currency: 'gbp',
      source: data.stripeToken,
      receipt_email: this.config.stripe.receiptEmail,
      metadata: {order_id: orderId}
    })
    ctx.body = result
  }

詳情和返回結果請查看：https://stripe.com/docs/api/charges/create

返回的信息有很多每個字段的描述都有詳細介紹，當然我們對於其中幾個屬性還是要重點提出

 amount代表的金額是以分爲單位

 metadata是可以存儲一些其他對你以後有用的信息（在hook的時候會把數據在返回給你）敏感信息（個人身份信息，卡詳細信  息等不要存儲）

 status表示的狀態

 

 

 第三步在官網設置事件的webhook    https://dashboard.stripe.com/account/webhooks

使用webhooks作用：

• 付款成功後，可以修改業務信息
• 付款失敗時向客戶發送電子郵件或信息告知
• 支付轉賬時記錄會計分錄
• 或者任何修改賬戶的操作都會告知

注意測試的時候點擊View test data查看測試數據不然設置的信息都是正式版

webhook事件有兩種選擇一種是監聽所有事件然後我們自己根據處理一種是可以選擇監聽

 

在上一步中我們調用了stripe.charges.create()函數，我們需要監聽和charges等一些有關事件

不管stripe.charges.create()函數調用的成功與否都會返回給我們事件，當然我們也不能

盲目的接收，首先要先驗證這個請求是不是stripe官方發出還是第三方發出的

驗證方式官方也是提供了兩種一種官方用法一種是自定義 （當然推薦官方的 省時 省力 省心就對了）

下面的代碼片段也是我寫的測試案例的代碼操作  詳細查看官網：https://stripe.com/docs/webhooks/signatures

  return async function (ctx, next) {
    let sig = ctx.request.header['stripe-signature']
    try {
      stripe(ctx.app.config.stripe.key).webhooks.constructEvent(Buffer.from(ctx.request.rawBody), sig, ctx.app.config.stripe.endpointSecret)
      const eventType = ctx.request.body.type
      if (knownEvents[eventType]) {
        return knownEvents[eventType](ctx, next)
      }
      else {
        return next()
      }
    }
    catch (err) {
      ctx.status = 400
      return next()
    }
  }

 

stripe.webhooks.constructEvent(req.body, sig, endpointSecret);

注意點：

•     調用這個函數成功就驗籤通過失敗就不通過不需要返回處理
•     req.body一定要是原始數據請求體

 

當我們驗證成功之後會收到charge.succeeded事件進行下一步處理，

stripe會調用我們預留的url把信息傳遞回來 我們來大致看一下body返回的東西

還有一些頭或者其他信息可以自己測試的時候打印看下：

我們要先仔細觀察下他事件返回的數據結構 其中metadata裏面就是我們調用的時候添加的附加信息

在這裏會返回很重要的一個屬性是type事件類型，我們可以根據這個值做相應處理處理我們自己的業務

 

其實整個流程還是蠻簡單的當然他還包含很多其他功能和對接其他平臺 有興趣的可以瞭解下

案例代碼我正在整理過幾天會發布到github上大家相互學習