当前位置：网站首页>Alipay payment episode 11: monitoring after successful payment callback

Alipay payment episode 11: monitoring after successful payment callback

2022-06-12 20:00:00 【XRT_ knives】

Alipay pay Episode 11 ： Listening after successful payment callback

One 、 Code

  • Directory structure

    Insert picture description here

    Insert picture description here

  • to update OrderDetailController.java
    package com.dzy.alipay.web.order;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;

import com.dzy.alipay.entity.OrderDetail;
import com.dzy.alipay.service.order.OrderDetailService;
import com.dzy.alipay.vo.PayVo;
import com.dzy.alipay.vo.R;
import lombok.extern.log4j.Log4j2;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

@Controller
@Log4j2
public class OrderDetailController {
      
    private final OrderDetailService orderDetailService;

    public OrderDetailController(OrderDetailService orderDetailService) {
      
        this.orderDetailService = orderDetailService;
    }

    @PostMapping("/api/paycallback/course")
    @ResponseBody
    public R payCallback(@RequestBody PayVo payVo) {
      
        String userid = "1";
        QueryWrapper<OrderDetail> queryWrapper = new QueryWrapper<>();
        queryWrapper.eq("userid", userid);
        queryWrapper.eq("courseid", payVo.getCourseid());
        int count = orderDetailService.count(queryWrapper);
        return count > 0 ? R.ok() : R.error();
    }
}
  • to update main.html
    <!DOCTYPE html>

<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>kuangstudy- Alipay pay </title>
    <link rel="stylesheet" href="/static/css/main.css">

</head>
<body data-ext-version="3.1">
<div data-v-7e2550d6="" class="odm_extension image_downloader_wrapper"><!----></div>
<!-- Page header -->
<nav class="navbar sticky-top navbar-expand-lg navbar-light">
    <div class="container">
        <a class="navbar-brand logo" href="https://www.kuangstudy.com/">
            <img style="width: 112px;" src="https://www.kuangstudy.com//assert/course/c1//index_topleft_logo_black.png" alt="">
        </a>
        <div class="collapse navbar-collapse position-relative">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item position-relative">
                    <a class="nav-link ksd-nav-linknav nav-link-course" href="https://www.kuangstudy.com/course"> Course </a>
                    <i class="iconfont ksd-bgd-left"> free </i>
                </li>
                <li class="nav-item">
                    <a class="nav-link ksd-nav-linknav nav-link-topics active" href="https://www.kuangstudy.com/bbs"> Rivers and lakes </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link ksd-nav-linknav nav-link-down" href="https://www.kuangstudy.com/app"> Navigation </a>
                </li>
            </ul>
            <div id="ksdloginbox">
                <div style="position: relative;top:-18px">
                    <div class="tipmessage-box" style="cursor: pointer"><i class="iconfont iconiconfontunie62c tp1 pr pr-1"></i><span class="im-notify ksd-im-number im-number im-center" style="display: none"></span> news 
                    </div>
                    <div class="i-frame animated2 fadeInDown"></div>
                    <div class="ksd-logindrop show" data-vip="2">
                        <a href="https://www.kuangstudy.com/u" class="ksd-home pr tp2" style="z-index: 11"><i class="iconfont iconhome pr pr-1"></i> Enter home page </a>
                        <a class="dropdown-toggle ksd-user-info" href="javascript:void(0);" title=" Feige " data-vip="2" id="navbarDropdown">
            <span class="pr">
                <img class="ksd-avatar2 ksd-avatar-img" src="https://www.kuangstudy.com//assert/course/c1//132" alt="">
                <span class="ksd-iconrenzheng-vip"><img src="https://www.kuangstudy.com//assert/course/c1//vip.png" alt=""></span>
            </span>
                            <span class="ksd-text"> Feige </span>
                        </a>
                        <div class="ksd-login-items">
                            <div class="ksd-header-items mt-3">
                                <ul>
                                    <li class="ksd-num-items">
                                        <a href="https://www.kuangstudy.com/u#topic">
                                            <span class="num ksd-num-count6">3</span>
                                            <span class="ktext"> article </span>
                                        </a>
                                    </li>
                                    <li class="ksd-num-items">
                                        <a href="https://www.kuangstudy.com/u#fans">
                                            <span class="num ksd-num-count1">7</span>
                                            <span class="ktext"> Focus on </span>
                                        </a>
                                    </li>
                                    <li class="ksd-num-items">
                                        <a href="https://www.kuangstudy.com/u#follow">
                                            <span class="num ksd-num-count2">471</span>
                                            <span class="ktext"> fans </span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <div>
                                <div class="citems ksd-sign-items">
                                    <a href="javascript:void(0);" data-num="2" class="ksd-user-qiandao"><i class="iconfont iconsetlocation pr-2 pr tp1"></i><span class="ksd-uqtext"> Sign in </span></a>
                                </div>
                            </div>
                        </div>
                        <div class="ksd-login-items">
                            <ul>
                                <li class="items">
                                    <a href="https://www.kuangstudy.com/u" style="width:126px;text-align:left" title=" Click to go to the personal Center " class="fl flitems"><i class="iconfont iconhome"></i> Personal center </a>


                                    <a href="https://www.kuangstudy.com/vip/pay" title=" Click to go to order and renew " class="fr fritems pr"><span class="vipicon fw" style="padding:2px 6px"> Members of the year </span></a>


                                </li>
                                <li class="items ksdcopylinknum" title=" Click Copy digital account " data-clipboard-text="2">

                                    <a href="https://www.kuangstudy.com/u/settings" style="width:160px;text-align:left" class="fl ksd-settings2 flitems"><i class="iconfont iconiconzh1"></i> account number </a>
                                    <a href="javascript:void(0);" class="fr ksd-settings2 fritems">2</a>
                                </li>
                                <li class="items ksd-exp-itemboxs">
                                    <a href="javascript:void(0);" class="fl flitems"><i class="iconfont icondengji2 tp1 pr"></i> Grade </a>
                                    <a href="javascript:void(0);" class="fr fritems ksd-coin-exp show1" data-exp="74000"><span class="ksd-num-exp">74000</span>exp</a>
                                    <a href="javascript:void(0);" class="fr fritems show2 ksd-coin-exp ksd-coin-exp-text" data-exp="74000">Lv6</a>
                                </li>
                                <li class="items">
                                    <a href="javascript:void(0);" class="fl flitems"><i class="iconfont iconjinbi"></i>K The coin </a>
                                    <a href="javascript:void(0);" class="fr fritems ksd-coin-coin" data-coin="4814887"><span class="ksd-coin-cointext ksd-num-coin">4814887</span><span class="pr ftp2"> The coin </span></a>
                                </li>
                                <li class="items" title=" Subscribe to membership ">


                                    <a href="https://www.kuangstudy.com/vip/pay" style="text-align:left" class="fl ksd-settings2 flitems"><i class="iconfont iconVIP_paiban"></i> View membership benefits </a>
                                </li>
                                <li class="items">
                                    <a href="https://www.kuangstudy.com/u/settings" style="width:100%;text-align:left" class="fl flitems"><i class="iconfont iconSettingscontroloptions"></i> Personal settings </a>
                                </li>
                            </ul>
                        </div>
                        <div class="ksd-login-items bnone">
                            <ul>
                                <li class="items">
                                    <a href="javascript:void(0);" class="fl flitems ksd-logout"><i class="iconfont iconai-out"></i> Log out </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</nav>

