File size: 3,802 Bytes
8befdfa
976c341
8befdfa
 
 
 
 
c9cd97e
8befdfa
 
 
976c341
8befdfa
 
 
976c341
8befdfa
 
 
 
976c341
8befdfa
 
 
 
 
976c341
8befdfa
 
 
 
 
976c341
8befdfa
 
 
 
 
 
 
 
976c341
8befdfa
 
 
 
 
976c341
 
 
 
 
8befdfa
 
 
976c341
 
 
 
 
 
8befdfa
 
 
 
976c341
8befdfa
976c341
 
8befdfa
976c341
 
8befdfa
 
07b0e1a
c9cd97e
07b0e1a
976c341
07b0e1a
 
 
8befdfa
07b0e1a
8befdfa
07b0e1a
 
8befdfa
 
976c341
 
 
8befdfa
 
 
 
 
 
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
95
96
97
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Test /add_points_and_refresh_fn API</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.2.19/tailwind.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/@gradio/client"></script>
</head>
<body class="bg-gray-100 p-8">
    <div class="max-w-2xl mx-auto bg-white rounded-lg shadow-lg p-6">
        <h1 class="text-3xl font-bold mb-6">API ํ…Œ์ŠคํŠธ</h1>
        
        <div class="mb-4">
            <label class="block text-gray-700 text-sm font-bold mb-2" for="email">
                ์ด๋ฉ”์ผ
            </label>
            <input type="email" 
                   id="email" 
                   class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
                   placeholder="์ด๋ฉ”์ผ์„ ์ž…๋ ฅํ•˜์„ธ์š”">
        </div>

        <div class="mb-4">
            <button id="submit" 
                    class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
                ์ œ์ถœ
            </button>
        </div>

        <div class="mb-4">
            <label class="block text-gray-700 text-sm font-bold mb-2">
                ์ƒํƒœ
            </label>
            <div id="status" 
                 class="border rounded w-full py-2 px-3 text-gray-700 bg-gray-100">
            </div>
        </div>

        <div class="mb-4">
            <label class="block text-gray-700 text-sm font-bold mb-2">
                ๊ฒฐ๊ณผ๊ฐ’
            </label>
            <div id="value" 
                 class="border rounded w-full py-2 px-3 text-gray-700 bg-gray-100">
            </div>
        </div>

        <div id="debug" class="mt-4 p-4 bg-gray-200 rounded">
            <h2 class="font-bold mb-2">๋””๋ฒ„๊ทธ ์ •๋ณด</h2>
            <pre id="debug-info" class="whitespace-pre-wrap"></pre>
        </div>
    </div>

    <script>
        function log(message) {
            const debugInfo = document.getElementById('debug-info');
            debugInfo.textContent += message + '\n';
            console.log(message);
        }

        document.getElementById('submit').addEventListener('click', async () => {
            const email = document.getElementById('email').value;
            const statusElement = document.getElementById('status');
            const valueElement = document.getElementById('value');
            document.getElementById('debug-info').textContent = ''; // ๋””๋ฒ„๊ทธ ์ •๋ณด ์ดˆ๊ธฐํ™”

            // ์ƒํƒœ ์ดˆ๊ธฐํ™”
            statusElement.textContent = '์ฒ˜๋ฆฌ์ค‘...';
            valueElement.innerHTML = '';
            
            log(`์ด๋ฉ”์ผ ์ž…๋ ฅ๊ฐ’: ${email}`);

            try {
                log('Gradio ํด๋ผ์ด์–ธํŠธ ์—ฐ๊ฒฐ ์‹œ๋„...');
                const client = await gradio.client("ginipick/Dokdo-pay");
                log('ํด๋ผ์ด์–ธํŠธ ์—ฐ๊ฒฐ ์„ฑ๊ณต');

                log('API ํ˜ธ์ถœ ์‹œ์ž‘...');
                const result = await client.predict("/add_points_and_refresh_fn", {
                    email: email
                });
                log(`์‘๋‹ต ๋ฐ์ดํ„ฐ: ${JSON.stringify(result.data, null, 2)}`);

                statusElement.textContent = result.data[0] || '์‘๋‹ต ์—†์Œ';
                valueElement.innerHTML = result.data[1] || '์‘๋‹ต ์—†์Œ';

            } catch (error) {
                log(`์—๋Ÿฌ ๋ฐœ์ƒ: ${error.message}`);
                statusElement.textContent = `์—๋Ÿฌ: ${error.message}`;
                valueElement.innerHTML = '์—๋Ÿฌ ๋ฐœ์ƒ';
                console.error('Error:', error);
            }
        });
    </script>
</body>
</html>