Hamdast1/AUTHENTICATION.md

سیستم احراز هویت پلتفرم همدست

نحوه کارکرد

1. ورود به سیستم

کاربران از طریق شماره موبایل و کد تایید ۵ رقمی وارد سیستم می‌شوند.

مراحل:

1. ورود شماره موبایل در صفحه /login
2. ارسال درخواست به API: /api/SignUpLoginBySMS
3. دریافت کد تایید ۵ رقمی از طریق پیامک
4. وارد کردن کد تایید
5. ارسال درخواست تایید به API: /api/verifyloginbysms
6. دریافت اطلاعات کاربر و توکن‌ها
7. ذخیره اطلاعات در localStorage
8. هدایت به صفحه اصلی

2. اطلاعات ذخیره شده در localStorage

پس از ورود موفق، اطلاعات زیر ذخیره می‌شود:

{
  "accessToken": "ACCESS_TOKEN",           // توکن دسترسی
  "refreshToken": "REFRESH_TOKEN",         // توکن تازه‌سازی
  "userId": "1025",                        // شناسه کاربر
  "username": "1025",                      // یوزرنیم (همان ID کاربر)
  "userInfo": "{...}"                      // اطلاعات کامل کاربر (JSON string)
}

3. محافظت از صفحات (Protected Routes)

تمام صفحات پلتفرم (به جز صفحه لاگین) با ProtectedRoute محافظت شده‌اند.

نحوه کار:

• قبل از نمایش هر صفحه، توکن کاربر بررسی می‌شود
• اگر توکن معتبر نباشد، کاربر به صفحه لاگین هدایت می‌شود
• پیام خطا نمایش داده می‌شود

4. خروج از سیستم

کاربر می‌تواند از صفحه پروفایل خارج شود.

مراحل:

1. کلیک روی دکمه "خروج از حساب کاربری"
2. پاک کردن تمام اطلاعات از localStorage
3. هدایت به صفحه لاگین
4. نمایش پیام تایید خروج

فایل‌های مرتبط

/src/utils/auth.ts

توابع کمکی احراز هویت:

• isTokenValid() - بررسی معتبر بودن توکن
• getUserInfo() - دریافت اطلاعات کاربر
• getAccessToken() - دریافت توکن دسترسی
• getUsername() - دریافت یوزرنیم
• logout() - خروج از سیستم
• requireAuth() - بررسی احراز هویت

/src/app/components/ProtectedRoute.tsx

کامپوننت محافظت از مسیرها:

• بررسی توکن قبل از نمایش صفحه
• نمایش Loading در حین بررسی
• Redirect به لاگین در صورت عدم احراز هویت

/src/app/components/LoginPage.tsx

صفحه ورود:

• ورود با شماره موبایل
• دریافت و تایید کد ۵ رقمی
• ذخیره اطلاعات کاربر
• Redirect به صفحه اصلی پس از ورود موفق

/src/app/routes.ts

تعریف مسیرها:

• مسیر /login آزاد
• سایر مسیرها محافظت شده با ProtectedRoute

/src/config/api.ts

تنظیمات API:

• آدرس پایه API
• قابل تغییر برای محیط‌های مختلف

نحوه استفاده

بررسی وضعیت لاگین در کامپوننت‌ها:

import { isTokenValid, getUserInfo } from "../../utils/auth";

function MyComponent() {
  const isLoggedIn = isTokenValid();
  const userInfo = getUserInfo();
  
  if (isLoggedIn && userInfo) {
    console.log(`کاربر: ${userInfo.Name} ${userInfo.Family}`);
  }
}

خروج از سیستم:

import { logout } from "../../utils/auth";
import { useNavigate } from "react-router";

function LogoutButton() {
  const navigate = useNavigate();
  
  const handleLogout = () => {
    logout();
    navigate("/login");
  };
  
  return <button onClick={handleLogout}>خروج</button>;
}

نکات امنیتی

⚠️ توجه: در حال حاضر سیستم احراز هویت فقط بررسی وجود توکن را انجام می‌دهد.

برای محیط Production باید:

1. اعتبار سنجی تاریخ انقضای توکن اضافه شود
2. سیستم Refresh Token پیاده‌سازی شود
3. توکن‌ها در هر درخواست API ارسال شوند
4. بررسی سمت سرور انجام شود

تنظیمات API

برای تغییر آدرس API، فایل /src/config/api.ts را ویرایش کنید:

export const API_BASE_URL = "https://your-domain.com";