stripe支付demo测试附源码


<!DOCTYPE html>
<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1.0"><title>测试stripe支付demo</title></head><body><div class="form-row"><label for="card-element">Credit or debit card</label><div style="margin-top: 10px;"><input id="cardholder-name" type="text" placeholder="持卡人姓名"></div><div id="card-element"></div><!-- Used to display form errors. --><div id="card-errors" role="alert"></div><button id="card-button" class="btnClass">确认支付</button></div></body><style type="text/css">#card-errors{color: red;}</style><script src="https://js.stripe.com/v3/"></script><script>var stripe = Stripe('pk_test_E5K4sB4KOMNl1WRk4kVtWdGI00tF9nbt75');var elements = stripe.elements();var cardElement = elements.create('card');cardElement.mount('#card-element');var cardholderName = document.getElementById('cardholder-name');var cardButton = document.getElementById('card-button');var clientSecret = 'pi_1FRsD4IOkWpKGmkzELjtmxJx_secret_WBTa9EgTKBFY9hTZ444smnVIF'; //后台传的密钥console.log(clientSecret)cardElement.addEventListener('change', function(event) {var displayError = document.getElementById('card-errors');if (event.error) {displayError.textContent = event.error.message;} else {displayError.textContent = '';}});cardButton.addEventListener('click', function(ev) {stripe.handleCardPayment(clientSecret, cardElement, {payment_method_data: {billing_details: {name: cardholderName.value}, //持卡人姓名// Authorization:'Bearer' +"pi_1FRsD4IOkWpKGmkzELjtmxJx_secret_WBTa9EgTKBFY9hTZ444smnVIF"},}).then(function(result) {console.log(result)if (result.error) {// f付款失败} else {// 付款成功}});});</script><style>#card-element {padding: 30px 0px;}.btnClass {width: 100px;height: 28px;line-height: 28px;background-color: burlywood;border: none;margin-left: 20%;margin-top: 20px;}.StripeElement {box-sizing: border-box;height: 40px;padding: 10px 12px;border: 1px solid transparent;border-radius: 4px;background-color: white;box-shadow: 0 1px 3px 0 #e6ebf1;-webkit-transition: box-shadow 150ms ease;transition: box-shadow 150ms ease;}.StripeElement--focus {box-shadow: 0 1px 3px 0 #cfd7df;}.StripeElement--invalid {border-color: #fa755a;}.StripeElement--webkit-autofill {background-color: #fefde5 !important;}</style>

stripe支付demo测试附源码相关推荐

【网站国际化必备】Asp.Net MVC 集成Paypal（贝宝）快速结账支付接口，附源码demo...
开篇先给大家讲段历史故事,博主是湖北襄阳人.襄阳物华天宝,人杰地灵,曾用名襄樊.在2800多年的历史文化中出现了一代名相诸葛亮(卧龙),三国名士庞统(凤雏),魏晋隐士司马徽(水镜先生),唐代大诗人孟浩 ...
Java-Excel导入导出通用实现Demo（附源码Git地址）
说明:本工具适用大部分导入导出场景,花点时间搞懂怎么用了之后灰常方便,阅读本文前,建议下载源码后参考着阅读.源码地址:https://gitee.com/xwzhang1/excel-util.git ...
ASP.NET页面进行GZIP压缩优化的几款压缩模块的使用简介及应用测试!(附源码)
在介绍之前,先简单说一说ASP.NET服务端GZIP压缩模块的作用及工作原理,很多人编写网页的时候页面因为使用了大量的JS特效又或者放置很多大型动态广告导致了页面或脚本体积庞大,通常都会使用一些压缩工 ...
ESFramework Demo －－ P2P通信Demo（附源码）
现在我们将在ESFramework Demo -- 文件传送Demo 的基础上,使用ESPlus提供的第四个武器,为其增加P2P通信的功能.在阅读本文之前,请务必先掌握ESFramework 开发手册 ...
针对ASP.NET页面实时进行GZIP压缩优化的几款压缩模块的使用简介及应用测试!(附源码)...
在介绍之前,先简单说一说ASP.NET服务端GZIP压缩模块的作用及工作原理,很多人编写网页的时候页面因为使用了大量的JS特效又或者放置很多大型动态广告导致了页面或脚本体积庞大,通常都会使用一些压缩工 ...
VS2019 VC++ MFC CEF(Chrome)开发环境搭建及相关功能demo（附源码）
本文章主要介绍CEF如何作为一个控件,加在MFC的窗体中,并实现一些功能,如:打开指定网址.刷新.后退关闭子窗口或页签.关闭全部页签/子窗口和主窗体.浏览器界面自适应窗口大小等等,也会交代会遇到的一些 ...
Android串口编程--开关灯Demo（附源码）
1.项目简述第二次玩硬件了,第一次是通过局域网控制门的开关,这次是通过ZB(大概就是这么叫,具体名字不清楚)控制灯的开关,感觉控制硬件也就是给硬件发个byte数组而已. 这里有个框架usb-seri ...
校友捐赠程序的开发（含微信支付流程）附源码(未完待续)
大三那会设计的一个程序,大三那一年干了一年勤工俭学,负责学校的学生处官网维护,刚好那时候学校要成立一个种子基金会,所以老师有一个需求,希望我在学生处的微信公众号上再开发一个种子基金会的捐赠功能. 程序 ...
客户端服务器通信demo（续） -- 使用二进制协议（附源码）
转载连接: http://blog.csdn.net/zhuweisky/article/details/11827797 在网络上,交互的双方基于TCP或UDP进行通信,通信协议的格式通常分为两类: ...

stripe支付demo测试附源码

stripe支付demo测试附源码相关推荐

最新文章

热门文章

stripe支付demo测试 附源码

stripe支付demo测试 附源码相关推荐

最新文章

热门文章

stripe支付demo测试附源码

stripe支付demo测试附源码相关推荐