meti-frontend/AUTH_HEADER_SETUP.md
2025-08-15 23:03:15 +07:00

103 lines
2.3 KiB
Markdown

# Authorization Header Setup
## Current Status
**Backend URL**: Fixed to `http://localhost:4002`
**Authorization Header**: Still needs to be set
## How to Set the Authorization Header
### Option 1: Edit .env file directly
```bash
# Open the .env file
nano .env
# or
code .env
```
Find this line:
```bash
NEXT_PUBLIC_API_AUTH_HEADER=
```
And set it to your actual auth header value:
```bash
# Examples:
NEXT_PUBLIC_API_AUTH_HEADER=Bearer your_jwt_token_here
# or
NEXT_PUBLIC_API_AUTH_HEADER=Basic dXNlcjpwYXNz
# or
NEXT_PUBLIC_API_AUTH_HEADER=ApiKey your_api_key_here
# or
NEXT_PUBLIC_API_AUTH_HEADER=your_custom_header_value
```
### Option 2: Use sed command
```bash
# Replace with your actual auth header
sed -i '' 's/NEXT_PUBLIC_API_AUTH_HEADER=/NEXT_PUBLIC_API_AUTH_HEADER=Bearer your_token_here/g' .env
```
## What Type of Auth Does Your Backend Expect?
### 1. **Bearer Token** (Most Common)
```bash
NEXT_PUBLIC_API_AUTH_HEADER=Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
```
### 2. **Basic Authentication**
```bash
NEXT_PUBLIC_API_AUTH_HEADER=Basic dXNlcjpwYXNz
```
### 3. **API Key**
```bash
NEXT_PUBLIC_API_AUTH_HEADER=ApiKey your_api_key_123
```
### 4. **Custom Header**
```bash
NEXT_PUBLIC_API_AUTH_HEADER=your_custom_value
```
## Test Your Backend First
Before setting the header, test your backend with curl to see what format it expects:
```bash
# Test without auth header
curl --location 'http://localhost:4002/api/v1/auth/login' \
--header 'Content-Type: application/json' \
--data-raw '{
"email": "superadmin@example.com",
"password": "ChangeMe!Super#123"
}'
# Test with different auth header formats
curl --location 'http://localhost:4002/api/v1/auth/login' \
--header 'Content-Type: application/json' \
--header 'Authorization: Bearer test_token' \
--data-raw '{
"email": "superadmin@example.com",
"password": "ChangeMe!Super#123"
}'
```
## After Setting the Header
1. **Save the .env file**
2. **Restart your Next.js app**:
```bash
npm run dev
```
3. **Check the browser console** to see if the auth header is now set
4. **Try logging in** again
## Debug Information
The app now logs:
- ✅ Backend URL being called
- ✅ Whether auth header is set
- ✅ Response status and data
Check your browser console (F12 → Console) to see this information.