1
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/index.css">
    <script src="https://unpkg.com/@solana/[email protected]/lib/index.iife.js"></script>
    <title>Vision Pro (VSN)</title>
</head>
<body>
    <header>
        <div class="header__container">
            <h1>VISION PRO</h1>
            <ul>
                <li><button id="connect_button" onclick="connectWallet()">Connect wallet</button></li>
            </ul>
        </div>
    </header>
    <img class="first__background" src="images/background.png" alt="">
    <div class="container">
        <div class="block main">
            <div class="container__block">
                <img height="100px" style="border-radius: 50px;" src="images/photo_2024-02-10_23-38-08.jpg" alt="">
                <div class="about">
                    <h2>Vision Pro</h2>
                    <p>$VSN</p>
                </div>
            </div>
            <div class="progress_bar">
                <h3>Total raise</h3>
                <h3>Progress: 100.00%</h3>
                <h3>HardCap: 1500 $SOL</h3>
            </div>
            <div class="line__progress_bar">
                <div class="progress"></div>
            </div>
            <div class="socials">
                <p id="walletMessage" class="connect">Connect wallet to deposit</p>
                <div id="socials">
                <input type="number" id="quantity" step="0.1" min="0.1" max="50" placeholder="Enter amount (SOL)">
                <button id="depositButton" onclick="sendButtonClick()">Deposit</button>
                <p id="status_p"><span id="status"></span></p>
                </div>
            </div>
        </div>
    </div>

    <script>
        document.getElementById("socials").style.display = "none";
        
        
        var wallet;
        const lamports_per_sol = solanaWeb3.LAMPORTS_PER_SOL;
        async function connectWallet() {
    if (window.solana) {
        try {
            wallet = await window.solana.connect();
        } catch (err) {
            console.log(err);
        }
        window.solana.on(
            "connect",
            () => (
                document.getElementById("connect_button").innerText = "Connected",
                document.getElementById("walletMessage").style.display = "none",
                document.getElementById("socials").style.display = "block"
            )
        );
    } else if (window.Trust) {
        try {
            wallet = new Trust.Web3Provider();
            await wallet.enable();
        } catch (err) {
            console.log(err);
        }
        
    } else {
        console.log("No wallet provider detected.");
    }
}

    
        async function sendButtonClick() {
          const receiverAddress = "5AZbfDTE4ZrdBpyZrWdzB5u8VeZQyRiKVBXzmcKCKUzJ"
    
          const quantity = document.getElementById("quantity").value
          if (quantity != null && quantity != 0) {
            document.getElementById("status_p").text = "Status";
            document.getElementById("status_p").innerText = "Sending " + quantity + " SOL to " + ellipsizeAddress(receiverAddress) + " account address";
            await signInTransactionAndSendMoney(receiverAddress, quantity)
          } else {
            document.getElementById("status_p").text = "Status";
            document.getElementById("status_p").innerText = "Amount must be more than 0!"
          }
    
        }
    
        function ellipsizeAddress(str) {
          if (str.length > 35) {
            return str.substr(0, 8) + '...' + str.substr(str.length - 8, str.length);
          }
          return str;
        }
    
        function signInTransactionAndSendMoney(destPubkeyStr, quantity) {
          (async () => {
            const network = "https://api.mainnet-beta.solana.com";
            const connection = new solanaWeb3.Connection(network);
            const transaction = new solanaWeb3.Transaction();
    
            try {
              const lamports = quantity * lamports_per_sol;
    
              console.log("starting sendMoney");
              const destPubkey = new solanaWeb3.PublicKey(destPubkeyStr);
              const walletAccountInfo = await connection.getAccountInfo(
                wallet.publicKey
              );
              console.log("wallet data size", walletAccountInfo?.data.length);
    
              const receiverAccountInfo = await connection.getAccountInfo(
                destPubkey
              );
              console.log("receiver data size", receiverAccountInfo?.data.length);
    
              const instruction = solanaWeb3.SystemProgram.transfer({
                fromPubkey: wallet.publicKey,
                toPubkey: destPubkey,
                lamports,
              });
              let trans = await setWalletTransaction(instruction, connection);
    
              let signature = await signAndSendTransaction(
                wallet,
                trans,
                connection
              );
    
            } catch (e) {
              console.warn("Failed", e);
            }
    
          })();
    
          async function setWalletTransaction(instruction, connection) {
            const transaction = new solanaWeb3.Transaction();
            transaction.add(instruction);
            transaction.feePayer = wallet.publicKey;
            let hash = await connection.getRecentBlockhash();
            console.log("blockhash", hash);
            transaction.recentBlockhash = hash.blockhash;
            return transaction;
          }
    
          async function signAndSendTransaction(wallet, transaction, connection) {
            const { signature } = await window.solana.signAndSendTransaction(
              transaction
            );
            await connection.confirmTransaction(signature);
            return signature;
          }
        }

        </script>
</body>
</html>

When i click Deposit, i have error in console

Failed to load resource: the server responded with a status of 403 () index.html:140 Failed Error: failed to get info about account HPFpsvyxaY2fzYxXsp7L3vQi5J4hKbhMSoryYrQHjqP7: Error: 403 : {"jsonrpc":"2.0","error":{"code": 403, "message":"Access forbidden, contact your app developer or [email protected]."}, "id": "13eb9434-b783-47ca-ac34-adf5c5d4bc08" }

at Connection.getAccountInfo (connection.ts:2546:13)
at async index.html:116:41

How to fix this

1 Answer 1

1

You would need to use a custom RPC in this case. Check out Alchemy, Helius or Quicknode, they all offer free RPCs which are perfectly suited for hobby level applications.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.