尚品汇-支付宝介绍、跳转支付订单页面实现(四十六)

目录:

(1)支付宝介绍

(1)支付宝介绍

(3)显示付款页面信息

(5)创建支付控制器PaymentController

(1)支付宝介绍

支付宝简介

支付宝(中国)网络技术有限公司 [1]  是国内的第三方支付平台,致力于提供简单、安全、快速的支付解决方案 [2]  。支付宝公司从2004年建立开始,始终以信任作为产品和服务的核心。旗下有支付宝支付宝钱包两个独立品牌。自2014年第二季度开始成为当前全球最大的移动支付厂商。

当用户提交订单会跳转到选择支付渠道页面!

http://payment.gmall.com/pay.html?orderId=43

当用户点击立即支付时生成支付的二维码

 

使用支付宝app 进行扫码支付

过程分析

对接支付宝的准备工作

1、申请条件

1.  企业或个体工商户可申请;

2.  提供真实有效的营业执照,且支付宝账户名称需与营业执照主体一致;

3.  网站能正常访问且页面信息有完整商品内容;

4.  网站必须通过ICP备案,个体户备案需与账户主体一致。

(团购类网站不支持个体工商户签约)

支付手续费

申请步骤

  1. 支付宝商家中心中申请 https://www.alipay.com/
  2. https://b.alipay.com/signing/productSetV2.htm?mrchportalwebServer=https%3A%2F%2Fmrchportalweb.alipay.com

 

 

 

 

 

 

 

 

一个工作日后登录到蚂蚁金服开发者中心:

可以查看到一个已经签约上线的应用。 其中非常重要的是这个APPID,需要记录下来之后的程序中要用到这个参数。

点击查看

到此为止,电商网站可以访问支付宝的最基本的准备已经完成。

 

接下来搭建支付模块

(1)支付宝介绍

支付宝开发手册:https://docs.open.alipay.com/270/105900/

搭建service-payment

搭建方式如service-order

修改pom.xml

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
   <modelVersion>4.0.0</modelVersion>
   <parent>
      <groupId>com.atguigu.gmall</groupId>
      <artifactId>service</artifactId>
      <version>1.0</version>
   </parent>

   <version>1.0</version>
   <artifactId>service-payment</artifactId>
   <packaging>jar</packaging>
   <name>service-payment</name>
   <description>service-payment</description>

   <dependencies>   
<dependency>
       <groupId>com.atguigu.gmall</groupId>
       <artifactId>service-order-client</artifactId>
       <version>1.0</version>
    </dependency>
 </dependencies>

   <build>
      <finalName>service-payment</finalName>
      <plugins>
         <plugin>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-maven-plugin</artifactId>
         </plugin>
      </plugins>
   </build>

</project>

添加配置

bootstrap.properties

spring.application.name=service-payment
spring.profiles.active=dev
spring.cloud.nacos.discovery.server-addr=192.168.200.129:8848
spring.cloud.nacos.config.server-addr=192.168.200.129:8848
spring.cloud.nacos.config.prefix=${spring.application.name}
spring.cloud.nacos.config.file-extension=yaml
spring.cloud.nacos.config.shared-configs[0].data-id=common.yaml

 

 

启动类

package com.atguigu.gmall.payment;


@SpringBootApplication
@ComponentScan({"com.atguigu.gmall"})
@EnableDiscoveryClient
@EnableFeignClients(basePackages= {"com.atguigu.gmall"})
public class ServicePaymentApplication {

   public static void main(String[] args) {
      SpringApplication.run(ServicePaymentApplication.class, args);
   }

}

 

导入sdk包

https://mvnrepository.com/artifact/com.alipay.sdk/alipay-sdk-java

<!--导入支付宝支付sdk-->
<dependency>
   <groupId>com.alipay.sdk</groupId>
   <artifactId>alipay-sdk-java</artifactId>
   <version>4.8.73.ALL</version>
</dependency>

(3)显示付款页面信息

支付页面信息展示流程

 

在根据订单id获取订单信息接口

在service-order添加接口

OrderService接口


/**
 * 根据订单Id 查询订单信息
  * @param orderId
 * @return
 */
OrderInfo getOrderInfo(Long orderId);

实现类: 


@Override
public OrderInfo getOrderInfo(Long orderId) {
    OrderInfo orderInfo = orderInfoMapper.selectById(orderId);
    QueryWrapper<OrderDetail> queryWrapper = new QueryWrapper<>();
    queryWrapper.eq("order_id", orderId);
    List<OrderDetail> orderDetailList = orderDetailMapper.selectList(queryWrapper);
    orderInfo.setOrderDetailList(orderDetailList);
    return orderInfo;
}
OrderApiController
/**
 * 内部调用获取订单
  * @param orderId
 * @return
 */
@GetMapping("inner/getOrderInfo/{orderId}")
public OrderInfo getOrderInfo(@PathVariable(value = "orderId") Long orderId){
    return orderService.getOrderInfo(orderId);
}

在service-order-client添加远程调用接口

OrderFeignClient


/**
 * 获取订单
  * @param orderId
 * @return
 */
@GetMapping("/api/order/inner/getOrderInfo/{orderId}")
OrderInfo getOrderInfo(@PathVariable(value = "orderId") Long orderId);
OrderDegradeFeignClient

@Override
public OrderInfo getOrderInfo(Long orderId) {
    return null;
}

 

- server-gateway模块网关配置

- id: web-payment
  uri: lb://web-all
  predicates:
  - Host=payment.gmall.com
- id: service-payment
  uri: lb://service-payment
  predicates:
  - Path=/*/payment/** # 路径匹配

(5)创建支付控制器PaymentController

Web-all模块

 

package com.atguigu.gmall.payment.controller;
@Controller
public class PaymentController {

    @Autowired
    private OrderFeignClient orderFeignClient;

    /**
     * 支付页
           * @param request
     * @return
     */
    @GetMapping("pay.html")
    public String success(HttpServletRequest request, Model model) {
        String orderId = request.getParameter("orderId");
        OrderInfo orderInfo = orderFeignClient.getOrderInfo(Long.parseLong(orderId));
        model.addAttribute("orderInfo", orderInfo);
        return "payment/pay";
    }
}

 页面渲染


<div class="checkout-tit">
   <h4 class="tit-txt"><span class="success-icon"></span><span  class="success-info">订单提交成功,请您及时付款,以便尽快为您发货~~</span></h4>
   <div class="paymark">
      <span class="fl">请您在提交订单<em class="orange time">4小时</em>之内完成支付,超时订单会自动取消。订单号:<em th:text="${orderInfo.id}">00</em></span>
      <span class="fr"><em class="sui-lead">应付金额:</em><em  class="orange money" th:text="'¥'+${orderInfo.totalAmount}">¥1</em></span>
   </div>
</div>

跳转到支付页面:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

喵俺第一专栏

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

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

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

打赏作者

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

抵扣说明:

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

余额充值