fix: error in keyword

Author: arifulhoque7

KEYWORD_API_AUTH_FIX.md

@@ -0,0 +1,154 @@
+# Keyword API Tester - Authentication Fix
+
+## Issue
+The Keyword API Tester was returning **401 Unauthorized** errors when trying to make API calls.
+
+## Root Cause
+The keyword API endpoints were configured in `routes/api.php` inside the `auth:sanctum` middleware group. Sanctum authentication requires Bearer tokens, which are meant for external API access (like WordPress plugin integration), not for web interface usage.
+
+## Solution
+
+### 1. Created Web API Routes
+Added dedicated web routes in `routes/web.php` for the keyword API that use Laravel's standard web session authentication:
+
+```php
+// Keyword API endpoints for web interface
+Route::prefix('web-api/keywords')->name('web-api.keywords.')->group(function () {
+    Route::post('suggestions', [\App\Http\Controllers\Api\KeywordController::class, 'getSuggestions'])->name('suggestions');
+    Route::post('related', [\App\Http\Controllers\Api\KeywordController::class, 'getRelatedKeywords'])->name('related');
+    Route::post('analyze', [\App\Http\Controllers\Api\KeywordController::class, 'analyzeKeyword'])->name('analyze');
+    Route::post('batch-analyze', [\App\Http\Controllers\Api\KeywordController::class, 'batchAnalyze'])->name('batch-analyze');
+    Route::post('clear-cache', [\App\Http\Controllers\Api\KeywordController::class, 'clearCache'])->name('clear-cache');
+});
+```
+
+These routes are inside the `auth:web` middleware group (inherited from the parent group), so they:
+- ✅ Work with Laravel session authentication
+- ✅ Include CSRF protection
+- ✅ Are accessible from the web interface
+- ✅ Use the same controller methods as the API routes
+
+### 2. Updated Frontend to Use Web Routes
+Updated all API calls in `resources/js/pages/keyword-tester.tsx` to use the new web API endpoints:
+
+**Before:**
+```typescript
+axios.post('/api/keywords/suggestions', { ... })
+axios.post('/api/keywords/related', { ... })
+axios.post('/api/keywords/analyze', { ... })
+axios.post('/api/keywords/batch-analyze', { ... })
+```
+
+**After:**
+```typescript
+axios.post('/web-api/keywords/suggestions', { ... })
+axios.post('/web-api/keywords/related', { ... })
+axios.post('/web-api/keywords/analyze', { ... })
+axios.post('/web-api/keywords/batch-analyze', { ... })
+```
+
+### 3. Added CSRF Token Configuration
+Added automatic CSRF token configuration in the keyword-tester component:
+
+```typescript
+// Get CSRF token from meta tag
+useEffect(() => {
+    const token = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');
+    if (token) {
+        axios.defaults.headers.common['X-CSRF-TOKEN'] = token;
+    }
+}, []);
+```
+
+## API Architecture
+
+Now we have two sets of keyword API endpoints:
+
+### 1. Web API Endpoints (Session Auth)
+**Base URL:** `/web-api/keywords/`  
+**Authentication:** Laravel session (web middleware)  
+**Used by:** Dashboard/Web Interface  
+**CSRF:** Required  
+
+Endpoints:
+- `POST /web-api/keywords/suggestions`
+- `POST /web-api/keywords/related`
+- `POST /web-api/keywords/analyze`
+- `POST /web-api/keywords/batch-analyze`
+- `POST /web-api/keywords/clear-cache`
+
+### 2. API Endpoints (Sanctum Auth)
+**Base URL:** `/api/keywords/`  
+**Authentication:** Bearer token (Sanctum)  
+**Used by:** External clients, WordPress plugin  
+**CSRF:** Not required  
+
+Endpoints:
+- `POST /api/keywords/suggestions`
+- `POST /api/keywords/related`
+- `POST /api/keywords/analyze`
+- `POST /api/keywords/batch-analyze`
+- `POST /api/keywords/clear-cache`
+
+### 3. WordPress Plugin Endpoints (API Key Auth)
+**Base URL:** `/api/ai/keywords/`  
+**Authentication:** API Key in X-API-KEY header  
+**Used by:** WordPress plugin  
+**CSRF:** Not required  
+
+Endpoints:
+- `POST /api/ai/keywords/suggestions`
+- `POST /api/ai/keywords/related`
+- `POST /api/ai/keywords/analyze`
+- `POST /api/ai/keywords/batch-analyze`
+
+## How It Works Now
+
+1. User logs into the dashboard (Laravel session created)
+2. User navigates to **Keyword Tester** page
+3. Page loads with CSRF token from meta tag
+4. User enters a keyword and clicks "Get Suggestions"
+5. Frontend makes POST request to `/web-api/keywords/suggestions`
+6. Laravel validates:
+   - ✅ User is authenticated (session)
+   - ✅ CSRF token is valid
+7. Controller processes the request
+8. Results are returned and displayed
+
+## Testing
+
+To test the fix:
+
+1. **Login to the dashboard**
+   ```
+   Visit: https://wegenius.test/login
+   ```
+
+2. **Navigate to Keyword Tester**
+   ```
+   Click "Keyword Tester" in the sidebar
+   OR visit: https://wegenius.test/keyword-tester
+   ```
+
+3. **Test the API**
+   - Enter a keyword (e.g., "android")
+   - Click "Get Suggestions"
+   - You should see results without any authentication errors
+
+## Files Modified
+
+1. **routes/web.php**
+   - Added web API routes for keyword endpoints
+
+2. **resources/js/pages/keyword-tester.tsx**
+   - Updated all API calls to use `/web-api/keywords/` instead of `/api/keywords/`
+   - Added CSRF token configuration with useEffect
+
+## Status
+
+✅ **FIXED** - The authentication issue is resolved. The Keyword API Tester now works correctly from the web interface!
+
+---
+
+**Date:** October 11, 2025  
+**Status:** Production Ready