chatbot/debug-headers.html at main · Ankush-Rajpoot/chatbot · GitHub

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
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
<!DOCTYPE html>
<html>
<head>
    <title>Debug Hasura Headers</title>
</head>
<body>
    <h1>Debug Headers Sent to n8n</h1>
    <p>This will help us understand what headers Hasura is sending to your n8n webhook.</p>

    <div>
        <h3>Test with Different Header Combinations:</h3>
        <button onclick="testHeaders1()">Test: Standard Headers</button>
        <button onclick="testHeaders2()">Test: Hasura Headers Only</button>
        <button onclick="testHeaders3()">Test: No Auth Headers</button>
        <button onclick="testHeaders4()">Test: JSON Web Token</button>
    </div>

    <div id="result"></div>

    <script>
        async function testWithHeaders(headers, testName) {
            const result = document.getElementById('result');
            result.innerHTML = `Testing ${testName}...`;

            console.log(`Testing ${testName} with headers:`, headers);

            try {
                const response = await fetch('https://ankushrajpoot.app.n8n.cloud/webhook/chatbot', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        ...headers
                    },
                    body: JSON.stringify({
                        input: {
                            chat_id: "debug-test-chat",
                            message: `Debug test with ${testName}`
                        },
                        session_variables: {
                            "x-hasura-user-id": "debug-user",
                            "x-hasura-role": "user"
                        }
                    })
                });

                const responseText = await response.text();
                console.log(`${testName} - Status:`, response.status);
                console.log(`${testName} - Response:`, responseText);

                let formattedResponse;
                try {
                    formattedResponse = JSON.stringify(JSON.parse(responseText), null, 2);
                } catch {
                    formattedResponse = responseText;
                }

                result.innerHTML = `
                    <div style="border: 1px solid #ccc; margin: 10px 0; padding: 10px;">
                        <h3 style="color: ${response.ok ? 'green' : 'red'};">
                            ${testName} - Status: ${response.status}
                        </h3>
                        <h4>Headers sent:</h4>
                        <pre style="background: #f5f5f5; padding: 10px;">${JSON.stringify(headers, null, 2)}</pre>
                        <h4>Response:</h4>
                        <pre style="background: #f0f0f0; padding: 10px;">${formattedResponse}</pre>
                    </div>
                `;
            } catch (error) {
                result.innerHTML = `
                    <div style="color: red; border: 1px solid red; padding: 10px; margin: 10px 0;">
                        <h3>${testName} - Error:</h3>
                        <p>${error.message}</p>
                    </div>
                `;
                console.error(`${testName} error:`, error);
            }
        }

        async function testHeaders1() {
            await testWithHeaders({
                'Authorization': 'Bearer test-token-123',
                'x-hasura-user-id': 'test-user',
                'x-hasura-role': 'user'
            }, 'Standard Headers');
        }

        async function testHeaders2() {
            await testWithHeaders({
                'x-hasura-user-id': 'test-user',
                'x-hasura-role': 'user',
                'x-hasura-admin-secret': 'test-secret'
            }, 'Hasura Headers Only');
        }

        async function testHeaders3() {
            await testWithHeaders({}, 'No Auth Headers');
        }

        async function testHeaders4() {
            // Simulate a proper JWT token structure
            const testPayload = {
                "https://hasura.io/jwt/claims": {
                    "x-hasura-allowed-roles": ["user"],
                    "x-hasura-default-role": "user",
                    "x-hasura-user-id": "test-user-123"
                },
                "sub": "test-user-123",
                "iat": Math.floor(Date.now() / 1000),
                "exp": Math.floor(Date.now() / 1000) + 3600
            };

            // This is just a mock JWT for testing - not a real signed token
            const mockJWT = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.' + btoa(JSON.stringify(testPayload)) + '.mock-signature';

            await testWithHeaders({
                'Authorization': `Bearer ${mockJWT}`,
                'x-hasura-user-id': 'test-user-123',
                'x-hasura-role': 'user'
            }, 'JWT Token');
        }
    </script>
</body>
</html>