How to control Same Api calls firing multiple times

I'm trying to make a payment in NodeJS. After getting successful response for the payment, it's redirected to the successful page(ReactJs). After it's redirected to the successful page, (the '/getResponse' placed in useEffect) while rendering that successful page - "/getResponse" call should render only once Instead, "/getResponse" call is firing with same request and same response Multiple times.

api > Server.js:

    var express = require('express');
    const cors = require('cors');
    var app = express();
    var bodyParser = require('body-parser');
    app.use(bodyParser.json());
    app.use(function (req, res, next) {
    res.setHeader('Access-Control-Allow-Origin', baseURL);
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
    res.setHeader('Access-Control-Allow-Credentials', true);
    bodyParser.urlencoded({ extended: true });
    bodyParser.json();
    next();
});
app.use(express.json());
app.use(
    express.urlencoded({
      extended: true
    })
  );
app.use('/', function (req, res, next) {
console.log(' Deployment Testing! "NEW REQUEST "' + req.url);
next();
});

   app.listen(process.env.port||8080);

    app.post('/response', (req, res) => {
    console.log("response");
    txnid = req.body.txnid;
    amount = req.body.amount;
    let prodinfo = req.body.productinfo;
    let fname = req.body.firstname;
    let email = req.body.email;
    status = req.body.status;
    let hashStr = salt + "|" + status + "|||||||||||" + email + "|" + fname + "|" + prodinfo + "|" + amount + "|" + txnid + "|" + key;
    if(req.body.additionalCharges) {
        let addChrges = req.body.additionalCharges;
        hashStr = addChrges + "|" + hashStr;
    }
    let hash = calcHash(hashStr);
    console.log(hash);
    console.log("Request body:"+req)    
    if(hash == req.body.hash && req.body.status == 'success')   {
            console.log('Success');         
            res.redirect('http://localhost:3000/response');   // redirect to successpayment page  
         }
    
    else {
            console.log("failure");
            res.redirect('http://localhost:3000/responseFailure');
        }
    });
 

    app.get('/getResponse', (req, res) => {
        res.send({'status': status, 'txnid': txnid, 'amount': amount,});  
     });

reactApp> src > payment > PaymentSuccessPage.tsx :

`

const PaymentSuccessPage = (res) => {
  const rootStore = useContext(RootStoreContext);
  const{editDonation}=rootStore.donationStore;
  const{paymentURL}= rootStore.commonStore;
      const[txnid, setTxnid] = useState('');
     const[amount, setAmount] = useState('');
      const[status, setStatus] = useState(''); 
  
     useEffect(() => {
       Axios.get('http://localhost:8080/getResponse').then(res =>{    // this call is firing multiple times
         setTxnid(res.data.txnid);
         setAmount(res.data.amount);
         setStatus(res.data.status);
        let value = new DonationEdit();
        value.donationStatus = res.data.status;
        value.transactionId=res.data.txnid;
        if(rootStore.commonStore.donation)
          value.donationId = parseInt( rootStore.commonStore.donation);
        editPayment(value);
        
      });
      
    }, [ rootStore.commonStore.donation, editPayment, txnid, amount, status])

      return (
        <Container>...</Container> )}`

I'm really looking forward to know the solution. if the above issue is not understandable or if you want to know more about the issue , pls let me know.