<!-- Content area -->
<div id="app" class="container" style="margin-top: 55px;"><h1 class="text-center fz32 mb-5"><a href="https://www.kuangstudy.com/app/code"> Notes Download ：https://www.kuangstudy.com/app/code</a></h1>
    <div id="ksd-alert-msg-1" class="alert alert-primary">
        <button type="button" data-dismiss="alert" class="close">×</button>
        <strong><i class="iconfont icontubiao_xitongtongzhi fz20"></i></strong><span class="pl-2 ccmsg"> Tutorial provider ： Qinjiang （ Meet the madman and say ）、 Xuchengfei （ Feige ）, The author has authorized ！Bilibili Address ：<a href="https://space.bilibili.com/95256449" target="_blank">https://space.bilibili.com/95256449</a></span>
    </div>
    <div class="row course-item-wrap">
        <div class="col-lg-12">
            <div class="tab-content">
                <div role="tabpanel" class="tab-pane fade show active">
                    <div class="row">
                        <div class="col-lg-12 text-center">
                            <img :src="'/alipay/pay?courseID='+courseID" alt="">
                        </div>
                    </div>
                    <div class="row course-block">
                        <div id="courseListBox" class="course_bdleft Mtp25">
                            <div class="course_stage_item"><h2 index="1" id="ksd-title-position-1" class="ksd-title-position-h2"><span class="cro_icon1">1</span> <span> The first stage ：JavaSE</span></h2>
                                <div class="path-course-r">
                                    <div class="row">


                                        <div v-for="(course,index) in courseList" class="col-lg-3 col-md-4 col-sm-6 animated fadeInUp delay-1s">
                                            <div class="course-item">

                                                <div class="course-img ">
                                                    <a :href="'https://www.kuangstudy.com/course/detail/'+course.courseid" target="_blank" :title="course.title" class="course__img">
                                                        <img height="140" width="100%" :src="'https://www.kuangstudy.com/'+course.img" >
                                                        <span class="num">1</span>
                                                        <span class="stimer">{
     {course.price}}</span>
                                                    </a>
                                                </div>

                                                <div class="course-content">
                                                    <h3 :title="course.title" class="course__title">
                                                        <a href="https://www.kuangstudy.com/course/detail/1317503462556848129" target="_blank" :title="course.title" class="course__img">
                                                            {
     {course.title}}
                                                        </a>
                                                    </h3>
                                                    <p class="course__author">{
     {course.intro}}</p>
                                                    <div class="course-price-wrap" @click="changePay(index)">
                                                        <span class="course__btn">
                                                            <i class="iconfont iconshouye"></i>
                                                             Click to pay 
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>


                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="/static/js/jquery-3.5.1.min.js"></script>
<script src="/static/js/vue.min.js"></script>
<script src="/static/js/axios.min.js"></script>
<script> var vue =new Vue({
         el:"#app", data:{
         courseList:[], courseID:'', pcourseId:"", ptimer:null, }, created:function () {
         this.loadCourse(); }, methods:{
         loadCourse:function () {
         var that = this; axios.post("/api/course/list").then(function (res) {
         console.log("res================>", res); if(res.data.code == 20000){
         that.courseList = res.data.data.courseList; that.courseID=that.courseList[0].courseid; } }) }, changePay:function (index) {
         this.courseID= this.courseList[index].courseid; this.paycallback(); }, paycallback : function(){
         var that = this; var courseId = that.courseID; if(that.ptimer)clearInterval(that.ptimer); that.ptimer = setInterval(function(){
         axios.post("/api/paycallback/course",{
        courseid:courseId}).then(function(res){
         console.log("res========>",res); if(res.data.code == 20000) {
         clearInterval(that.ptimer); alert(" Successful payment !!!"); } }) },3000); } } }) </script>
</body>
</html>

Two 、 Screenshot of success

  • Listening after successful payment callback

    Insert picture description here

    Insert picture description here

原网站

版权声明
本文为[XRT_ knives]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/02/202202281514397495.html

边栏推荐

猜你喜欢

随机推荐