写在前面：

如果你的网站在线业务面向海外的话避免不了用户支付的问题，条纹目前应该是做的比较好的一家支付平台了，除了信用卡外还支持国内的微信支付宝，但是手续费有点高。

回归正题，说说种类的开发文档，乍一看种类官方文档可能会一头雾水，没关系，本文以视频教程为例实现了支付和订单更新的实现，简单易懂，实际根据逻辑自行修改整合到自己的项目中即可。

在进入正文前需要注意准备的事项：

1.先到种类官网后台获取到apikey，这里不做过多阐述。

2.下载好官方的stripe-php核心库，你可以使用设计者或者需要一次(_ a)都可以。

地址：https://github。com/stripe/stripe-PHP

进入主题

项目涉及的文件

/

config.php

dbConnect.php

index.php

payment.php

条纹-php/

css/style.css

用于测试支付的一些卡号：

4242424242424242424242签证

400005665566556签证（借方)

55555555555555444万事达卡

5200828282828210万事达卡（借记卡)

378282246310005美国运通

60111111111111111117发现

1.准备数据表

创建表格"订单"

` id` int(11)非空自动增量，

` name ` varchar(50)COLLATE utf8 _ unicode _ ci NOT NULL，

` email ` varchar(50)COLLATE utf8 _ unicode _ ci NOT NULL，

` item _ name ` varchar(255)COLLATE utf8 _ unicode _ ci NOT NULL，

` item _ number ` varchar(50)COLLATE utf8 _ unicode _ ci NOT NULL，

`项目_价格`浮动(10,2)不为空，

` item _ price _ currency ` varchar(10)COLLATE utf8 _ unicode _ ci NOT NULL，

` payed _ amount ` varchar(10)COLLATE utf8 _ unicode _ ci NOT NULL，

` payed _ amount _ currency ` varchar(10)COLLATE utf8 _ unicode _ ci NOT NULL，

` txn _ id ` varchar(50)COLLATE utf8 _ unicode _ ci NOT NULL，

` payment _ status ` varchar(25)COLLATE utf8 _ unicode _ ci NOT NULL，

"已创建"日期时间不为空，

"已修改"日期时间不为空，

主键(` id `)

)ENGINE=Innodb DEFAULT CHARSET=ut F8 COLLATE=ut F8 _ unicode _ ci；

2.配置文件config.php

？服务器端编程语言(专业超文本预处理器的缩写)

//产品详情

//更低金额为0.50美元

$itemName='演示产品；

$ itemNumber=' PN12345

$ itemPrice=25

$ currency='美元

//条带应用程序接口配置

定义(' STRIPE_API_KEY '，' Your _ API _ Secret _ KEY ')；

定义(' STRIPE _ PUBLISHABLE _ KEY '，' Your _ API _ PUBLISABLE _ KEY ')；

//数据库配置

定义(' DB_HOST '，' MySQL _ DatabaSe _ HOST ')；

