Vue node.js实现支付宝支付(沙箱测试)
一、支付宝开放平台创建应用:打开支付宝开放平台首页(注意:正式环境、沙箱环境都需要此步)
1、选择开发者中心 ---> 网页&移动应用 (此时是实现网站支付功能)
2、选择支付接入
3、填入名称(注意名称规范,不能写测试字样,详细参考官网命名规范)、上传图片即可
4、此时,需要网站支付,默认没有,所以点击添加功能,添加即可
5、【重点来了】主要是开发设置的接口加签方式的设置
6、点击设置,会出现以下弹窗,选择的openssl第三方工具(提前在电脑上安装喔,安装就是一路next即可)
7、【本地生成秘钥】官网有提供秘钥生成方式,但是用1024会提示改成2048,所以改一下就好啦
具体命令:
openssl genrsa -out app_private_key.pem 2048 #生成私钥openssl rsa -in app_private_key.pem -pubout -out app_public_key.pem #生成公钥
8、然后将公钥中的字符串复制第6步的图中(即除去‘-----BEGIN PUBLIC KEY-----’和‘-----END PUBLIC KEY-----’的字符串,注意不能有空格),点击保存设置即可
9、此时,若只是网站支付,直接提交审核即可,不用配置应用网关和授权回调地址,提交后,会在一天内得到审核结果,现在做什么呢,等待,无尽的等待哈哈
10、【等到审核通过】会显示已上线,点击查看详情,因为此处是网站支付,选择去签约,然后上传相关证书即可,(注意:如果是沙箱测试,就不需要此步,完成以上步骤即可,由于我是自己测试,所以这一步之后的步骤也没有做,因为没有营业执照哈哈哈o(´^`)o)
【签约】
【上传营业执照】
二、Node.js实现网站支付(以下步骤都是在沙箱环境测试,需要上述步骤中的私钥、公钥)
2.1、首先捏,先准备沙箱环境的秘钥吧 ,点击沙箱应用--> 设置秘钥(因为我设置过了,所以会多一个,查看应用公钥和支付宝公钥),这里设置的秘钥,就是上述步骤中自己生成的公钥(【注意】不是支付宝公钥,一会需要这里的配置信息,即APPID、测试的支付宝网关、支付宝公钥等)
【注意】将生成的支付宝公钥,自定义一个文件,如alipay_public_key.pem,将上述生成的字符串添加到该文件,并且字符串前后加上秘钥所需描述:“-----BEGIN PUBLIC KEY-----”、“-----END PUBLIC KEY-----”
2.2、【中途休息】选择文档中心的统一收单下单并支付页面接口,在线调试的沙箱测试一下(好像并没有什么用,返回的空对象,我记得之前测试响应信息是有数据的哎,就当点一下玩吧,知道这个接口可以用),统一收单线下交易查询(测试玩一玩ヽ(ー_ー)ノ)
【左侧生成订单号,右侧查看返回数据】
【点击在线调试】
【左侧输入订单号,右侧查看返回数据】
2.3、此时查看支付宝提供的开发文档(开发文档看的我差点吐血,因为找不到测试入口,还好想起之前的官网提供的问题搜索),后来找到文档入口、问题搜索入口了,见下图,因为文档中心,具体不知道在哪,所以在技术支持中心,搜索了网站支付,我选的第三个网站如何支付宝支付,然后就点击电脑网站支付
【点击电脑网站支付】
2.4、【重点之一】文档中,快速接入步骤,刚才已经完成,所以现在主要是配置SDK(哼,下面的Demo竟然没有NodeJS,所以点击链接下载和使用教程),然后在本地项目中安装sdk(npm install alipay-sdk),其中有一个示例,不过我本地用的JavaScript,所以点击下面Demo中的SDK配置,看看有没有对应的示例
【点击NPM项目依赖】
【根据步骤进行安装】
【点击SDK配置】
2.5、【查看SDK配置】点击使用文档,里面确实有JS的使用,可是写的不全哎,再看看下面Demo选项呢,yah,找到一个页面类接口调用,这就是我需要的,现在结合使用文档、页面类接口调用、SDK 配置、exec 调用参数等进行实际操作吧(其中开放平台配置,按以上步骤来的话,就是已经配置好的,终于到了重点了,想哭〒▽〒)
2.6、【重点之一】接下来是写支付接口的使用,即返回给前端一个支付宝支付的地址,需要注意的是,需要之前生成的私钥,和准备的支付宝公钥(我是放在同一个文件夹下,文件目录如下,然后我把订单号outTradeNo改成了:“TEST_1569380127321”),其中主要沙箱环境和正式环境的区别:
沙箱的网关地址(gateway:https://openapi.alipaydev.com/gateway.do)
沙箱的appId(用沙箱的appId,而不是之前申请的应用APPID,那是用于正式环境的)
沙箱的应用配置(signType:'RSA',正式环境是'RSA2')
【文件目录如下】
【注意】如果需要支付后跳转到商户界面,可以增加属性"returnUrl"
formData.addField('returnUrl', 'http://xxxxxx'); // 【支付成功后跳转到商户地址】HTTP/HTTPS开头字符串
2.7、【此时,请求该接口】(我使用的chrome的WEB前端助手(FeHelper)插件,里面有简易版Postman,可以请求简单的get、post接口),如图,会返回一个result的地址,即是支付页面,点击跳转就会出现支付页面,可以下载沙箱支付宝app(余额随便充值,感觉钱真的只是数字哈哈),不下载也可以用沙箱的买家账号进行支付
【支付页面,用自己的沙箱账号哈】
【沙箱账号查找处】
【充值,按心情充】
2.8、【重点之一】支付之后,下面写支付查询接口的使用,需要安装request(npm install --save request),参考公共错误码(【注意】,查询接口的方法verifyToken,是自己封装的检查token的函数,此处不是重点,所以删掉即可)
【引入中间件】
【查询订单支付状态】
【函数返回描述信息】
【接口返回数据】
三、具体操作演示
【创建订单】
【支付页面】
【支付成功后跳转到指定页面】
总结:
1、支付宝开放平台,官方文档的教程一般比较详细,就是需要研究一下哈哈,具体问题可以在此处搜索https://opensupport.alipay.com/support/knowCategory
2、网站支付过程中,需要沙箱的配合,并且注意区别正式环境(因为官网的示例都是正式环境的配置)
3、沙箱和正式环境主要区别:APPID、网关地址gateway、应用配置signType
4、其中还涉及在node.js,利用request发送http请求
5、具体代码,已上传github
写给自己的随笔,有问题欢迎指出ᕦ(・ㅂ・)ᕤ
Vue node.js实现支付宝支付(沙箱测试)相关推荐
- 支付宝支付 沙箱测试
支付宝平台文档中心 https://opendocs.alipay.com/open/270/105900 开发者中心 https://developers.alipay.com/platform/d ...
- 支付宝支付—沙箱环境使用
前言 支付宝支付-沙箱环境使用「本文」 支付宝支付-支付宝PC端扫码支付 支付宝支付-手机浏览器H5支付 支付宝提供的沙箱环境,入门门槛非常低,不需要商家认证那一套,这一点对开发者是非常友好的,可以直 ...
- 支付宝支付沙箱 支付存在钓鱼风险解决方法
之前就出现过这个问题,但是稀里糊涂地给解决了.第二次遇到这个问题,想着还是得想办法解决一下,然后终于找到问题的原因,把我整乐了,这么沙雕的问题一定要记下来: 原博客:支付宝支付沙箱 支付存在钓鱼风险! ...
- 我的Android成长之路——支付宝的沙箱测试
第一次写博客,简单写一下支付宝的沙箱测试 下图为支付宝官方demo中的PayDemoActivity,做沙箱调试时,你需要登录你的支付宝,进去开发中心获取支付宝提供给你的沙箱测试专用买家和卖家信息,就 ...
- Mac node js环境的安装与测试
1.mac node.js环境的配置 第一步:打开终端,输入以下命令安装Homebrew /usr/bin/ruby -e "$(curl -fsSL https://raw.githubu ...
- 环境监测系统/智能监测平台---Vue/Node.js
智能环境检测/大数据分析 环境监测系统/智能监测平台-Vue/Node.js 摘要:通过开发板编写相关代码程序驱动各传感器感知采集环境数据,利用Node.js与云平台将采集到的环境数据上传至云平台,并 ...
- 支付宝支付 第一集:没有营业执照,怎样申请一个支付宝的商家号进行开发?使用支付宝支付开发网页移动应用,一分钟申请注册一个支付宝支付沙箱账号,支付宝支付入驻、创建应用、获取AppID
支付宝支付 第一集:没有营业执照,怎样申请一个支付宝的商家号进行开发?使用支付宝支付开发网页&移动应用,一分钟申请注册一个支付宝支付沙箱账号,支付宝支付入驻.创建应用.获取AppID 一.资源 ...
- vue+node.js+mysql项目搭建
前言 用vue搭建前端页面.用node开发后端接口.数据库用mysql 可行性分析 缺点: nodejs单线程,不能做cpu密集型操作,导致时间片不能释放,阻塞后面的任务. nodejs可靠性比较低, ...
- vue+node.js前后端交互中的token令牌验证
这篇文章分享一下本人学习vue+node.js前后端交互中的登录token令牌的心得 最近准备写一个个人博客网站,前端采用的是vue+element,后端用node.js 在做用户登录的时候就想到 如 ...
最新文章
- R语言使用ggplot2包和plotrix包绘制带有错误条(error bars)的可视化结果:使用ggplot2包绘制具有置信区间的可视化图像、使用plotrix包绘制具有置信区间的可视化图像
- hdu 1872(看病要排队)(优先队列)
- 每日一皮:我当程序员的时候也是...
- Navicat 连接 RDS数据库
- 手机单选按钮 html5,@html剃刀单选按钮mvc5(@html razor radio buttons mvc5)
- go 多行字符串_Go语言基本功,了解Go语言基础语法
- CSS3 Version
- android设计风格是什么软件下载,基于MaterialDesign设计风格的妹纸app的简单实现
- pyppeteer-比 selenium 更高效的爬虫利器
- 学生信息管理系统——C语言版
- “知识付费”的分类及传播特征
- 今日份安利:视频变声的软件有哪些?
- 判断和推论_数据科学的假设和推论
- 零信任架构和访问控制模型ABAC
- 装饰者(Decorator)模式
- EI中的知名高校大学学报(共28所高校)
- 过去的2.5年人生,我得思考自己,反省自己......不管怎么样,不忘初心,继续加油......
- Windows搭建NTP服务器——搭建时间同步服务器
- Hatching shader
- chrome浏览器广告屏蔽插件adblock下载地址