chitfund/backend/DEBUG_AUTH_ISSUE.md

🐛 Debugging Flutter Web Auth 401 Errors

Problem

User is logged into the Flutter web app as manager, but getting 401 errors when accessing transaction sync pages.

Quick Fixes to Try

Fix 1: Check Token in Browser Console (QUICKEST)

Open browser DevTools console (F12) and run:

// Check if token exists
console.log('Token:', localStorage.getItem('flutter.auth_token'));

// If no token, check alternative storage
console.log('All keys:', Object.keys(localStorage));

If token is missing or null:

• Logout and login again
• Token might have been cleared

---

Fix 2: Force Logout and Re-login

1. Click Logout button
2. Login again with manager credentials
3. Try accessing Auto-Sync page again

This will refresh your authentication token.

---

Fix 3: Check Browser Console for Errors

1. Open DevTools (F12)
2. Go to Console tab
3. Look for errors when clicking Auto-Sync
4. Share any red errors you see

---

Fix 4: Verify Token in Network Tab

1. Open DevTools (F12)
2. Go to Network tab
3. Click "Auto-Sync" button
4. Click on the failed request
5. Check Headers section
6. Look for Authorization: Bearer ...

If Authorization header is missing:

• Token not being sent
• Logout and login again

---

Common Causes

1. Token Expired

• Solution: Logout and login again
• Tokens expire after 24 hours

2. SharedPreferences Issue (Flutter Web)

• Problem: Web storage might not persist
• Solution: Use browser's localStorage directly

3. CORS Issue

• Check: Backend CORS config
• Already configured to allow all origins

4. Token Not Saved After Login

• Check: Did login succeed?
• Solution: Login again and verify

---

Temporary Workaround

Use the standalone API tester:

https://chitfund.deepteklabs.com/test/api-tester.html

This will work independently and confirm if backend is working.

---

Debug Steps

Step 1: Check Token Storage

// In browser console
console.log('Token:', localStorage.getItem('flutter.auth_token'));

Step 2: If Token Exists, Check Format

// Should start with "eyJ"
const token = localStorage.getItem('flutter.auth_token');
if (token) {
  console.log('Token starts with eyJ:', token.startsWith('eyJ'));
  console.log('Token length:', token.length);
}

Step 3: Manual Test

// Test API call with token
const token = localStorage.getItem('flutter.auth_token');
fetch('https://chitfund.deepteklabs.com/api/transaction-sync/review-queue', {
  headers: {
    'Authorization': 'Bearer ' + token,
    'Content-Type': 'application/json'
  }
})
.then(res => res.json())
.then(data => console.log('API Response:', data));

---

Solution: Enhanced ApiService for Web

If issue persists, we need to modify the ApiService to handle web better.