定义('数据库_用户名，' MySQL _数据库_用户名');

定义(' DB_PASSWORD '，' MySQL _ Database _ PASSWORD ')；

定义(' DB_NAME '，' MySQL _ Database _ NAME ')；

3.数据库连接dbConnect.php

？服务器端编程语言(专业超文本预处理器的缩写)

//连接数据库

$ DB=新MySQL(DB _ HOST，DB_USERNAME，DB_PASSWORD，DB _ NAME)；

//如果连接失败，显示错误

if ($db-connect_errno) {

printf('Connect failed: %s\n '，$ db-Connect _ error)；

exit()；

}

4.结算表单页index.php

？服务器端编程语言(专业超文本预处理器的缩写)

//包含配置文件

需要一次‘config.php’

？

！声明文档类型

超文本标记语言

头

标题签出/标题

！-样式表文件-

链接rel='样式表href=' https://堆栈路径。bootstrapcdn。com/bootstrap/4。5 .0/CSS/bootstrap。量滴' CSS '

链接rel='样式表href='css/style.css '

！-条带射流研究…库-

脚本src=' https://js。条纹。com/v3/'/脚本

/head

身体

div class='panel '

div class='panel-heading '

h3 class='panel-title '收费？服务器端编程语言（Professional Hypertext Preprocessor的缩写）回显"$"。$ itemPrice？带条纹/h3

！-产品信息-

pbItem Name:/b？php echo $ itemName？/p

pbPrice:/b？服务器端编程语言（Professional Hypertext Preprocessor的缩写）回显"$"。$itemPrice .' '.$币？/p

/div

div class='panel-body '

！-显示createToken返回的错误-

div id='paymentResponse'/div

！-付款表格-

表单操作='payment.php '方法='POST' id='paymentFrm '

div class='form-group '

标签名称/标签

输入类型=' text ' name=' name ' id=' name ' class=' field '占位符='输入名称'必填自动对焦=' '

/div

div class='form-group '

标签邮件/标签

输入类型='电子邮件'名称='电子邮件id='电子邮件'类别='字段'占位符='输入电子邮件'必填=' '

/div

div class='form-group '

标签卡片编号/标签

div id=' card _ number ' class=' field '/div

/div

div class='row '

div class='left '

div class='form-group '

标签日期/标签

div id=' card _ expire ' class=' field '/div

/div

/div

div class='right '

div class='form-group '

labelCVC代码/标签

div id=' card _ CVC ' class=' field '/div

/div

/div

/div

按钮类型='提交class=' BTN BTN-成功' id=' payBtn '提交付款/按钮

/form

/div

/div

脚本

//创建条带对象的实例

//设置可发布的应用编程接口密钥

var stripe=Stripe('？' php echo STRIPE _ PUBLISHABLE _ KEY ');

//创建元素的实例

var elements=stripe。elements()；

var style={

base: {

fontWeight: 400，

fontFamily: 'Roboto，Open Sans，Segoe UI，sans-serif '，

fontSize: '16px '，

线高： '1.4 ',

颜色： '#555 ',

backgroundColor: '#fff '，

:占位符' : {

color: '#888 '，

},

},

无效： {

color: '#eb1c26 '，

}

};

var card元素=元素。创建('卡号'，{

style:样式

});

卡片元素。mount(' # card _ number ')；

var exp=元素。创建(' cardExpiry '，{

样式' :样式

});

exp。mount(' # card _ expire ')；

var CVC=元素。创建(' Cardcvc '，{

样式' :样式

});

CVC。挂载(' # card _ CVC ')；

//验证卡元素的输入

var结果容器=文档。getelementbyid(' paymentResponse ')；

cardeElement。addevent listener(' change '，function(event) {

if (event.error) {

结果容器。InnerHTML=' p '事件。错误。消息'/p '；

} else {

resultContainer.innerHTML=

}

});

//获取付款表单元素

var form=document。getelementbyid(' PaymentFrm ')；

//提交表单时创建令牌。

form.addEventListener('submit '，function(e) {

e .PreventDefault()；

create token()；

});

//创建一次性令牌向用户收费

函数createToken() {

stripe.createToken(cardElement).然后（函数（结果){

if (result.error) {

//如果有错误，通知用户

结果容器。InnerHTML=' p '结果。错误。消息'/p '；

} else {

//将令牌发送到服务器

stripeTokenHandler(结果。token)；

}

});

}

//回调处理来自条带的响应

函数stripeTokenHandler(标记){

//将令牌标识插入表单，以便提交给服务器

var hiddenInput=document。createElement(' input ')；

hiddenInput.setAttribute('type '，' hidden ')；

hiddenInput.setAttribute('name '，' stripe token ')；

hiddeninput。SetAttribute(' value '，标记。id)；

表格。appendchild(hiddenInput)；

//提交表单

表格。submit()；

}

/script

/body

/html

5.服务端付款处理payment.php

？服务器端编程语言(专业超文本预处理器的缩写)

//包含配置文件

需要一次‘config.php’

$ payment _ id=$ statusMsg=

$ordStatus='错误；

//检查条带标记是否不为空

