Чат на React, Node.js и TailwindCSS: Синхронизация, валидация, шифрование, демо-приложение

let messageSequence = 0;
 
function sendMessage(text) {
  const sequence = ++messageSequence;
  const message = {
    id: Date.now(),
    text,
    sequence,
    timestamp: new Date().toISOString()
  };
  
  socket.emit('message', message);
  
  // Оптимистичное обновление UI
  setMessages(prev => [...prev, { ...message, pending: true }]);
}

function handleMessageAck(response) {
  if (response.status === 'ok') {
    // Убираем флаг pending, добавляем server ID
    setMessages(prev => prev.map(msg => 
      msg.localId === response.localId 
        ? { ...msg, pending: false, id: response.serverId }
        : msg
    ));
  } else {
    // Откатываем оптимистичное обновление
    setMessages(prev => prev.filter(msg => msg.localId !== response.localId));
    showError('Не удалось отправить сообщение');
  }
}

const offlineQueue = [];
 
socket.on('disconnect', () => {
  // Переключаемся в режим оффлайн-очереди
  isOffline = true;
});
 
socket.on('connect', () => {
  isOffline = false;
  
  // Отправляем накопленные сообщения пачкой
  if (offlineQueue.length > 0) {
    socket.emit('bulk-messages', offlineQueue, (response) => {
      // Сервер возвращает сообщения с правильными timestamp'ами
      setMessages(prev => mergeSortedMessages(prev, response.messages));
      offlineQueue.length = 0;
    });
  }
});
 
function sendMessage(text) {
  const message = { text, clientTime: Date.now() };
  
  if (isOffline) {
    offlineQueue.push(message);
    // Показываем в UI как pending
    addPendingMessage(message);
  } else {
    socket.emit('message', message);
  }
}

const sentMessages = new Map(); // messageId -> timestamp
 
function sendMessage(text) {
  const messageId = `${userId}-${Date.now()}-${Math.random()}`;
  
  if (sentMessages.has(messageId)) {
    return; // Уже отправляли
  }
  
  sentMessages.set(messageId, Date.now());
  socket.emit('message', { id: messageId, text });
  
  // Чистим старые записи через минуту
  setTimeout(() => sentMessages.delete(messageId), 60000);
}

const socket = io('http://localhost:3000', {
  reconnection: true,
  reconnectionDelay: 500,        // Первая попытка через полсекунды
  reconnectionDelayMax: 3000,    // Максимум 3 секунды между попытками
  reconnectionAttempts: Infinity // Никогда не сдаваться
});

const [connectionState, setConnectionState] = useState('connecting');
 
useEffect(() => {
  const socket = io('http://localhost:3000');
 
  socket.on('connect', () => {
    setConnectionState('connected');
  });
 
  socket.on('disconnect', (reason) => {
    setConnectionState('disconnected');
    console.log('Разрыв:', reason);
  });
 
  socket.on('reconnecting', (attemptNumber) => {
    setConnectionState('reconnecting');
    console.log(`Попытка ${attemptNumber}`);
  });
 
  socket.on('reconnect_failed', () => {
    setConnectionState('failed');
  });
 
  return () => socket.disconnect();
}, []);

function ConnectionIndicator({ state }) {
  const config = {
    connected: { 
      color: 'bg-green-500', 
      text: 'Подключено',
      icon: '●'
    },
    connecting: { 
      color: 'bg-yellow-500 animate-pulse', 
      text: 'Подключение...',
      icon: '◐'
    },
    reconnecting: { 
      color: 'bg-orange-500 animate-pulse', 
      text: 'Переподключение...',
      icon: '◑'
    },
    disconnected: { 
      color: 'bg-red-500', 
      text: 'Нет связи',
      icon: '○'
    }
  };
 
  const { color, text, icon } = config[state] || config.disconnected;
 
  return (
    <div className="flex items-center gap-2 text-sm">
      <span className={`w-2 h-2 rounded-full ${color}`} />
      <span className="text-gray-600">{text}</span>
    </div>
  );
}

const pendingMessages = useRef([]);
 
function sendMessage(text) {
  const message = {
    id: Date.now(),
    text,
    timestamp: new Date().toISOString()
  };
 
  if (socket.connected) {
    socket.emit('message', message);
  } else {
    pendingMessages.current.push(message);
    // Показываем сообщение как pending в UI
    setMessages(prev => [...prev, { ...message, status: 'pending' }]);
  }
}
 
socket.on('connect', () => {
  // Отправляем накопленные сообщения
  while (pendingMessages.current.length > 0) {
    const msg = pendingMessages.current.shift();
    socket.emit('message', msg);
  }
});

const socket = io('http://localhost:3000', {
  pingInterval: 10000,  // Пинг каждые 10 секунд
  pingTimeout: 5000     // Считать мертвым если нет ответа 5 секунд
});

function ManualReconnect() {
  const [isReconnecting, setIsReconnecting] = useState(false);
 
  function handleReconnect() {
    setIsReconnecting(true);
    socket.disconnect();
    setTimeout(() => {
      socket.connect();
      setIsReconnecting(false);
    }, 500);
  }
 
  return (
    <button 
      onClick={handleReconnect}
      disabled={isReconnecting}
      className="px-4 py-2 bg-blue-500 text-white rounded"
    >
      {isReconnecting ? 'Подключение...' : 'Переподключить'}
    </button>
  );
}

// Клиент
function sendMessage(text) {
  const messageId = `${userId}-${Date.now()}-${Math.random().toString(36)}`;
  
  const message = {
    id: messageId,
    text,
    author: userId,
    clientTimestamp: Date.now()
  };
 
  socket.emit('message', message, (ack) => {
    if (!ack.success) {
      // Можем повторить с тем же ID
      retryMessage(message);
    }
  });
}
 
