使用Node实现Vue移动端网页支付宝沙箱模拟支付

在许多项目中都会涉及到支付功能,而一些朋友呢目前并不具备申请商家好上线项目的能力,尤其是一些大学生只是用作练习来开发这样的项目,而支付宝为开发者提供了一个模拟支付宝功能的平台——沙箱环境,使得我们可以用一个虚拟的账号来模拟我们项目中所需要的支付功能。

沙箱配置

要用到支付宝沙箱环境呢首先需要到登录支付宝开发平台,登录之后进入管理中心
在这里插入图片描述
点击管理中心中的研发服务,就能进入到沙箱环境页面
在这里插入图片描述
在沙箱界面进行密钥设置
在这里插入图片描述
选择公钥,点击密钥生成器下载支付宝提供的密钥生成工具
在这里插入图片描述
打开支付宝开发平台开发助手,选择RSA2和PKCS1,点击生成密钥
在这里插入图片描述
将生成的应用公钥粘贴进沙箱的配置中
在这里插入图片描述
将应用私钥和支付宝公钥保存到项目的文件夹中,alipay_public_key.pem支付宝公钥,app_private_key.pem应用私钥,app_public_key.pem应用公钥。
在这里插入图片描述

sdk的使用

1.安装sdk

npm install alipay-sdk -S

支付宝平台给出了TypeScript的sdk使用文档,使用JavaScript类似。

2.引入sdk
由于我们需要从文件夹里读取私钥,除了引入sdk的包之外还需要引入文件操作的包,我们调起支付宝是通过后端返回给前端一个form表单,前端通过这个form表单来实现支付宝的调起,所以还需要引入AlipayFormData。

const AlipaySdk = require('alipay-sdk').default;;
const fs = require("fs");
const AlipayFormData = require("alipay-sdk/lib/form").default;

3.sdk的配置

const alipaySdk = new AlipaySdk({
  appId: '2016********673', // 开放平台上创建应用时生成的 appId
  privateKey: fs.readFileSync('./config/pem/app_private_key.pem', 'ascii'),
  gateway: 'https://openapi.alipaydev.com/gateway.do',// 支付宝网关地址 ,沙箱环境下使用时需要修改
  alipayPublicKey: fs.readFileSync('./config/pem/alipay_public_key.pem', 'ascii'),
  signType: 'RSA2' // 签名算法,默认 RSA2
});

4.sdk的调用

支付宝开发平台有详细的请求参数,可以根据自己的需求进行添加。特别注意的是outTradeNo参数的内容必须是唯一,否则调用会出错,这个地方利用时间戳来设置outTradeNo参数,完整后端代码如下:

async (req, res) => {
  console.log(req.body);
  var no=new Date().getTime();
  var time = encodeURIComponent(req.body.time);
  var money = req.body.money?req.body.money:0;
  const formData = new AlipayFormData();

  formData.addField('returnUrl', 'http://192.168.3.27:8081/home/notify');//支付成功之后跳转的页面
  formData.addField('quitUrl', 'http://192.168.3.27:8081/home/cancel');//退出支付后跳转的页面
  formData.addField('bizContent', {
  outTradeNo: req.body.time+'_'+no+"_"+money,
  productCode: 'FAST_INSTANT_TRADE_PAY',
  totalAmount: req.body.price+'.00',
  subject: req.body.subject,
  passbackParams:time,
  body: '商品详情',
  });

 const result = await alipaySdk.exec(
   'alipay.trade.wap.pay',
   {},
   { formData: formData },
 );

  // result 为 form 表单
  console.log(result);

  // result 为 form 表单
  // console.log(result);
  res.send(result)
},

前端代码

//html
<div v-html="alipayWap" ref="alipayWap"></div>


//js
this.axios.post("/alipay/pay",{
  price:248.00,
  subject:"缴费",
})
.then(res=>{
  console.log(res.data);
  this.alipayWap = res.data;
  this.$nextTick(() => {
    this.$refs.alipayWap.children[0].submit();
  })
})
.catch(err=>{
  console.log(err);
})

调用结果

成功调用后会弹起下面的页面,你可以选择使用网页支付或者app内支付
在这里插入图片描述
如果使用浏览器支付需要使支付宝沙箱中提供的买家账号来进行登录以及支付
在这里插入图片描述

如果使用app支付,需要下载支付宝的沙箱版
在这里插入图片描述
然后就可以成功调起支付宝进行支付了
在这里插入图片描述
关于支付结果的通知,参考支付宝的参考文档

热门文章

暂无图片
编程学习 ·

K8S-05-Jenkins部署springCloud项目-gateway

Jenkins部署springCloud项目-gateway代码结构及文件Jenkins配置 代码结构及文件application.yml文件内容server:port: 9527 spring:application:name: cloud-gatewaycloud:nacos:discovery:server-addr: 192.168.0.31:8848gateway:discovery:locator:enabled: trueroutes:- id:…
暂无图片
编程学习 ·

Office 2016 卡顿问题!如果其他方法都没有用就关掉硬件加速!

题目非常直接哈哈。这次是因为用Word 2016写东西的时候有明显的滞后,甚至打字都是我写一句话都要等1秒以后屏幕后半句才出来。在网上试了很多方法,都没有解决这个问题。知道看到一个评论里提到取消硬件加速……我??文本还要加速??后来去看了设置,发现是给图形的硬件加速…
暂无图片
编程学习 ·

安装Ubuntu系统时遇见的问题:

安装双系统,在已有win10的基础上安装Ubuntu18.04相关设备:1)Rufus 3.112) Ubuntu18.04.4的镜像文件通过使用rufus来制作U盘启动器,因为网上有详细教程就不介绍了。由于之前有多次安装Ubuntu的经历,磁盘分区比较乱,以及因为在之后的选择安装里如果卸载之前安装的Ubuntu就不…
暂无图片
编程学习 ·