if(！空($ _ POST['条带令牌']){

//从提交的表单数据中检索条带令牌、卡和用户信息

$ token=$ _ POST[' stripe token ']；

$ name=$ _ POST[' name ']；

$ email=$ _ POST[' email ']；

//包含条带服务器端编程语言（Professional Hypertext Preprocessor的缩写）库

require _ once ' stripe-PHP/init。PHP '；

//设置应用程序接口键

\ Stripe \ Stripe :3360 setapekey(Stripe _ API _ KEY)；

//将客户添加到条带

尝试{

$ customer=\ Stripe \ customer : create(阵列（

email'=$email，

source'=$token

));

}捕获（异常$e) {

$ API _ error=$ e-GetMessage()；

}

if(空($api_error) $customer){

//将价格转换为美分

$ ItemPriceName=($ ItemPrice * 100)；

//向信用卡或借记卡收费

尝试{

$ charge=\ Stripe \ charge : create(数组（

客户=$customer-id，

金额=$ itemPriceCents，

' currency'=$currency，

描述=$itemName

));

}捕获（异常$e) {

$ API _ error=$ e-GetMessage()；

}

if(空($api_error) $charge){

//检索费用详细信息

$ chargeJson=$ charge-jsonSerialize()；

//检查收费是否成功

if($ chargeJson[' amount _ returned ']==0 empty($ chargeJson[' failure _ code '])$ chargeJson[' payed ']==1 $ chargeJson[' captured ']==1){

//交易明细

$ TransActionID=$ chargej son[' balance _ transaction ']；

$ paidAmount=$ chargeJson[' amount ']；

$ paidAmount=($ paidAmount/100)；

$ payed currency=$ charge j son[' currency ']；

$ payment _ status=$ chargeJson[' status ']；

//包含数据库连接文件

包含一次dbConnect.php

//将事务数据插入数据库

$sql='INSERT INTO orders(name，email，item_name，item_number，item_price，item_price_currency，payed _ amount，paid _ amount _ currency，txn_id，payment_status，created，modified) VALUES ' .$name .',''.$email。''.$itemName .',''.$itemNumber .''.$itemPrice .',''.$currency。''.$paidAmount，''，' '。$paidCurrency ' '，' '。$transactionID .',''.$付款_状态.NOW()，NOW())’；

$ insert=$ db-query($ SQL)；

$ payment _ id=$ db-insert _ id；

//如果订单成功

if($ payment _ status==' succed '){

$ ordStatus='成功

$statusMsg='您的付款已成功!'；

}else{

$statusMsg='您的付款失败!'；

}

}else{

$statusMsg="事务已失败!"；

}

}else{

$statusMsg='费用创建失败！$ API _ error '；

}

}else{

$statusMsg='无效的卡详细信息！$ API _ error '；

}

}else{

$statusMsg='表单提交错误；

}

？

！声明文档类型

超文本标记语言

头

标题测试/标题

！-样式表文件-

链接rel='样式表href=' https://堆栈路径。bootstrapcdn。com/bootstrap/4。5 .0/CSS/bootstrap。量滴' CSS '

链接rel='样式表href='css/style.css '

/head

身体

div class='container '

div class='status '

？php if(！空($payment_id)){？

h1 class='？php echo $ ordStatus？php echo $ statusMsg？/h1

h4支付信息/h4

b参考编号：/b？php echo $ payment _ id？/p

pbTransaction ID:/b？php echo $ transactionID？/p

pbpayed金额：/b？php echo $paidAmount .' '.$ paidCurrency？/p

pbPayment status 3360/b？php echo $ payment _ status？/p

h4产品信息/h4

pbName:/b？php echo $ itemName？/p

pbPrice:/b？php echo $itemPrice .' '.$币？/p

？php }else{？

h1类='错误'您的付款失败/h1

？php }？

/div

a href='索引。BTN链接返回付款页面/a

/div

/body

/html

6.样式文件css/style.css

注意文件位置在钢性铸铁文件夹下面

/*.容器{

padding: 20px

}

h1{

color: # 7a7a7a

font-size : 28px

text-transform:大写；

文本-对齐：中心；

}*/

#付款Frm .row {

右边距： 0；