// Сервер
const processedMessageIds = new Set();
const ID_TTL = 60000; // Храним ID минуту
 
io.on('connection', (socket) => {
  socket.on('message', (data, callback) => {
    if (processedMessageIds.has(data.id)) {
      // Уже обрабатывали, отправляем успешный ack
      callback({ success: true, duplicate: true });
      return;
    }
 
    processedMessageIds.add(data.id);
    
    // Обработка сообщения
    const message = processMessage(data);
    io.emit('message', message);
    
    callback({ success: true, messageId: message.id });
 
    // Удаляем ID через минуту
    setTimeout(() => {
      processedMessageIds.delete(data.id);
    }, ID_TTL);
  });
});

const redis = require('redis');
const client = redis.createClient();
 
socket.on('message', async (data, callback) => {
  const key = `msg:${data.id}`;
  const exists = await client.exists(key);
 
  if (exists) {
    callback({ success: true, duplicate: true });
    return;
  }
 
  await client.setEx(key, 60, 'processed');
  
  // Обработка сообщения
  const message = processMessage(data);
  io.emit('message', message);
  
  callback({ success: true });
});

const [messages, setMessages] = useState([]);
const messageIds = useRef(new Set());
 
socket.on('message', (msg) => {
  if (messageIds.current.has(msg.id)) {
    console.warn('Дубликат получен:', msg.id);
    return;
  }
 
  messageIds.current.add(msg.id);
  setMessages(prev => [...prev, msg]);
});

const recentMessages = new Map(); // author -> [timestamp, text]
 
socket.on('message', (msg) => {
  const key = msg.author;
  const recent = recentMessages.get(key);
 
  if (recent && 
      Math.abs(msg.timestamp - recent.timestamp) < 1000 &&
      msg.text === recent.text) {
    console.warn('Подозрительный дубликат');
    return;
  }
 
  recentMessages.set(key, { 
    timestamp: msg.timestamp, 
    text: msg.text 
  });
  
  addMessage(msg);
});

const pendingMessages = useRef(new Map()); // localId -> message
 
function sendMessage(text) {
  const localId = generateLocalId();
  const message = { localId, text, status: 'sending' };
 
  pendingMessages.current.set(localId, message);
  setMessages(prev => [...prev, message]);
 
  socket.emit('message', { localId, text }, (ack) => {
    if (ack.success) {
      // Заменяем временное сообщение на серверное
      setMessages(prev => prev.map(m =>
        m.localId === localId 
          ? { ...m, id: ack.serverId, status: 'sent' }
          : m
      ));
      pendingMessages.current.delete(localId);
    }
  });
}

// Плохо - клиентское время ненадежно
socket.emit('message', {
  text: 'Привет',
  timestamp: Date.now() // Может быть в прошлом или будущем
});

// Сервер
socket.on('message', (data) => {
  const message = {
    ...data,
    id: generateId(),
    serverTimestamp: Date.now(), // Серверное время
    receivedAt: new Date().toISOString()
  };
  
  io.emit('message', message);
});

// Клиент
let messageSequence = 0;
 
function sendMessage(text) {
  socket.emit('message', {
    text,
    sequence: ++messageSequence,
    clientTimestamp: Date.now()
  });
}

let lamportClock = 0;
 
function sendMessage(text) {
  lamportClock++;
  socket.emit('message', {
    text,
    lamportTime: lamportClock
  });
}
 
socket.on('message', (msg) => {
  lamportClock = Math.max(lamportClock, msg.lamportTime) + 1;
  addMessage(msg);
});

// Сервер
let globalSequence = 0;
 
socket.on('message', (data) => {
  const message = {
    ...data,
    serverTime: Date.now(),
    microTime: process.hrtime.bigint(), // Наносекундная точность
    sequence: ++globalSequence
  };
  
  io.emit('message', message);
});

const offlineQueue = useRef([]);
const [isOnline, setIsOnline] = useState(true);
 
useEffect(() => {
  const handleOnline = () => {
    setIsOnline(true);
    flushOfflineQueue();
  };
  
  const handleOffline = () => {
    setIsOnline(false);
  };
 
  socket.on('connect', handleOnline);
  socket.on('disconnect', handleOffline);
 
  return () => {
    socket.off('connect', handleOnline);
    socket.off('disconnect', handleOffline);
  };
}, []);
 
function sendMessage(text) {
  const message = {
    id: generateLocalId(),
    text,
    author: currentUser,
    clientTimestamp: Date.now(),
    status: isOnline ? 'sending' : 'queued'
  };
 
  if (isOnline && socket.connected) {
    socket.emit('message', message);
  } else {
    offlineQueue.current.push(message);
  }
 
  // Оптимистично показываем в UI
  setMessages(prev => [...prev, message]);
}

async function flushOfflineQueue() {
  while (offlineQueue.current.length > 0) {
    const message = offlineQueue.current[0];
    
    try {
      await new Promise((resolve, reject) => {
        socket.emit('message', message, (ack) => {
          if (ack.success) {
            resolve();
          } else {
            reject(new Error(ack.error));
          }
        });
      });
 
      // Успешно отправили, убираем из очереди
      offlineQueue.current.shift();
      
      // Обновляем статус в UI
      setMessages(prev => prev.map(m =>
        m.id === message.id 
          ? { ...m, status: 'sent' }
          : m
      ));
    } catch (error) {
      console.error('Ошибка отправки:', error);
      // Оставляем в очереди, попробуем позже
      break;
    }
  }
}

const QUEUE_KEY = 'chat_offline_queue';
 
function saveQueue() {
  localStorage.setItem(QUEUE_KEY, JSON.stringify(offlineQueue.current));
}
 
