开始之前需要在支付宝注册商户账号以及开发平台,并创建相关的应用,具体操作略过。
点此进入 支付宝开放平台
点此进入 支付宝商家平台
创建应用成功后在应用的开发设置里根据流程创建证书或秘钥,具体操作略过。
申请后的证书如下所示
找到应用ID并记录下来
确保该应用具有支付的权限,如图所示
接着打开项目文件夹,先安装支付宝的SDK相关依赖
请注意,NodeJs版本需要18.20.0或以上
安装依赖
npm install alipay-sdk --save
安装完毕后即可初始化SDK
验证配置
import { AlipaySdk } from 'alipay-sdk';
import * as fs from "fs";
const alipaySdk = new AlipaySdk({
appId: '', //此处填写应用ID
privateKey: fs.readFileSync('./cer/privateKey.pem', 'ascii'),
// 传入支付宝根证书、支付宝公钥证书和应用公钥证书。
alipayRootCertPath: './cer/alipayRootCert.crt',
alipayPublicCertPath: './cer/alipayCertPublicKey_RSA2.crt',
appCertPath: './cer/applicationCertPublicKey.crt',
});
const result = await alipaySdk.curl('POST', '/v3/alipay/user/deloauth/detail/query', {
body: {
date: '20230102',
offset: 20,
limit: 1,
},
});
console.log(result);
如果responseHttpStatus返回200,则代表配置成功
调用支付接口
//具体相关参数可以查看该文档 https://opendocs.alipay.com/open/59da99d0_alipay.trade.page.pay
let aliPayPcPay = await alipaySdk.pageExec("alipay.trade.page.pay", {
bizContent: {
out_trade_no: "123456789",//【必选参数】订单号
subject: "123456789", //【必选参数】订单标题
total_amount: "8.88",//【必选参数】订单总金额,单位为元,精确到小数点后两位
product_code: "FAST_INSTANT_TRADE_PAY",//【必选参数】销售产品码,电脑支付场景的参数为:FAST_INSTANT_TRADE_PAY
qr_pay_mode: "1",//【可选参数】PC扫码支付的方式
qrcode_width: "100",//【可选参数】二维码宽度
integration_type: "PCWEB", //【可选参数】PCWEB:PC端访问 .默认值为PCWEB。
},
});
console.log(aliPayPcPay);
该接口会返回一个form表单的html代码,可以将他注入到前端网页上从而实现自动跳转
例子:
使用express.post请求后端以调用支付接口
import express from 'express' ;
import cors from 'cors';
import bodyParser from 'body-parser';
import { AlipaySdk } from 'alipay-sdk';
import * as fs from "fs";
const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cors());
const alipaySdk = new AlipaySdk({
appId: '', //应用ID
privateKey: fs.readFileSync('./cer/privateKey.pem', 'ascii'),
// 传入支付宝根证书、支付宝公钥证书和应用公钥证书。
alipayRootCertPath: './cer/alipayRootCert.crt',
alipayPublicCertPath: './cer/alipayCertPublicKey_RSA2.crt',
appCertPath: './cer/applicationCertPublicKey.crt',
});
app.post('/api/requestPay',async (req,res)=>{
res.setHeader("Content-type", "application/json");
let operator = req.body.operator;
let scene = req.body.scene;
let payer = req.body.payer;
let payOrderId = req.body.payOrderId;
let payMoney = req.body.payMoney;
switch(scene){
case 'pc' :
let aliPayPcPay = await alipaySdk.pageExec("alipay.trade.page.pay", {
bizContent: {
subject: `订单测试,订单号${payOrderId}`,
product_code: "FAST_INSTANT_TRADE_PAY",
qr_pay_mode: "1",
qrcode_width: "100",
integration_type: "PCWEB",
out_trade_no: payOrderId,
total_amount: payMoney,
},
});
console.log(req.body);
res.end(aliPayPcPay);
break;
case 'mobile':
let aliPayMobilePay = await alipaySdk.pageExec("alipay.trade.wap.pay",{
bizContent:{
subject:`手机订单测试,下单人${payer},订单号${payOrderId}`,
out_trade_no:payOrderId,
total_amount:"0.1",
product_code:"QUICK_WAP_WAY",
}
})
res.end(aliPayMobilePay);
break;
}
})
前端,使用Vue3语法编写。
<button @click="newButton('pc')">点击我测试网页支付</button>
<button @click="newButton('mobile')">点击我测试手机支付</button>
let a = document.getElementById('test');
const newButton = (scene) =>{
let orderNumber = radomOrdernumber(10);
axios.post('//127.0.0.1:4001/api/requestPay',{operator:'alipay',scene:scene,payer:'wepingon',payMoney:'0.1',payOrderId:orderNumber}).then(res=>{
console.log(res);
a.innerHTML = res.data;
document.forms[0].submit();
})
}
//随机生成订单号,可以根据具体情况修改
const radomOrdernumber = (index)=>{
let str = '1234567890';
let length = index;
let nStr = '';
for(let i = 0;i<length;i++){
let a = Math.floor(Math.random() * (10 - 0) - 0);
nStr += a;
}
return nStr;
}
//记得将newButton 和radomOrdernumber return出去哦
使用电脑网页进行支付
使用手机进行支付