首页 > 解决方案 > MERN应用支付成功后如何跳转到下一页?

问题描述

我正在使用 Paytm 支付网关进行交易。我的前端在 reactjs 中,后端在 nodejs 和 expressjs 中。我希望在成功付款后重定向下一页。

后端代码 - 用于检查校验和和交易。

    PaytmChecksum.generateSignature(JSON.stringify(paytmParams.body), paytmconfig.merchantkey).then(function(checksum){
        paytmParams.head = {

            "signature" : checksum
        };
        var post_data = JSON.stringify(paytmParams);
        var options = {
            /* for Staging */
            hostname: 'securegw-stage.paytm.in',
            /* for Production */
            // hostname: 'securegw.paytm.in',
            port: 443,
            path: '/v3/order/status',
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Content-Length': post_data.length
            }
        };
        // Set up the request
        var response = "";
        var post_req = https.request(options, function(post_res) {
            post_res.on('data', function (chunk) {
                response += chunk;
            });

            post_res.on('end', function(){
                console.log('Response: ', response);
                res.write(response)
            });
        });
        // post the data
        post_req.write(post_data);
        post_req.end();
    });

前端代码:将调用 onPayment 函数进行支付

onPayment= async(e)=>{
        e.preventDefault();
        try {
            var amount="1.00";
            var mobile_number="+919999999999";
            var email="abcd@gmail.com";
            var orderId="ORDER_ID"+(new Date().getTime());
            let params={
                orderId:orderId,
                email:email,
                amount:amount,
                mobile_number:mobile_number
            }
            var url="http://localhost:4000/payment/paynow";
            var request={
                url:url,
                params:params,
                method:"get"
            }

            const response = await Axios(request);
            const processParams=await response.data;
            console.log(processParams);

            var details={
                action : "https://securegw-stage.paytm.in/order/process",
                // params : params
                params : processParams
            }

            this.post(details);

        } catch (error) {
            
        }
    }

标签: node.jsreactjspayment-gatewaypaymentpaytm

解决方案


你可以使用react-router-dom

import {useHistory} from 'react-router-dom'


const history = useHistory()


history.push('yourNextPage', {details:detail})

任何一个 history.replace 都应该工作:

history.replace('yourNextPage', {details:detail})

编辑

{details:detail} 以防您想将上一页的状态传递给下一页

如果你不想通过任何状态

就足够了

history.push('yourNextPage')

推荐阅读