支付宝支付沙箱实验【入门保姆级教程,附有图文+示例代码】

支付沙箱实验

一.入门

1.1 准备工作

登录官方网址,进入控制台

https://open.alipay.com/

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

1.2 密钥准备

在这里插入图片描述

点击上图中的【设置并查看】,会出来下图

在这里插入图片描述

此时需要下载 密钥工具,下载网址:https://opendocs.alipay.com/common/02kipk?pathHash=0d20b438

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

将密钥工具的生成的【应用公钥】填写到沙箱环境中,自动生成支付宝公钥

在这里插入图片描述

1.3 设置内网穿透

https://natapp.cn/

进入网址,完成注册、登录、实名认证

购买一个隧道(有免费的就有免费的)

在这里插入图片描述

在这里插入图片描述

进入刚才购买的隧道,进行配置

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

下载好客户端后,不要双击启动,用cmd命令行的方式打开

在这里插入图片描述

打开命令行窗口后,输入

natapp.exe -authtoken=your_authtoken

在这里插入图片描述

启动成功

在这里插入图片描述

1.4 SpringBoot集成

目录结构

在这里插入图片描述

【引入依赖】

<!--支付宝相关-->
<dependency>
    <groupId>com.alipay.sdk</groupId>
    <artifactId>alipay-sdk-java</artifactId>
    <version>4.9.28.ALL</version>
</dependency>
<!--支付宝依赖沙箱支付-->
<dependency>
    <groupId>com.alipay.sdk</groupId>
    <artifactId>alipay-easysdk</artifactId>
    <version>2.2.0</version>
</dependency>

如果报错控制台,导入以下依赖

 <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>
               spring-boot-configuration-processor
            </artifactId>
            <optional>true</optional>
        </dependency>

        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>
              mybatis-plus-boot-starter</artifactId>
            <version>3.5.1</version>
        </dependency>

        <dependency>
            <groupId>com.mysql</groupId>
            <artifactId>mysql-connector-j</artifactId>
            <scope>runtime</scope>
        </dependency>

【yml配置文件】

server:
  port: 80

alipay:
# 支付宝应用ID
 appId: 支付宝应用ID
# 商户私钥
 merchantPrivateKey: 应用私钥
# 支付宝公钥
 alipayPublicKey:  支付宝公钥
# 支付完成后的异步通知地址,用于接收支付结果通知
 notifyUrl: http://127.0.0.1:80/api/alipay/notify
# 支付成功后返回的页面地址(同步回调)
 returnUrl: http://127.0.0.1:80/index.html
# 签名方式
 signType: RSA2
 charset: utf-8
# 支付宝网关地址
 gatewayUrl: https://openapi-sandbox.dl.alipaydev.com/gateway.do

spring:
  datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/hz_security?useUnicode=true&characterEncoding=utf-8&zeroDateTimeBehavior=convertToNull
    username: xxxx
    password: xxxxx
  redis:
    password: xxxxx

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

【配置类】

package com.hz.config;

import com.alipay.api.AlipayApiException;
import com.alipay.api.AlipayClient;
import com.alipay.api.DefaultAlipayClient;
import com.alipay.api.request.AlipayTradePagePayRequest;
import com.hz.pojo.Order;
import lombok.Data;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.boot.context.properties.ConfigurationProperties;
import org.springframework.stereotype.Component;


@ConfigurationProperties(prefix = "alipay")
@Component
@Data
public class AlipayTemplate {
    // 应用ID,您的APPID,收款账号既是您的APPID对应支付宝账号
    @Value("{alipay.appId}")
    public String appId;
    // 应用私钥,就是工具生成的应用私钥
    @Value("{alipay.merchantPrivateKey}")
    public String merchantPrivateKey;
    // 支付宝公钥,对应APPID下的支付宝公钥。
    @Value("{alipay.alipayPublicKey}")
    public String alipayPublicKey;
    // 支付宝会悄悄的给我们发送一个请求,告诉我们支付成功的信息
    @Value("{alipay.notifyUrl}")
    public String notifyUrl;
    // 同步通知,支付成功,一般跳转到成功页
    @Value("{alipay.returnUrl}")
    public String returnUrl;
    // 签名方式
    @Value("{alipay.signType}")
    private String signType;
    // 字符编码格式
    @Value("{alipay.charset}")
    private String charset;
    // 订单超时时间
    private String timeout = "1m";
    // 支付宝网关;https://openapi-sandbox.dl.alipaydev.com/gateway.do
    @Value("{alipay.gatewayUrl}")
    public String gatewayUrl;

    public String pay(Order order) throws AlipayApiException {
// 1、根据支付宝的配置生成一个支付客户端
        AlipayClient alipayClient = new
                DefaultAlipayClient(gatewayUrl, appId, merchantPrivateKey,
                "json", charset, alipayPublicKey, signType);
// 2、创建一个支付请求,并设置请求参数
        AlipayTradePagePayRequest alipayRequest = new
                AlipayTradePagePayRequest();
        alipayRequest.setReturnUrl(returnUrl);
        alipayRequest.setNotifyUrl(notifyUrl);
        Long id = order.getId();
        Long interfaceInfoId = order.getInterfaceInfoId();
        Double money = order.getMoney();
        String paymentMethod = order.getPaymentMethod();
        alipayRequest.setBizContent(" {\"out_trade_no\":\"" + id + "\","
                + "\"total_amount\":\"" + money + "\","
                + "\"subject\":\"" + interfaceInfoId
                + "\","
                + "\"body\":\"" + paymentMethod + "\","
                +
                "\"timeout_express\":\"" + timeout + "\","
                +
                "\"product_code\":\"FAST_INSTANT_TRADE_PAY\"}");
        String result = alipayClient.pageExecute(alipayRequest).getBody();
// 会收到支付宝的响应,响应的是一个页面,只要浏览器显示这个页面,就会自动来到支付宝的收银台页面
        System.out.println("支付宝的响应:" + result);
        return result;
    }
}