function loadQueue() {
  const saved = localStorage.getItem(QUEUE_KEY);
  if (saved) {
    offlineQueue.current = JSON.parse(saved);
  }
}
 
// При инициализации
useEffect(() => {
  loadQueue();
  if (isOnline && offlineQueue.current.length > 0) {
    flushOfflineQueue();
  }
}, []);
 
// При изменении очереди
useEffect(() => {
  saveQueue();
}, [offlineQueue.current.length]);

const MAX_QUEUE_SIZE = 50;
 
function sendMessage(text) {
  if (offlineQueue.current.length >= MAX_QUEUE_SIZE) {
    showError('Слишком много сообщений в очереди. Подключитесь к интернету.');
    return;
  }
 
  // Обычная логика отправки
}

x
function MessageStatus({ status }) {
  const icons = {
    queued: '',
    sending: '',
    sent: '',
    delivered: '',
    failed: ''
  };
 
  return (
    <span className="text-xs text-gray-500 ml-2">
      {icons[status]}
    </span>
  );
}

async function sendWithRetry(message, maxRetries = 5) {
  let attempts = 0;
 
  while (attempts < maxRetries) {
    try {
      await socket.emit('message', message);
      return { success: true };
    } catch (error) {
      attempts++;
      if (attempts < maxRetries) {
        await new Promise(resolve => 
          setTimeout(resolve, 1000 * attempts)
        );
      }
    }
  }
 
  return { success: false, error: 'Max retries exceeded' };
}

// Сервер
socket.on('message', (data) => {
  const message = {
    ...data,
    serverTimestamp: Date.now(),
    receivedAt: new Date().toISOString()
  };
  
  io.emit('message', message);
});

const message = {
  text: data.text,
  clientTimestamp: data.timestamp,
  serverTimestamp: Date.now(),
  displayTime: data.timestamp // Показываем клиентское время
};

// Клиент
let clockOffset = 0;
 
function syncClock() {
  const clientTime = Date.now();
  
  socket.emit('time-sync', { clientTime }, (serverTime) => {
    const roundTrip = Date.now() - clientTime;
    const estimatedServerTime = serverTime + (roundTrip / 2);
    clockOffset = estimatedServerTime - Date.now();
    
    console.log(`Разница часов: ${clockOffset}ms`);
  });
}
 
// Вызываем при подключении
socket.on('connect', () => {
  syncClock();
});
 
// Используем при отображении времени
function getAdjustedTime() {
  return Date.now() + clockOffset;
}

async function accurateClockSync() {
  const samples = [];
  
  for (let i = 0; i < 5; i++) {
    const clientSend = Date.now();
    
    const serverTime = await new Promise(resolve => {
      socket.emit('time-sync', { clientSend }, resolve);
    });
    
    const clientReceive = Date.now();
    const roundTrip = clientReceive - clientSend;
    const offset = serverTime + (roundTrip / 2) - clientReceive;
    
    samples.push({ offset, roundTrip });
    
    await new Promise(resolve => setTimeout(resolve, 100));
  }
  
  // Отбрасываем выбросы и усредняем
  samples.sort((a, b) => a.roundTrip - b.roundTrip);
  const middle = samples.slice(1, 4);
  clockOffset = middle.reduce((sum, s) => sum + s.offset, 0) / middle.length;
}

setInterval(() => {
  if (socket.connected) {
    syncClock();
  }
}, 5 * 60 * 1000);

// Сервер
const sanitizeHtml = require('sanitize-html');
 
socket.on('message', (data) => {
  const cleanText = sanitizeHtml(data.text, {
    allowedTags: [], // Вообще никаких тегов
    allowedAttributes: {}
  });
 
  if (cleanText !== data.text) {
    socket.emit('error', { message: 'Недопустимое содержимое' });
    return;
  }
 
  // Продолжаем обработку
});

const messageRateLimits = new Map(); // userId -> { count, resetTime }
const MAX_MESSAGES_PER_MINUTE = 30;
 
socket.on('message', (data) => {
  const userId = socket.userId;
  const now = Date.now();
  const limit = messageRateLimits.get(userId) || { count: 0, resetTime: now + 60000 };
 
  if (now > limit.resetTime) {
    limit.count = 0;
    limit.resetTime = now + 60000;
  }
 
  if (limit.count >= MAX_MESSAGES_PER_MINUTE) {
    socket.emit('rate-limit', { 
      message: 'Слишком много сообщений, подождите' 
    });
    return;
  }
 
  limit.count++;
  messageRateLimits.set(userId, limit);
 
  // Обрабатываем сообщение
});

io.use((socket, next) => {
  const token = socket.handshake.auth.token;
  
  try {
    const decoded = jwt.verify(token, JWT_SECRET);
    socket.userId = decoded.userId;
    next();
  } catch (err) {
    next(new Error('Неверный токен'));
  }
});

const io = new Server(server, {
  cors: {
    origin: ['https://yourdomain.com', 'https://app.yourdomain.com'],
    credentials: true
  }
});

socket.on('join-room', async (roomId) => {
  const hasAccess = await checkUserAccess(socket.userId, roomId);
  
  if (!hasAccess) {
    socket.emit('error', { message: 'Доступ запрещён' });
    return;
  }
 
  socket.join(roomId);
});

