Creating phonepe payment gateway using phonepe checkout.js but it is failed to initiate payments [closed]

I am creating creating phonepe integration but failed to intiate payment, I am getting messages like Payment Initiation failed

My front code is:

document.getElementById("payWithPhonePe").addEventListener("click", function() {
  alert("hi");
  const amount = 15;
  const orderId = "unique-order-id-" + new Date().getTime();
  fetch("<?php echo site_url("beta/change_package_1/create_phonePe"); ?>", {
      method: "POST",
      headers: {
        "Content-Type": "application/json"
      },
      body: JSON.stringify({
        amount: amount,
        orderId: orderId
      })
    }).then(response => response.json()).then(data => {
    if (data.success) {
      PhonePe.init({
        orderId: data.data.orderId,
        merchantId: data.data.merchantId,
        redirectUrl: data.data.redirectUrl,
        success: (res) => {
          alert("Payment was successful!");
          console.log(res);
        },
        failure: (res) => {
          alert("Payment failed.");
          console.log(res);
        },
        close: () => {
          alert("Payment window closed.");
        }
      });
    } else {
      alert("Payment initiation failed!");
    }
  }).catch(error => {
    // console.error("Error:", error);      
  });
});

<script src="https://mercury.phonepe.com/web/bundle/checkout.js"></script>

<button id="payWithPhonePe">Pay with PhonePe</button>

Backend code is: Controller.php
method is:

function createPhonePePayment($amount, $orderId) {
        $merchantId = "";
        $merchantKey = "";
    
        $url = "https://api.phonepe.com/apis/hermes/pg/v1/pay";
        // Payment request payload
        $payload = [
            "merchantId" => $merchantId,
            "transactionId" => $orderId,
            "amount" => $amount * 100,
            "currency" => "INR",
            "redirectUrl" => site_url('beta/change_package_1')
        ];
    
        $jsonPayload = json_encode($payload);
    
        $checksum = hash_hmac('sha256', $jsonPayload, $merchantKey);
    
        $headers = [
            'Content-Type: application/json',
            'X-VERIFY: ' . $checksum . "###" . $merchantId,
        ];
    
        // Initialize cURL
        $ch = curl_init($url);
        curl_setopt($ch, CURLOPT_POST, 1);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $jsonPayload);
        curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    
        // Execute the request
        $response = curl_exec($ch);
        curl_close($ch);
    
        // Decode the response
        return json_decode($response, true);
    }

    public function create_phonePe(){
        header('Content-Type: application/json');
        $input = json_decode(file_get_contents("php://input"), true);
        if (!isset($input['amount']) || !isset($input['orderId'])) {
            echo json_encode(["success" => false, "error" => "Invalid input."]);
            return;
        }
    
        $amount = $input['amount'];
        $orderId = $input['orderId'];
        $responseData = $this->createPhonePePayment($amount, $orderId);
        
        if ($responseData && isset($responseData['data']['instrumentResponse']['redirectUrl'])) {
            echo json_encode([
                "success" => true,
                "data" => [
                    "orderId" => $orderId,
                    "merchantId" => $merchantId,
                    "redirectUrl" => $responseData['data']['instrumentResponse']['redirectUrl']
                ]
            ]);
        } else {
            echo json_encode([
                "success" => false,
                "error" => isset($responseData['error']) ? $responseData['error'] : "Failed to initiate payment."
            ]);
        }
    }

Please help me solve the problem. I am using right credentials like merchant Id and API key. I want to solve phonepe integration payments initiation failed problem.