边距-左： 0；

}。面板{

宽度： 350px

margin: 0自动

背景-color : # fff；

border: 1px固体透明；

border-radius : 4px

-web kit-box-shadow : 0 1px 1px rgba(0，0，0。05);

box-shadow: 0 2px 5px 0 rgba(0，0，0，0.16)，0 2px 10px 0 rgba(0，0，0，0.12)；

边框颜色： # DDD；

}。面板标题{

padding: 10px 15px

border-bottom: 1px固体透明；

边框-左上角-半径： 3px

边框-右上角-半径： 3px

}。面板。面板标题{

颜色： # 333

背景-color : # F5 F5；

边框颜色： # DDD；

}。面板-标题{

页边距-顶部： 0；

页边距-底部： 10px

font-size : 20px

颜色： # 333

font-weight : 600；

}。面板-车身{

padding: 15px

}。表单组{

边距-底部： 15px

}

标签{

显示器：内联块；

边距-底部： 5px

font-weight : bold；

}。字段{

显示器：块；

宽度： ;

高度： 35px

padding: 6px 12px

font-size : 15px

线高： 1.2;

颜色： # 555

背景-color : # fff；

背景-image : none；

border: 1px固体# ccc

border-radius : 4px

-web kit-box-shadow : inset 0 1px 1px rgba(0，0，0。075);

箱形阴影：插图0 1px 1px rgba(0，0，0。075);

-web kit-transit : border-color易于使用。15s，盒影-易进易出。15s

transition:边框-颜色淡入淡出。15s，框影淡入淡出。15s

}

div.field{

填充-底部： 0；

}

field:focus {

边框颜色： # 66 AFE 9；

outline : 0；

-web kit-box-shadow : inset 0 1px 1px rgba(0，0，0，075)，0 0 8px rgba(102，175，233，6);

箱形阴影：插图0 1px 1px rgba(0，0，0，075)，0 0 8px rgba(102，175，233，6);

}。划船。左{

宽度： 45%;

向左浮动：

}。划船。右{

宽度： 35%;

向右浮动：

}。没错。字段{

宽度： 75%;

}。form-group iframe{

高度： 30px！重要；

}。btn {

宽度： ;

padding: 10px 16px

font-size : 18px

线高： 1.33;

border-radius : 6px

border:无

cursor:指针；

}。BTN-成功{

color: # fff

背景色： # 5cb 85 c。

边框颜色： # 4 ca e4c

}。btn-success:hover .btn-success:focus .BTN-success :激活.btn-success.active {

color: # fff

背景-color : # 47a 447；

边框颜色： # 398439;

}

#付款回应p{

font-size : 17px

border: 1px虚线；

padding: 10px

颜色： # EA4335

页边距-顶部： 0；

页边距-底部： 10px

}。状态{

padding: 15px

颜色： # 000

背景色： # f1 f1 f1

box-shadow: 0 2px 5px 0 rgba(0，0，0，0.16)，0 2px 10px 0 rgba(0，0，0，0.12)；

边距-底部：20px；

}。状态h1{

font-size : 1.8 em

}。状态h4{

font-size : 1.3 em

边距-底部：0；

}。状态p{

font-size : 1em

边距-底部：0；

margin-top : 8px；

}。BTN-链接{

显示器：内联块；

font-weight : 400；

文本-对齐：中心；

空白： nowrap

垂直对齐： 中间；

-web kit-用户-选择： none

-moz-user-select : none；

-ms-user-select : none；

用户选择：无；

border: 1px固体透明；

划水：375雷姆。75雷姆；

font-size : 1 rem

线高： 1.5;

边界半径：25雷姆；

transit :颜色。15s易入易出，底色。15s易入易出，边框颜色。15s易入易出，暗箱操作。15s易入易出；

text-decoration : none

}。BTN-链接{

color: # 007bff

背景色：透明；

边框-颜色： #007bff

}。btn-link:hover .BTN-链接：激活btn-link:focus {

color: # fff

背景色： # 007 BFF

边框-颜色： #007bff

text-decoration : none

}。成功{

颜色： # 34A853

}。错误{

颜色： # EA4335

}