function validateMessage(text) {
  const errors = [];
  
  if (!text || text.trim().length === 0) {
    errors.push('Сообщение не может быть пустым');
  }
  
  if (text.length > 5000) {
    errors.push('Максимум 5000 символов');
  }
  
  // Проверка на подозрительные паттерны
  if (/<script|javascript:|onerror=/i.test(text)) {
    errors.push('Недопустимое содержимое');
  }
  
  // Проверка на чрезмерное количество ссылок
  const urlCount = (text.match(/https?:\/\//g) || []).length;
  if (urlCount > 5) {
    errors.push('Слишком много ссылок');
  }
  
  return errors;
}
 
function sendMessage(text) {
  const errors = validateMessage(text);
  
  if (errors.length > 0) {
    showErrors(errors);
    return;
  }
  
  socket.emit('message', { text });
}

function validateMessageServer(data) {
  if (typeof data.text !== 'string') {
    return { valid: false, error: 'Неверный тип данных' };
  }
  
  const text = data.text.trim();
  
  if (text.length === 0) {
    return { valid: false, error: 'Пустое сообщение' };
  }
  
  if (text.length > 5000) {
    return { valid: false, error: 'Сообщение слишком длинное' };
  }
  
  // Строгая проверка на HTML и скрипты
  if (/<[^>]*>/g.test(text)) {
    return { valid: false, error: 'HTML запрещён' };
  }
  
  // Проверка на Unicode-трюки
  if (/[\u202E\u200B-\u200D\uFEFF]/g.test(text)) {
    return { valid: false, error: 'Подозрительные символы' };
  }
  
  return { valid: true };
}
 
socket.on('message', (data) => {
  const validation = validateMessageServer(data);
  
  if (!validation.valid) {
    socket.emit('validation-error', { 
      field: 'text',
      error: validation.error 
    });
    return;
  }
  
  // Обработка валидного сообщения
  processMessage(data);
});

// shared/validation.js - общий модуль для клиента и сервера
const messageSchema = {
  text: {
    type: 'string',
    required: true,
    minLength: 1,
    maxLength: 5000,
    sanitize: (value) => value.trim()
  },
  author: {
    type: 'string',
    required: true,
    pattern: /^[a-zA-Z0-9_-]{3,20}$/
  }
};
 
function validate(data, schema) {
  const errors = [];
  
  for (const [field, rules] of Object.entries(schema)) {
    let value = data[field];
    
    if (rules.required && (value === undefined || value === null)) {
      errors.push(`${field} обязателен`);
      continue;
    }
    
    if (value === undefined) continue;
    
    if (rules.sanitize) {
      value = rules.sanitize(value);
    }
    
    if (typeof value !== rules.type) {
      errors.push(`${field} должен быть ${rules.type}`);
      continue;
    }
    
    if (rules.minLength && value.length < rules.minLength) {
      errors.push(`${field} минимум ${rules.minLength} символов`);
    }
    
    if (rules.maxLength && value.length > rules.maxLength) {
      errors.push(`${field} максимум ${rules.maxLength} символов`);
    }
    
    if (rules.pattern && !rules.pattern.test(value)) {
      errors.push(`${field} имеет неверный формат`);
    }
  }
  
  return errors;
}

socket.on('delete-message', async (data) => {
  // Формальная валидация
  if (!data.messageId || typeof data.messageId !== 'string') {
    return socket.emit('error', { message: 'Неверный ID' });
  }
  
  // Контекстная валидация
  const message = await getMessage(data.messageId);
  
  if (!message) {
    return socket.emit('error', { message: 'Сообщение не найдено' });
  }
  
  if (message.author !== socket.userId) {
    return socket.emit('error', { message: 'Можно удалять только свои сообщения' });
  }
  
  // Выполняем удаление
  await deleteMessage(data.messageId);
  io.emit('message-deleted', { id: data.messageId });
});

import DOMPurify from 'dompurify';
 
function SafeMessage({ html }) {
  const clean = DOMPurify.sanitize(html, {
    ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'a'],
    ALLOWED_ATTR: ['href'],
    ALLOW_DATA_ATTR: false
  });
 
  return <div dangerouslySetInnerHTML={{ __html: clean }} />;
}

// На сервере при отдаче HTML
res.setHeader(
  'Content-Security-Policy',
  "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' https:; connect-src 'self' wss://yourdomain.com"
);

function linkify(text) {
  const urlRegex = /(https?:\/\/[^\s]+)/g;
  
  return text.split(urlRegex).map((part, i) => {
    if (part.match(urlRegex)) {
      return (
        <a 
          key={i}
          href={part}
          target="_blank"
          rel="noopener noreferrer"
          className="text-blue-500 underline"
        >
          {part}
        </a>
      );
    }
    return part;
  });
}

function isSafeUrl(url) {
  try {
    const parsed = new URL(url);
    return ['http:', 'https:'].includes(parsed.protocol);
  } catch {
    return false;
  }
}

function removeInvisibleChars(text) {
  return text.replace(/[\u200B-\u200D\uFEFF\u202E]/g, '');
}

const userRateLimits = new Map(); // userId -> { count, windowStart }
const RATE_LIMIT = 20; // Сообщений в минуту
const WINDOW_MS = 60000;
 
socket.on('message', (data) => {
const userId = socket.userId;
const now = Date.now();
const userLimit = userRateLimits.get(userId);
 
if (!userLimit || now - userLimit.windowStart > WINDOW_MS) {
  // Новое окно
  userRateLimits.set(userId, { count: 1, windowStart: now });
} else {
  // Проверяем лимит
  if (userLimit.count >= RATE_LIMIT) {
    socket.emit('rate-limit-exceeded', {
      retryAfter: WINDOW_MS - (now - userLimit.windowStart)
    });
    return;
  }
  userLimit.count++;
}
 
// Обрабатываем сообщение
processMessage(data);
});

class TokenBucket {
constructor(capacity, refillRate) {
  this.capacity = capacity;
  this.tokens = capacity;
  this.refillRate = refillRate; // Токенов в секунду
  this.lastRefill = Date.now();
}
 
tryConsume() {
  this.refill();
  
  if (this.tokens >= 1) {
    this.tokens -= 1;
    return true;
  }
  
  return false;
}
 
refill() {
  const now = Date.now();
  const timePassed = (now - this.lastRefill) / 1000;
  const tokensToAdd = timePassed * this.refillRate;
  
  this.tokens = Math.min(this.capacity, this.tokens + tokensToAdd);
  this.lastRefill = now;
}
 
getRetryAfter() {
  if (this.tokens >= 1) return 0;
  return Math.ceil((1 - this.tokens) / this.refillRate * 1000);
}
}
 
const buckets = new Map(); // userId -> TokenBucket
 
socket.on('message', (data) => {
const userId = socket.userId;
 
if (!buckets.has(userId)) {
  buckets.set(userId, new TokenBucket(10, 0.5)); // 10 токенов, 0.5/сек
}
 
const bucket = buckets.get(userId);
 
if (!bucket.tryConsume()) {
  socket.emit('rate-limit-exceeded', {
    retryAfter: bucket.getRetryAfter()
  });
  return;
}
 
processMessage(data);
});

function getRateLimit(userId) {
const user = getUser(userId);
 
if (user.role === 'admin') return Infinity;
if (user.role === 'moderator') return 50;
if (user.accountAge < 24 * 60 * 60 * 1000) return 10; // Новый аккаунт
return 20; // Обычный пользователь
}

x
function RateLimitIndicator({ remaining, total }) {
const percentage = (remaining / total) * 100;
const color = percentage > 50 ? 'bg-green-500' : 
              percentage > 20 ? 'bg-yellow-500' : 'bg-red-500';
 
return (
  <div className="w-full h-1 bg-gray-200 rounded-full overflow-hidden">
    <div 
      className={`h-full ${color} transition-all duration-300`}
      style={{ width: [INLINE]${percentage}%[/INLINE] }}
    />
  </div>
);
}

const connectionCounts = new Map(); // IP -> count
const MAX_CONNECTIONS_PER_IP = 5;
 
io.use((socket, next) => {
  const ip = socket.handshake.address;
  const count = connectionCounts.get(ip) || 0;
 
  if (count >= MAX_CONNECTIONS_PER_IP) {
    return next(new Error('Слишком много соединений с вашего IP'));
  }
 
  connectionCounts.set(ip, count + 1);
 
  socket.on('disconnect', () => {
    const current = connectionCounts.get(ip);
    if (current <= 1) {
      connectionCounts.delete(ip);
    } else {
      connectionCounts.set(ip, current - 1);
    }
  });
 
  next();
});

class SocketRateLimiter {
  constructor(socket, eventsPerSecond = 10, burst = 20) {
    this.socket = socket;
    this.bucket = new TokenBucket(burst, eventsPerSecond);
    this.violations = 0;
    this.setupListeners();
  }
 
  setupListeners() {
    const originalEmit = this.socket.emit.bind(this.socket);
    const originalOn = this.socket.on.bind(this.socket);
 
    // Перехватываем входящие события
    this.socket.on = (event, handler) => {
      const wrappedHandler = (...args) => {
        if (!this.bucket.tryConsume()) {
          this.violations++;
          
          if (this.violations > 10) {
            this.socket.emit('rate-limit-ban', {
              reason: 'Превышен лимит событий'
            });
            this.socket.disconnect(true);
            return;
          }
 
          this.socket.emit('rate-limit-exceeded', {
            event,
            retryAfter: this.bucket.getRetryAfter()
          });
          return;
        }
 
        handler(...args);
      };
 
      return originalOn(event, wrappedHandler);
    };
  }
}
 
io.on('connection', (socket) => {
  new SocketRateLimiter(socket, 5, 15); // 5 событий/сек, burst 15
  
  socket.on('message', handleMessage);
  socket.on('typing', handleTyping);
});

const messagePatterns = new Map(); // socketId -> {lastText, count, lastTime}
 
socket.on('message', (data) => {
  const pattern = messagePatterns.get(socket.id) || { 
    lastText: '', 
    count: 0, 
    lastTime: 0 
  };
 
  const now = Date.now();
  const timeDiff = now - pattern.lastTime;
 
  // Одинаковый текст слишком часто
  if (data.text === pattern.lastText && timeDiff < 1000) {
    pattern.count++;
    
    if (pattern.count > 5) {
      socket.emit('suspicious-activity', {
        reason: 'Подозрение на автоматизацию'
      });
      socket.disconnect(true);
      return;
    }
  } else {
    pattern.count = 0;
  }
 
  pattern.lastText = data.text;
  pattern.lastTime = now;
  messagePatterns.set(socket.id, pattern);
 
  processMessage(data);
});

const io = new Server(server, {
  connectTimeout: 5000,
  maxHttpBufferSize: 1e6, // 1MB максимум для HTTP long-polling
  pingTimeout: 20000,
  pingInterval: 25000,
  upgradeTimeout: 10000,
  perMessageDeflate: false // Отключаем compression для экономии CPU
});

const geoip = require('geoip-lite');
const BLOCKED_COUNTRIES = ['XX', 'YY']; // ISO коды стран
 
io.use((socket, next) => {
  const ip = socket.handshake.address;
  const geo = geoip.lookup(ip);
 
  if (geo && BLOCKED_COUNTRIES.includes(geo.country)) {
    return next(new Error('Доступ из вашей страны временно ограничен'));
  }
 
  next();
});

const metrics = {
  connectionsPerMinute: 0,
  eventsPerMinute: 0,
  disconnectsPerMinute: 0
};
 
setInterval(() => {
  const threshold = 1000;
  
  if (metrics.connectionsPerMinute > threshold) {
    console.error('ALERT: Подозрение на DDoS');
    // Уведомление админа, включение экстренных мер
  }
 
  // Сброс счётчиков
  Object.keys(metrics).forEach(key => metrics[key] = 0);
}, 60000);
 
io.on('connection', (socket) => {
  metrics.connectionsPerMinute++;
  
  socket.onAny(() => {
    metrics.eventsPerMinute++;
  });
 
  socket.on('disconnect', () => {
    metrics.disconnectsPerMinute++;
  });
});

let systemLoad = 'normal'; // normal, high, critical
 
setInterval(() => {
  const load = getSystemMetrics(); // CPU, memory, event loop lag
  
  if (load.cpu > 90 || load.memory > 85 || load.lag > 100) {
    systemLoad = 'critical';
  } else if (load.cpu > 70 || load.memory > 70 || load.lag > 50) {
    systemLoad = 'high';
  } else {
    systemLoad = 'normal';
  }
}, 5000);
 
socket.on('message', (data) => {
  if (systemLoad === 'critical') {
    socket.emit('system-overload', {
      message: 'Сервер перегружен, отправка временно недоступна'
    });
    return;
  }
 
  if (systemLoad === 'high') {
    // Увеличиваем rate limit, отключаем не-критичные фичи
    if (data.attachments) {
      socket.emit('feature-disabled', {
        feature: 'attachments',
        reason: 'Высокая нагрузка'
      });
      return;
    }
  }
 
  processMessage(data);
});

const io = new Server(server, {
  cors: {
    origin: ['https://yourdomain.com', 'https://app.yourdomain.com'],
    methods: ['GET', 'POST'],
    credentials: true,
    allowedHeaders: ['Authorization', 'X-Custom-Header']
  }
});

cors: {
  origin: (origin, callback) => {
    const allowedOrigins = process.env.ALLOWED_ORIGINS.split(',');
    
    if (!origin || allowedOrigins.includes(origin)) {
      callback(null, true);
    } else {
      callback(new Error('CORS запрещён для этого origin'));
    }
  },
  credentials: true
}

const allowedOrigins = process.env.NODE_ENV === 'production'
  ? ['https://yourdomain.com']
  : ['http://localhost:3000', 'http://localhost:5173', 'http://localhost:8080'];
 
const io = new Server(server, {
  cors: { origin: allowedOrigins, credentials: true }
});

location /socket.io/ {
  proxy_pass http://localhost:3000;
  proxy_http_version 1.1;
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection "upgrade";
  proxy_set_header Origin $http_origin;
  proxy_set_header Host $host;
}

const jwt = require('jsonwebtoken');
const JWT_SECRET = process.env.JWT_SECRET || 'your-secret-key-change-me';
 
app.post('/api/login', async (req, res) => {
  const { username, password } = req.body;
  
  // Проверяем учётные данные
  const user = await validateCredentials(username, password);
  
  if (!user) {
    return res.status(401).json({ error: 'Неверные данные' });
  }
  
  // Создаём токен с данными пользователя
  const token = jwt.sign(
    {
      userId: user.id,
      username: user.username,
      role: user.role
    },
    JWT_SECRET,
    { 
      expiresIn: '24h',
      algorithm: 'HS256'
    }
  );
  
  res.json({ token, user: { id: user.id, username: user.username } });
});

const token = localStorage.getItem('authToken');
 
const socket = io('http://localhost:3000', {
  auth: {
    token: token
  }
});

io.use((socket, next) => {
  const token = socket.handshake.auth.token;
  
  if (!token) {
    return next(new Error('Токен не предоставлен'));
  }
  
  try {
    const decoded = jwt.verify(token, JWT_SECRET);
    
    // Проверяем время истечения (jwt.verify делает это автоматически)
    // Добавляем данные пользователя в объект сокета
    socket.userId = decoded.userId;
    socket.username = decoded.username;
    socket.userRole = decoded.role;
    
    next();
  } catch (err) {
    if (err.name === 'TokenExpiredError') {
      return next(new Error('Токен истёк'));
    }
    if (err.name === 'JsonWebTokenError') {
      return next(new Error('Невалидный токен'));
    }
    return next(new Error('Ошибка аутентификации'));
  }
});

io.on('connection', (socket) => {
  console.log(`Подключился ${socket.username} (ID: ${socket.userId})`);
  
  socket.on('message', (data) => {
    // Используем userId из токена, а не из клиентских данных
    const message = {
      text: data.text,
      author: socket.username,
      authorId: socket.userId,
      timestamp: Date.now()
    };
    
    io.emit('message', message);
  });
});

app.post('/api/refresh', async (req, res) => {
  const { refreshToken } = req.body;
  
  try {
    const decoded = jwt.verify(refreshToken, REFRESH_SECRET);
    const user = await getUser(decoded.userId);
    
    const newToken = jwt.sign(
      { userId: user.id, username: user.username },
      JWT_SECRET,
      { expiresIn: '1h' }
    );
    
    res.json({ token: newToken });
  } catch (err) {
    res.status(401).json({ error: 'Невалидный refresh токен' });
  }
});

socket.on('connect_error', async (err) => {
  if (err.message === 'Токен истёк') {
    const refreshToken = localStorage.getItem('refreshToken');
    
    try {
      const response = await fetch('/api/refresh', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ refreshToken })
      });
      
      const data = await response.json();
      localStorage.setItem('authToken', data.token);
      
      // Переподключаемся с новым токеном
      socket.auth.token = data.token;
      socket.connect();
    } catch (error) {
      // Refresh не сработал, редиректим на логин
      window.location.href = '/login';
    }
  }
});

