File size: 3,521 Bytes
58f870a
d7ae16d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
291e8c2
6c01ee1
d7ae16d
 
 
 
 
 
 
 
326b9e2
d7ae16d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
0292fb1
291e8c2
d7ae16d
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>WhatsApp QR Code</title>
    <style>
        .button {
            border: none;
            color: white;
            padding: 16px 32px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            transition-duration: 0.4s;
            cursor: pointer;
        }
        .buttonGreen {
            background-color: white;
            color: black;
            border: 2px solid #4CAF50;
        }
        .buttonGreen:hover {
            background-color: #4CAF50;
            color: white;
        }
        #qrCode {
            display: block;
            margin: 20px auto;
        }
        #statusText {
            text-align: center;
            color: blue;
        }
    </style>
</head>
<body>

    <h1>WhatsApp QR Code</h1>
    <form id="authForm">
        <label for="idInstance">Id Instance:</label><br>
        <input required type="text" id="idInstance" name="idInstance"><br>
        <label for="apiTokenInstance">API Token:</label><br>
        <input required type="text" id="apiTokenInstance" name="apiTokenInstance"><br><br>
        <button type="submit" class="button buttonGreen">Get QR Code</button>
    </form>

    <p id="statusText"></p>
    <img id="qrCode" src="" alt="QR Code" hidden>

    <script>
        document.getElementById("authForm").addEventListener("submit", function(event) {
            event.preventDefault();

            const idInstance = document.getElementById("idInstance").value;
            const apiTokenInstance = document.getElementById("apiTokenInstance").value;
            const apiUrl = "https://apiUrl"; // Замените на фактический URL API

            function updateQRCode() {
                fetch(`${apiUrl}/waInstance${idInstance}/qr/${apiTokenInstance}`)
                    .then(response => response.json())
                    .then(data => {
                        const qrCodeElement = document.getElementById("qrCode");
                        const statusText = document.getElementById("statusText");
                        
                        if (data.type === 'qrCode') {
                            qrCodeElement.src = `data:image/png;base64,${data.message}`;
                            qrCodeElement.hidden = false;
                            statusText.textContent = "";
                        } else if (data.type === 'error') {
                            qrCodeElement.hidden = true;
                            statusText.textContent = `Error: ${data.message}`;
                        } else if (data.type === 'alreadyLogged') {
                            qrCodeElement.hidden = true;
                            statusText.textContent = "Account already authorized.";
                        }
                    })
                    .catch(error => {
                        console.error("Error fetching QR code:", error);
                        document.getElementById("statusText").textContent = "Error fetching QR code.";
                    });
            }

            // Запуск обновления QR-кода каждую секунду
            setInterval(updateQRCode, 1000);
            updateQRCode(); // Вызов сразу после отправки формы
        });
    </script>

</body>
</html>