LeetCode_Everyday:021 Merge Two Sorted Lists

LeetCode_Everyday:021 Merge Two Sorted Lists题目:示例:代码参考此外 LeetCode Everyday:坚持价值投资,做时间的朋友!!! 题目: 将两个升序链表合并为一个新的升序链表并返回。新链表是通过拼接给定的两个链表的所有节点组成的。 示例:示例 1:输入:1->2->4, 1-…
暂无图片
编程学习 ·

如何快速把图片中的任务删掉?

(1)打开PS编辑软件,Ctrl + O打开新的图片,图片如下(2)Shift + L选择套索工具(3)使用套索工具在任务周边绕一圈(5)鼠标右键,选择填充,100%透明,确定(Enter)(6)Ctrl + D完成如下图 演示到此结束!
暂无图片
编程学习 ·

JVM GC原理

了解JVM GC原理非常重要,对于系统调优非常有用。如果一个系统频繁发生FULL GC,那么会造成系统响应卡顿,更严重的时候会导致系统崩溃。JVM的内存空间 JVM的内存空间,从大的层面上来分析包含:新生代空间(Young)和老年代空间(Old)。新生代空间(Young)又被分为2个部分(Ed…
暂无图片
编程学习 ·

通过过滤器Filter解决post/get请求中文编码问题示例代码

##编码过滤器 功能:将客户端发送过来的数据(尤其是中文)都转换成UTF-8,这样后续的处理就不需要做其他额外的编码转换,做到编码前后统一 实现说明: 对于post请求以及响应可以直接调用setCharacterEncoding方法设置编码格式,而对于get请求,由于get请求参数是通过路径传参,而…
暂无图片
编程学习 ·

Flink原理与实现:Flink中的状态管理,keygroup,namespace

namespace维护每个subtask的状态上面Flink原理与实现的文章中,有引用word count的例子,但是都没有包含状态管理。也就是说,如果一个task在处理过程中挂掉了,那么它在内存中的状态都会丢失,所有的数据都需要重新计算。从容错和消息处理的语义上(at least once, exactly onc…
暂无图片
编程学习 ·

使用mimikatz获取机器的RDP凭据

当我们拿到了机器的管理员权限后,想获取其RDP凭据保存的密码。那么,该如何操作呢?#查看mstsc的连接纪录 cmdkey /list #查找本地的Credentials: dir /a %userprofile%\AppData\Local\Microsoft\Credentials\*上传mimikatz,执行以下命令:
暂无图片
编程学习 ·

HDU 4686 Arc of Dream (矩阵快速幂)

题意:An Arc of Dream is a curve defined by following function:where a 0 = A0 a i = a i-1 * AX+AY b 0 = B0 b i = b i-1 * BX+BY 给出n,A0,AX,AY,B0,BX,BY,What is the value of AoD(N) modulo 1,000,000,007? 题解:矩阵快速幂 数据范围很恶心,先要对原数据取…
暂无图片
编程学习 ·

STM32HAL库的串口通讯流程详解

一 查询模式 待定,日后补充 二 中断模式 1 中断接收 1.1中断接收流程 先在启动文件中找到中断向量表(此处以USART1为例子)然后找到USART1_IRQHandler的函数定义在这里就会发现又跳转到了 HAL_UART_IRQHandler(&huart1);,追进去为下图所示:在图中标记的前三步是读取寄存…
暂无图片
编程学习 ·

extern随笔

extern的用法总结函数声明是可有可无的,因为函数不加修饰符默认是extern的; 全局变量在其他文件中使用时,extern关键词是必须的,如果变量在其他文件中没有extern且没有显示的初始化,则会被当成变量的定义。局部变量是不需要extern关键字描述的,而且局部变量在程序运行时才…
暂无图片
编程学习 ·

斐波那契数列递归算法的优化

public class Fibonacci { //优化使用的数组 static long[] cach = new long[51];public static void main(String[] args) {long a = System.currentTimeMillis();System.out.println( fd( 50 ) );long l = System.currentTimeMillis();System.out.println( l - a );long l1 =…
暂无图片
编程学习 ·

归并排序

给定你一个长度为n的整数数列。 请你使用归并排序对这个数列按照从小到大进行排序。 并将排好序的数列按顺序输出。 输入格式 输入共两行,第一行包含整数 n。 第二行包含 n 个整数(所有整数均在1~109范围内),表示整个数列。 输出格式 输出共一行,包含 n 个整数,表示排好序…
暂无图片
编程学习 ·

手把手撸一个轮播图

轮播图HTML和CSSJS HTML和CSS <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>轮播图</titl…
暂无图片
编程学习 ·

【区间 dp】A023_LC_合并石头的最低成本(穷举分割点)

一、Problem 有 N 堆石头排成一排,第 i 堆中有 stones[i] 块石头。 每次移动(move)需要将连续的 K 堆石头合并为一堆,而这个移动的成本为这 K 堆石头的总数。 找出把所有石头合并成一堆的最低成本。如果不可能,返回 -1 。 Input: stones = [3,2,4,1], K = 2 Output: 20 Ex…
暂无图片
编程学习 ·

【剑指offer】——和为s的序列

文章目录1、和为s的两个数字2、和为s的连续正数序列 1、和为s的两个数字 1、题目要求 输入一个递增排序的数组和一个数字s,在数组中查找两个数,使得它们的和正好是s。如果有多对数字的和等于s,则输出任意一对即可。示例1: 输入:nums = [2,7,11,15], target = 9 输出:[2,7…