const JWT_SECRET = process.env.JWT_SECRET;
 
if (!JWT_SECRET || JWT_SECRET === 'your-secret-key-change-me') {
  throw new Error('JWT_SECRET не настроен или использует дефолтное значение');
}

// Генерация пары ключей при регистрации
async function generateKeyPair() {
  const keyPair = await crypto.subtle.generateKey(
    {
      name: 'RSA-OAEP',
      modulusLength: 2048,
      publicExponent: new Uint8Array([1, 0, 1]),
      hash: 'SHA-256'
    },
    true, // extractable
    ['encrypt', 'decrypt']
  );
 
  // Экспортируем публичный ключ для отправки на сервер
  const publicKey = await crypto.subtle.exportKey('spki', keyPair.publicKey);
  const publicKeyBase64 = btoa(String.fromCharCode(...new Uint8Array(publicKey)));
 
  // Приватный ключ храним локально в IndexedDB
  await savePrivateKey(keyPair.privateKey);
 
  return { publicKey: publicKeyBase64, privateKey: keyPair.privateKey };
}

async function encryptMessage(text, recipientPublicKey) {
  // Генерируем случайный AES ключ
  const aesKey = await crypto.subtle.generateKey(
    { name: 'AES-GCM', length: 256 },
    true,
    ['encrypt', 'decrypt']
  );
 
  // Шифруем текст AES
  const encoder = new TextEncoder();
  const data = encoder.encode(text);
  const iv = crypto.getRandomValues(new Uint8Array(12));
 
  const encryptedData = await crypto.subtle.encrypt(
    { name: 'AES-GCM', iv },
    aesKey,
    data
  );
 
  // Экспортируем AES ключ для шифрования RSA
  const rawKey = await crypto.subtle.exportKey('raw', aesKey);
 
  // Импортируем публичный RSA ключ получателя
  const publicKey = await crypto.subtle.importKey(
    'spki',
    Uint8Array.from(atob(recipientPublicKey), c => c.charCodeAt(0)),
    { name: 'RSA-OAEP', hash: 'SHA-256' },
    false,
    ['encrypt']
  );
 
  // Шифруем AES ключ публичным RSA ключом
  const encryptedKey = await crypto.subtle.encrypt(
    { name: 'RSA-OAEP' },
    publicKey,
    rawKey
  );
 
  // Возвращаем всё необходимое для расшифровки
  return {
    encryptedData: btoa(String.fromCharCode(...new Uint8Array(encryptedData))),
    encryptedKey: btoa(String.fromCharCode(...new Uint8Array(encryptedKey))),
    iv: btoa(String.fromCharCode(...iv))
  };
}