【实体类】

package com.hz.pojo;

import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import lombok.Data;

import java.io.Serializable;
import java.util.Date;

@Data
@TableName(value ="`order`")
public class Order implements Serializable {
    /**
     * 订单Id
     */
    @TableId(type = IdType.ASSIGN_UUID)
    private Long id;
    /**
     * 用户Id
     */
    private Long userId;
    /**
     * 接口Id
     */
    private Long interfaceInfoId;
    /**
     * 支付金额
     */
    private Double money;
    /**
     * 支付方式
     */
    private String paymentMethod;
    /**
     * 0 - 未支付 1 - 已支付
     */
    private Integer status;
    /**
     * 创建时间
     */
    private Date createTime;
    /**
     * 更新时间
     */
    private Date updateTime;
    /**
     * 是否删除
     */
    private Integer isDelete;
    @TableField(exist = false)
    private static final long serialVersionUID = 1L;
}

【controlelr】

package com.hz.controller;

import com.alipay.api.AlipayApiException;
import com.alipay.easysdk.factory.Factory;
import com.hz.config.AlipayTemplate;
import com.hz.pojo.Order;
import org.springframework.web.bind.annotation.*;

import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
import java.util.HashMap;
import java.util.Map;

/**
 * 支付宝接口
 */
@RestController
@RequestMapping("/alipay")
@CrossOrigin
public class AliPayController {
    @Resource
    AlipayTemplate alipayTemplate;

    @GetMapping(value = "/pay", produces = "text/html")
    @ResponseBody
    public String pay(@RequestParam long id) throws AlipayApiException {
        Order order = new Order();
        order.setId(220948748372233L);
        order.setUserId(129904058947L);
        order.setInterfaceInfoId(294389472934L);
        order.setMoney(20.0);
        order.setPaymentMethod("支付宝");
        return alipayTemplate.pay(order);
    }

    @PostMapping("/notify") // 注意这里必须是POST接口
    public String payNotify(HttpServletRequest request) throws Exception {
        if (request.getParameter("trade_status").equals("TRADE_SUCCESS")) {
            System.out.println("=========支付宝异步回调========");
            Map<String, String> params = new HashMap<>();
            Map<String, String[]> requestParams = request.getParameterMap();
            for (String name : requestParams.keySet()) {
                params.put(name, request.getParameter(name));
// System.out.println(name + " = " +
                request.getParameter(name);
            }
            String tradeNo = params.get("out_trade_no");
            String gmtPayment = params.get("gmt_payment");
            String alipayTradeNo = params.get("trade_no");
// 支付宝验签
            if (Factory.Payment.Common().verifyNotify(params)) {
// 验签通过
                System.out.println("交易名称: " + params.get("subject"));
                System.out.println("交易状态: " +
                        params.get("trade_status"));
                System.out.println("支付宝交易凭证号: " +
                        params.get("trade_no"));
                System.out.println("商户订单号: " +
                        params.get("out_trade_no"));
                System.out.println("交易金额: " +
                        params.get("total_amount"));
                System.out.println("买家在支付宝唯一id: " +
                        params.get("buyer_id"));
                System.out.println("买家付款时间: " +
                        params.get("gmt_payment"));
                System.out.println("买家付款金额: " +
                        params.get("buyer_pay_amount"));
// 更新订单状态
            }
        }
        return "success";
    }
}

【测试】

http://localhost:80/alipay/pay?id=6

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

React、Node.js 和支付宝的集成通常涉及到创建一个后端API来处理支付请求,并在前端使用React展示用户界面。以下是简化的步骤和概述: 1. **安装必要的依赖**: - Node.js: 官方网站下载并安装最新版本 - Express (for Node.js后端): `npm install express` - 支付宝SDK: 在Alipay开放平台注册应用并获取沙箱环境的`APP_ID`、`私钥`等信息,然后安装支付宝JS API库,如`alipay-sdk-js`。 2. **设置支付宝支付接口**: - 创建一个Express路由来处理支付请求,例如: ```javascript const express = require('express'); const app = express(); app.post('/alipay/pay', async (req, res) => { // 从请求中提取数据(如订单ID) const orderId = req.body.orderId; try { // 使用支付宝SDK发起沙箱支付请求 const result = await alipay.pay({ ...// 使用你的APP_ID、私钥、订单信息等配置参数 }); // 返回支付结果到前端 res.json(result); } catch (error) { console.error(error); res.status(500).json({ error: 'Payment failed' }); } }); ``` 3. **前端React部分**: - 引入支付宝UI组件库: ```jsx import Alipay from '@alipay/h5-component'; //... ``` - 在需要发起支付的地方,通过POST请求调用后端API: ```jsx const handleSubmit = async () => { try { const response = await axios.post('/alipay/pay', { orderId: this.state.orderId }); handleSuccess(response.data); // 自定义处理支付成功的方法 } catch (error) { handleFailure(error); } }; ``` 4. **安全性和测试**: - 确保所有的敏感信息在实际生产环境中加密存储,避免直接暴露给前端。 - 使用沙箱环境进行初步测试,支付宝有专门的测试网关URL。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

蔚一

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值