Stripe简单集成

简单集成Stripe总结

1.Maven依赖添加

<dependency>
 	<groupId>com.stripe</groupId>
 	<artifactId>stripe-java</artifactId>
  	<version>20.58.0</version>
</dependency>

2.Checkout托管

checkout托管相对来说简单一点，它的支付页是托管在Stripe的服务器上的，不需要额外的编写支付页。
关键代码段（HTML）：

<body>
	<button id="checkout-button">支付</button>
	<script src="https://js.stripe/v3/"></script>
	<script type="text/javascript">
      var stripe = Stripe(striep.apiKey);
      var checkoutButton = document.getElementById('checkout-button');
      checkoutButton.addEventListener('click', function() {
        var data = ${order}
        fetch('/create', {
          method: 'POST',
          body: JSON.stringify(data)
        })
        .then(function(response) {
          return response.json();
        })
        .then(function(session) {
          return stripe.redirectToCheckout({ sessionId: session.id });
        })
        .then(function(result) {
          if (result.error) {
            alert(result.error.message);
          }
        }).catch(function(error) {
          console.error('Error:', error);
        });
      });
    </script>
</body>

java服务端：

	@RequestMapping(value = "/create", produces = "application/json")
	@ResponseBody
	// 单次支付
	public String paySingle(HttpServletRequest request, HttpServletResponse response)throws StripeException {
	
		Stripe.apiKey = StripeAPIKey;//查阅账号私密密匙

		SessionCreateParams params = SessionCreateParams.builder()
		.addPaymentMethodType(SessionCreateParams.PaymentMethodType.CARD)
		.setMode(SessionCreateParams.Mode.PAYMENT)
		.setSuccessUrl("successUrl") //支付成功返回页面
		.setCancelUrl("CancelUrl")//支付取消返回页面
		.addLineItem(SessionCreateParams.LineItem.builder().setQuantity(1L)
		.setPriceData(SessionCreateParams.LineItem.PriceData.builder()
		.setCurrency("usd")//货币类型
		.setUnitAmount(199L)
		.setProductData(SessionCreateParams.LineItem.PriceData.ProductData
		.builder().setName(name).build())
		.build())
		.build())
		.build();

		Session session = Session.create(params);
		Map<String, String> responseData = new HashMap<String, String>();
		responseData.put("id", session.getId());

		return gson.toJson(responseData);
	}

效果图：

3.自定义支付

关键代码段（HTML）：

<body>
<div class="login layui-anim layui-anim-up">
	<div class="message">支付详情</div>
	<div id="darkbannerwrap"></div>
	<form class="layui-form">
		<input name="name"   type="text" class="layui-input" value="商品名称:${order.name}"disabled>
		<hr class="hr15">
		<input name="mo" type="text" class="layui-input" value="金额:${order.amount}${order.type}" disabled>
		<hr class="hr15">
	</form>
	<hr class="hr15">
	
	<form id="payment-form">
	  <div id="card-element" >
	  </div>
	  <button id="submit" class="mbutton">支付</button>
	</form>
</div>
	
	<script type="text/javascript">
		var stripe = Stripe('${pk}');//账号公开密匙
		var elements = stripe.elements();
	
		var style = {
			base: {
		        color: "#32325D",
		        fontWeight: 500,
		        fontFamily: "Inter, Open Sans, Segoe UI, sans-serif",
		        fontSize: "16px",
		        fontSmoothing: "antialiased",
		        "::placeholder": {
		          color: "#CFD7DF"
		        }
		      },
		      invalid: {
		        color: "#E25950"
		      }
		};
		var card = elements.create("card",{ style: style }); //创建卡元素
		card.mount("#card-element");  
		
		//实时验证卡完整性
		card.on('change', function(event) {
		 var displayError = document.getElementById('card-errors');
		  if (event.error) {
		  } else {
		  }
		});
		
		//提交检测
		var form = document.getElementById('payment-form');
		var clientSecret = "${csecret}"; //客户端密匙由后端生成,提交支付验证
		form.addEventListener('submit', function(ev) {
		  ev.preventDefault();
		  stripe.confirmCardPayment(clientSecret, {
		    payment_method: {
		      card: card,
		      billing_details: {
		        name: 'Jenny Rosen'
		      }
		    }
		  }).then(function(result) {
		    if (result.error) {
		      alert(result.error.message);
		    } else {
		      if (result.paymentIntent.status === 'succeeded') {
		        alert("成功！");
		      }
		    }
		  });
		});
    </script>
</body>

java服务端：

	@RequestMapping(value = "/card")
	public String cardH(HttpServletRequest request, HttpServletResponse response) throws StripeException {

		Stripe.apiKey = StripeAPIKey;//查阅账户私密密匙
		OrderE orderE = (OrderE) JSONObject.toBean(JSONObject.fromObject(request.getAttribute("order")), OrderE.class);
		String type = orderE.getType();
		Long amount = MoneyConvert.convert(orderE.getAmount(), type);
		String order_id = orderE.getOrderNumber();

		PaymentIntentCreateParams params = PaymentIntentCreateParams.builder().setCurrency(type)
		.addPaymentMethodType("card").setAmount(amount)
		.setSetupFutureUsage(PaymentIntentCreateParams.SetupFutureUsage.OFF_SESSION)
		.putMetadata("order_id", order_id).build();

		PaymentIntent intent = PaymentIntent.create(params);

		// Map<String, String> responseData = new HashMap<String, String>();

		String csecret = intent.getClientSecret();

		System.out.println("sc:" + csecret);

		request.setAttribute("csecret", csecret); //返回给前端的客户端密匙
		request.setAttribute("order", orderE);
		request.setAttribute("pk", StripeAPIKey);
		return "/createCard"; 
	}