docs: add Clerk setup guide and improve auth error messages
- Create CLERK_SETUP.md with step-by-step instructions - Improve error message to indicate Clerk configuration issue - Remove debug logging from auth middleware - Update error handling to be more helpful The 401 error is caused by missing Clerk Secret Key in server/.env
This commit is contained in:
81
server/CLERK_SETUP.md
Normal file
81
server/CLERK_SETUP.md
Normal file
@@ -0,0 +1,81 @@
|
||||
# Clerk Authentication Setup
|
||||
|
||||
## Issue
|
||||
|
||||
The backend server is returning 401 Unauthorized errors because the Clerk Secret Key is not configured correctly.
|
||||
|
||||
**Error**: `The provided Clerk Secret Key is invalid. Make sure that your Clerk Secret Key is correct.`
|
||||
|
||||
## Solution
|
||||
|
||||
You need to add your real Clerk Secret Key to the backend environment configuration.
|
||||
|
||||
### Steps to Fix
|
||||
|
||||
1. **Get your Clerk Secret Key**:
|
||||
- Go to [Clerk Dashboard](https://dashboard.clerk.com)
|
||||
- Navigate to **API Keys** section
|
||||
- Copy your **Secret Key** (starts with `sk_test_...` for test environment or `sk_live_...` for production)
|
||||
|
||||
2. **Update the backend .env file**:
|
||||
- Open `server/.env`
|
||||
- Replace the placeholder with your real secret key:
|
||||
|
||||
```env
|
||||
# Before (placeholder)
|
||||
CLERK_SECRET_KEY="sk_test_placeholder"
|
||||
|
||||
# After (your real key)
|
||||
CLERK_SECRET_KEY="sk_test_YOUR_ACTUAL_SECRET_KEY_HERE"
|
||||
```
|
||||
|
||||
3. **Restart the backend server**:
|
||||
- The server will automatically restart if you're using `npm run dev`
|
||||
- Or manually restart it
|
||||
|
||||
### Current Configuration
|
||||
|
||||
**Frontend** (`.env.local`):
|
||||
```env
|
||||
VITE_CLERK_PUBLISHABLE_KEY=pk_test_YWJvdmUtZmxvdW5kZXItOTEuY2xlcmsuYWNjb3VudHMuZGV2JA
|
||||
```
|
||||
✅ This is configured correctly
|
||||
|
||||
**Backend** (`server/.env`):
|
||||
```env
|
||||
CLERK_SECRET_KEY="sk_test_placeholder"
|
||||
```
|
||||
❌ This needs to be updated with your real secret key
|
||||
|
||||
### How to Find Your Keys
|
||||
|
||||
1. Visit: https://dashboard.clerk.com/last-active?path=api-keys
|
||||
2. You'll see two keys:
|
||||
- **Publishable Key** (pk_test_...) - Already configured in frontend ✅
|
||||
- **Secret Key** (sk_test_...) - Needs to be added to backend ❌
|
||||
|
||||
### Security Note
|
||||
|
||||
⚠️ **Never commit your secret key to version control!**
|
||||
|
||||
The `.env` file is already in `.gitignore`, but always double-check before committing.
|
||||
|
||||
### Testing After Setup
|
||||
|
||||
Once you've added the correct secret key:
|
||||
|
||||
1. The server will restart automatically
|
||||
2. Try uploading a photo in the report form
|
||||
3. You should see successful uploads instead of 401 errors
|
||||
|
||||
### Verification
|
||||
|
||||
You can verify the setup is working by checking the server logs:
|
||||
|
||||
```
|
||||
Auth middleware - Authorization header: present
|
||||
Auth middleware - Token extracted, length: XXX
|
||||
Auth middleware - Session verified for user: user_XXXXX
|
||||
```
|
||||
|
||||
If you see these logs, authentication is working correctly!
|
||||
0
server/TASK_25_SUMMARY.md
Normal file
0
server/TASK_25_SUMMARY.md
Normal file
@@ -48,7 +48,7 @@ export const requireAuth = async (
|
||||
return res.status(401).json({
|
||||
error: {
|
||||
code: 'UNAUTHORIZED',
|
||||
message: 'Authentication failed',
|
||||
message: 'Authentication failed. Please check that CLERK_SECRET_KEY is configured correctly in server/.env',
|
||||
timestamp: new Date().toISOString(),
|
||||
},
|
||||
});
|
||||
|
||||
@@ -50,7 +50,7 @@ class ReportService {
|
||||
|
||||
if (!response.ok) {
|
||||
if (response.status === 401) {
|
||||
throw new Error('You must be signed in to upload photos. Please sign in and try again.');
|
||||
throw new Error('Authentication failed. Please make sure the backend Clerk Secret Key is configured correctly.');
|
||||
}
|
||||
|
||||
// Try to get error details from response
|
||||
|
||||
Reference in New Issue
Block a user