async function decryptMessage(encrypted, privateKey) {
  // Декодируем base64
  const encryptedData = Uint8Array.from(atob(encrypted.encryptedData), c => c.charCodeAt(0));
  const encryptedKey = Uint8Array.from(atob(encrypted.encryptedKey), c => c.charCodeAt(0));
  const iv = Uint8Array.from(atob(encrypted.iv), c => c.charCodeAt(0));
 
  // Расшифровываем AES ключ приватным RSA ключом
  const rawKey = await crypto.subtle.decrypt(
    { name: 'RSA-OAEP' },
    privateKey,
    encryptedKey
  );
 
  // Импортируем AES ключ
  const aesKey = await crypto.subtle.importKey(
    'raw',
    rawKey,
    { name: 'AES-GCM', length: 256 },
    false,
    ['decrypt']
  );
 
  // Расшифровываем данные
  const decryptedData = await crypto.subtle.decrypt(
    { name: 'AES-GCM', iv },
    aesKey,
    encryptedData
  );
 
  const decoder = new TextDecoder();
  return decoder.decode(decryptedData);
}

async function encryptForGroup(text, participants) {
  const aesKey = await crypto.subtle.generateKey(
    { name: 'AES-GCM', length: 256 },
    true,
    ['encrypt']
  );
 
  const iv = crypto.getRandomValues(new Uint8Array(12));
  const encoder = new TextEncoder();
  const data = encoder.encode(text);
 
  const encryptedData = await crypto.subtle.encrypt(
    { name: 'AES-GCM', iv },
    aesKey,
    data
  );
 
  const rawKey = await crypto.subtle.exportKey('raw', aesKey);
 
  // Шифруем ключ для каждого участника
  const encryptedKeys = await Promise.all(
    participants.map(async (participant) => {
      const publicKey = await importPublicKey(participant.publicKey);
      const encryptedKey = await crypto.subtle.encrypt(
        { name: 'RSA-OAEP' },
        publicKey,
        rawKey
      );
 
      return {
        userId: participant.id,
        encryptedKey: btoa(String.fromCharCode(...new Uint8Array(encryptedKey)))
      };
    })
  );
 
  return {
    encryptedData: btoa(String.fromCharCode(...new Uint8Array(encryptedData))),
    iv: btoa(String.fromCharCode(...iv)),
    keys: encryptedKeys
  };
}

