0

My code is running on local in py eni , I am trying to get solflare wallet address after connecting to it but it getting error here is the full code

<!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="{{ url_for('static', filename='styles.css') }}">
    <title>Connect Solana Wallet</title>
</head>
<body>
    <div class="container">
        <h1>Connect Your Solana Wallet</h1>
        <button id="connect-phantom">Connect Phantom</button>
        <button id="connect-solflare">Connect Solflare</button>
        <button id="connect-backpack">Connect Backpack</button>
        <p id="wallet-address"></p>
        <div id="result"></div>
    </div>

    <script>
        async function connectWallet(wallet) {
            let response;
            try {
                if (wallet === 'Phantom') {
                    const { solana } = window;
                    if (solana && solana.isPhantom) {
                        response = await solana.connect();
                    } else {
                        alert('Please install Phantom Wallet!');
                        return;
                    }
                } else if (wallet === 'Solflare') {
                    if (window.solflare) {
                        response = await window.solflare.connect();
                        // Solflare might require fetching the publicKey separately
                        if (!response.publicKey && window.solflare.publicKey) {
                            response.publicKey = window.solflare.publicKey;
                        }
                    } else {
                        alert('Please install Solflare Wallet!');
                        return;
                    }
                } else if (wallet === 'Backpack') {
                    if (window.backpack) {
                        response = await window.backpack.connect();
                    } else {
                        alert('Please install Backpack Wallet!');
                        return;
                    }
                }

                if (response && response.publicKey) {
                    document.getElementById('wallet-address').innerText = `Wallet Address: ${response.publicKey.toString()}`;
                    getURLParams(response.publicKey.toString());
                } else {
                    alert('Unable to retrieve wallet address.');
                }
            } catch (error) {
                console.error('Error connecting wallet:', error);
                alert('Failed to connect to the wallet.');
            }
        }

        document.getElementById('connect-phantom').onclick = () => connectWallet('Phantom');
        document.getElementById('connect-solflare').onclick = () => connectWallet('Solflare');
        document.getElementById('connect-backpack').onclick = () => connectWallet('Backpack');

        async function getURLParams(walletAddress) {
            const params = new URLSearchParams(window.location.search);
            const merkleTreeRoot = params.get('Merkle_Tree_Root');

            try {
                const response = await fetch(`/check_merkle_tree/${walletAddress}/${merkleTreeRoot}`);
                const result = await response.json();
                document.getElementById('result').innerText = result.message;
            } catch (error) {
                console.error('Error fetching merkle tree:', error);
                document.getElementById('result').innerText = 'Error fetching merkle tree details.';
            }
        }
    </script>
</body>
</html>

1 Answer 1

0
await window.solflare.connect()

The method above returns a boolean on whether connecting the wallet was successful,

change the lines connecting solflare wallet to this

  let isConnected = await window.solflare.connect();
  if (isConnected) response = window.solflare;

full snippet

<!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="{{ url_for('static', filename='styles.css') }}">
    <title>Connect Solana Wallet</title>
</head>

<body>
    <div class="container">
        <h1>Connect Your Solana Wallet</h1>
        <button id="connect-phantom">Connect Phantom</button>
        <button id="connect-solflare">Connect Solflare</button>
        <button id="connect-backpack">Connect Backpack</button>
        <p id="wallet-address"></p>
        <div id="result"></div>
    </div>

    <script>
        async function connectWallet(wallet) {
            let response;
            try {
                if (wallet === 'Phantom') {
                    const { solana } = window;
                    if (solana?.isPhantom) {
                        response = await solana.connect();
                    } else {
                        alert('Please install Phantom Wallet!');
                        return;
                    }
                } else if (wallet === 'Solflare') {
                    if (window.solflare) {
                        let isConnected = await window.solflare.connect();
                        if (isConnected) response = window.solflare;
                    } else {
                        alert('Please install Solflare Wallet!');
                        return;
                    }
                } else if (wallet === 'Backpack') {
                    if (window.backpack) {
                        response = await window.backpack.connect();
                    } else {
                        alert('Please install Backpack Wallet!');
                        return;
                    }
                }

                if (response?.publicKey) {
                    document.getElementById('wallet-address').innerText = `Wallet Address: ${response.publicKey.toString()}`;
                    getURLParams(response.publicKey.toString());
                } else {
                    alert('Unable to retrieve wallet address.');
                }
            } catch (error) {
                console.error('Error connecting wallet:', error);
                alert('Failed to connect to the wallet.');
            }
        }

        document.getElementById('connect-phantom').onclick = () => connectWallet('Phantom');
        document.getElementById('connect-solflare').onclick = () => connectWallet('Solflare');
        document.getElementById('connect-backpack').onclick = () => connectWallet('Backpack');

        async function getURLParams(walletAddress) {
            const params = new URLSearchParams(window.location.search);
            const merkleTreeRoot = params.get('Merkle_Tree_Root');

            try {
                const response = await fetch(`/check_merkle_tree/${walletAddress}/${merkleTreeRoot}`);
                const result = await response.json();
                document.getElementById('result').innerText = result.message;
            } catch (error) {
                console.error('Error fetching merkle tree:', error);
                document.getElementById('result').innerText = 'Error fetching merkle tree details.';
            }
        }
    </script>
</body>

</html>
1
  • thank you so much
    – Cadalt
    Commented Oct 2 at 17:02

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.