mkdir -p messenger-lite/server
cd messenger-lite/server
npm init -y
npm install express socket.io jsonwebtoken cors

const express = require('express');
const http = require('http');
const { Server } = require('socket.io');
const jwt = require('jsonwebtoken');
const cors = require('cors');
 
const app = express();
const server = http.createServer(app);
 
app.use(cors());
app.use(express.json());
 
const JWT_SECRET = process.env.JWT_SECRET || 'dev-secret-change-in-prod';
 
// In-memory хранилище
const users = new Map();
const messages = [];
const rooms = new Map();
const messageRateLimits = new Map();
 
// Простая "база" пользователей для демо
const demoUsers = [
  { id: 'user1', username: 'alice', password: 'demo123' },
  { id: 'user2', username: 'bob', password: 'demo123' },
  { id: 'user3', username: 'charlie', password: 'demo123' }
];
 
// REST API для авторизации
app.post('/api/login', (req, res) => {
  const { username, password } = req.body;
  const user = demoUsers.find(u => u.username === username && u.password === password);
  
  if (!user) {
    return res.status(401).json({ error: 'Неверные данные' });
  }
 
  const token = jwt.sign(
    { userId: user.id, username: user.username },
    JWT_SECRET,
    { expiresIn: '24h' }
  );
 
  res.json({ 
    token, 
    user: { id: user.id, username: user.username } 
  });
});
 
app.get('/api/messages', (req, res) => {
  const limit = parseInt(req.query.limit) || 100;
  res.json(messages.slice(-limit));
});
 
app.get('/health', (req, res) => {
  res.json({ 
    status: 'ok',
    connections: io.engine.clientsCount,
    messages: messages.length
  });
});
 
// Socket.io сервер
const io = new Server(server, {
  cors: {
    origin: process.env.CLIENT_URL || 'http://localhost:5173',
    credentials: true
  }
});
 
// Middleware авторизации
io.use((socket, next) => {
  const token = socket.handshake.auth.token;
  
  if (!token) {
    return next(new Error('Токен не предоставлен'));
  }
 
  try {
    const decoded = jwt.verify(token, JWT_SECRET);
    socket.userId = decoded.userId;
    socket.username = decoded.username;
    next();
  } catch (err) {
    next(new Error('Невалидный токен'));
  }
});
 
// Rate limiting
function checkRateLimit(userId) {
  const now = Date.now();
  const limit = messageRateLimits.get(userId) || { count: 0, resetTime: now + 60000 };
 
  if (now > limit.resetTime) {
    limit.count = 0;
    limit.resetTime = now + 60000;
  }
 
  if (limit.count >= 30) {
    return false;
  }
 
  limit.count++;
  messageRateLimits.set(userId, limit);
  return true;
}
 
io.on('connection', (socket) => {
  console.log(`${socket.username} подключился`);
  users.set(socket.userId, { username: socket.username, socketId: socket.id });
 
  // Отправка истории новому клиенту
  socket.emit('history', messages.slice(-50));
 
  // Список онлайн пользователей
  socket.emit('users-online', Array.from(users.values()).map(u => u.username));
  socket.broadcast.emit('user-joined', { username: socket.username });
 
  // Обработка сообщений
  socket.on('message', (data) => {
    if (!checkRateLimit(socket.userId)) {
      return socket.emit('rate-limit-exceeded', { 
        message: 'Слишком много сообщений' 
      });
    }
 
    const message = {
      id: Date.now() + Math.random(),
      text: data.text.trim().substring(0, 5000),
      author: socket.username,
      authorId: socket.userId,
      room: data.room || 'general',
      timestamp: new Date().toISOString()
    };
 
    messages.push(message);
    
    // Ограничение размера истории
    if (messages.length > 1000) {
      messages.shift();
    }
 
    // Отправка в комнату или всем
    if (data.room) {
      io.to(data.room).emit('message', message);
    } else {
      io.emit('message', message);
    }
 
    // Подтверждение отправителю
    socket.emit('message-ack', { id: message.id });
  });
 
  // Присоединение к комнате
  socket.on('join-room', (roomId) => {
    socket.join(roomId);
    
    if (!rooms.has(roomId)) {
      rooms.set(roomId, new Set());
    }
    rooms.get(roomId).add(socket.userId);
 
    socket.emit('room-joined', { roomId });
    socket.to(roomId).emit('user-joined-room', { 
      username: socket.username, 
      roomId 
    });
  });
 
  // Выход из комнаты
  socket.on('leave-room', (roomId) => {
    socket.leave(roomId);
    
    if (rooms.has(roomId)) {
      rooms.get(roomId).delete(socket.userId);
      if (rooms.get(roomId).size === 0) {
        rooms.delete(roomId);
      }
    }
 
    socket.to(roomId).emit('user-left-room', { 
      username: socket.username, 
      roomId 
    });
  });
 
  // Индикатор печатания
  socket.on('typing', (data) => {
    socket.broadcast.emit('typing', { 
      username: socket.username,
      room: data.room 
    });
  });
 
  socket.on('disconnect', () => {
    console.log(`${socket.username} отключился`);
    users.delete(socket.userId);
    
    socket.broadcast.emit('user-left', { username: socket.username });
    socket.broadcast.emit('users-online', Array.from(users.values()).map(u => u.username));
  });
});
 
const PORT = process.env.PORT || 3000;
server.listen(PORT, () => {
  console.log(`Сервер запущен на порту ${PORT}`);
  console.log('Демо пользователи: alice/demo123, bob/demo123, charlie/demo123');
});

npm create vite@latest client -- --template react
cd client
npm install
npm install socket.io-client
npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

export default {
  content: ["./index.html", "./src/**/*.{js,jsx}"],
  darkMode: 'class',
  theme: {
    extend: {
      colors: {
        'message-own': '#E3F2FD',
        'message-other': '#FFFFFF',
      }
    }
  },
  plugins: []
}

import { useEffect, useState, useRef } from 'react';
import { io } from 'socket.io-client';
 
export function useSocket(url, token) {
  const [isConnected, setIsConnected] = useState(false);
  const [error, setError] = useState(null);
  const socketRef = useRef(null);
 
  useEffect(() => {
    if (!token) return;
 
    const socket = io(url, {
      auth: { token },
      reconnectionDelay: 500,
      reconnectionDelayMax: 3000
    });
 
    socket.on('connect', () => {
      setIsConnected(true);
      setError(null);
    });
 
    socket.on('disconnect', () => {
      setIsConnected(false);
    });
 
    socket.on('connect_error', (err) => {
      setError(err.message);
      setIsConnected(false);
    });
 
    socketRef.current = socket;
 
    return () => {
      socket.disconnect();
    };
  }, [url, token]);
 
  return { socket: socketRef.current, isConnected, error };
}