Giới thiệu dự án

Sự phát triển vũ bão của công nghệ thông tin đã biến mạng xã hội (Social Network) thành hạ tầng giao tiếp không thể thiếu trong kỷ nguyên số. Theo thống kê từ DataReportal, Việt Nam hiện có hơn 78,44 triệu người sử dụng Internet (chiếm 79,1% dân số), với thời gian trung bình dành cho mạng xã hội đạt 2 giờ 15 phút mỗi ngày. Tuy nhiên, phần lớn thị trường đang bị thống trị bởi các nền tảng ngoại khối, đặt ra nhiều thách thức về quyền riêng tư dữ liệu, quảng cáo xâm lấn và thuật toán phân phối nội dung thiếu minh bạch.

Nhiều giải pháp nội địa hiện nay hoặc chỉ tập trung thuần túy vào ứng dụng nhắn tin OTT (như Zalo), hoặc là diễn đàn thảo luận kỹ thuật đóng khung (như Tinhte.vn), dẫn đến khoảng trống lớn cho một nền tảng mạng xã hội đa năng, hiện đại, tối ưu hóa cho trải nghiệm người dùng Việt Nam.

Đồ án tốt nghiệp "Xây dựng website mạng xã hội Social Network" do sinh viên Trịnh Xuân Phương và Phan Nguyễn Chu Kiệt (Khoa CNTT - Trường Đại học Sư phạm Kỹ thuật TP.HCM) thực hiện dưới sự hướng dẫn của ThS. Mai Tuấn Khôi, được nghiên cứu và phát triển nhằm giải quyết bài toán cốt lõi: Thiết kế một hệ thống mạng xã hội hiệu năng cao, bảo mật, thời gian thực (realtime) với kiến trúc phần mềm chuẩn mực.

+-------------------------------------------------------------------------+
|                        KIẾN TRÚC MẠNG XÃ HỘI TỔNG QUAN                  |
+-------------------------------------------------------------------------+
| [Client Layer]: Next.js 14 (React, Tailwind CSS, Component Modular)    |
| [Gateway & Proxy]: Nginx v1.24 (Reverse Proxy, SSL, Gzip, Load Balancing)|
| [Backend Services]: Node.js v20.x + Express.js v4.19.2 (JWT Auth, REST) |
+-------------------------------------------------------------------------+

Mục tiêu đề tài

  1. Xây dựng kiến trúc Full-stack hiện đại: Ứng dụng mô hình Client-Server phân tán, kết hợp Server-Side Rendering (SSR) từ Next.js và kiến trúc micro-service định hướng qua RESTful API trên nền Node.js/Express.
  2. Hiện thực hóa hạ tầng giao tiếp thời gian thực: Xây dựng hệ thống tin nhắn tức thời và cơ chế phân phối thông báo tự động (push notifications) thông qua giao thức WebSocket (Socket.io).
  3. Đảm bảo bảo mật đa lớp và quyền riêng tư: Triển khai cơ chế xác thực không trạng thái (stateless) với JSON Web Token (JWT), mã hóa mật khẩu đa vòng với Bcrypt, và phân quyền người dùng chặt chẽ (RBAC).
  4. Tối ưu hóa hiệu năng xử lý và khả năng mở rộng: Đạt độ trễ truy vấn dưới 100ms thông qua Redis caching, sẵn sàng chịu tải hàng nghìn kết nối đồng thời trên hạ tầng đám mây Google Cloud Compute Engine VM.

Phạm vi và giới hạn đề tài

  • Phạm vi nghiên cứu: Tập trung vào 5 phân hệ cốt lõi: Quản lý danh tính (Authentication & Profile), Mạng lưới bạn bè (Friend Graph), Bảng tin tương tác (Newsfeed & Media Album), Nhắn tin nhóm/kênh (Realtime Chat Channels) và Cổng điều hành hệ thống (Admin Portal).
  • Giới hạn kỹ thuật: Chưa tích hợp giao thức truyền thông đa phương tiện trực tiếp WebRTC (Voice/Video Call) và hệ sinh thái thanh toán thương mại điện tử trực tuyến.

Phân tích và thiết kế giải pháp

Phân tích hiện trạng và khảo sát thị trường

Để xác định vị trí giải pháp, đề tài đã tiến hành nghiên cứu thực nghiệm và đánh giá các nền tảng mạng xã hội đang vận hành tại thị trường Việt Nam:

Tiêu chí phân tích Zalo (VNG) Zing Me (VNG - Legacy) Tinhte.vn (Forum) Giải pháp Social Network đề xuất
Mô hình kiến trúc Đóng kín (Private Network) Mạng xã hội tích hợp Game Diễn đàn mở (Thread-based) Mạng xã hội tương tác mở đa tầng
Công nghệ Frontend Mobile Native / Electron Web truyền thống (MPA) XenForo Web Framework Next.js 14 SSR/SSG & React Modular
Khả năng tương tác Hạn chế (chỉ trong danh bạ) Bình luận, chia sẻ game Thảo luận chuyên sâu kỹ thuật Đa dạng: Feed, Reacts, Channels, Albums
Xử lý Realtime Giao thức độc quyền OTT Kém, polling định kỳ Long-polling cơ bản Socket.io v4.7 Engine (Full-duplex)
Bảo mật & Phân quyền Xác thực số điện thoại Session-based cơ bản Session/Cookie JWT + Role-based Access Control (RBAC)
Độ phức tạp UI/UX Gọn nhẹ, tập trung chat Rườm rà, nhiều module phụ Cấu trúc chuyên đề phức tạp Tối giản, responsive trên mọi kích thước màn hình

Phân loại yêu cầu hệ thống theo mô hình MoSCoW

  • Must have (Bắt buộc): Đăng ký/đăng nhập (Email, Google OAuth), quản lý trang cá nhân, kết bạn/hủy kết bạn, đăng bài viết kèm hình ảnh, bình luận, thả biểu cảm (Reacts), nhắn tin thời gian thực trong kênh, nhận thông báo đẩy.
  • Should have (Nên có): Tạo và quản lý Album bộ sưu tập ảnh, quản trị viên kiểm duyệt báo cáo vi phạm (Denounces/Reports), theo dõi lịch sử hoạt động (Activity Logs), lọc từ khóa nhạy cảm.
  • Could have (Có thể mở rộng): Livestream trực tiếp, video ngắn (Reels/Stories), sàn thương mại điện tử tích hợp cổng thanh toán.
  • Won't have (Chưa thực hiện ở giai đoạn này): Gọi thoại/video mã hóa phân tán P2P.
+-----------------------------------------------------------------------------------+
|                     SƠ ĐỒ THIẾT KẾ CƠ SỞ DỮ LIỆU (MONGODB SCHEMA)                 |
+-----------------------------------------------------------------------------------+
|  [Users]               [Posts]                 [Comments]         [Messages]      |
|  - _id (ObjectId)      - _id (ObjectId)        - _id (ObjectId)   - _id (ObjectId)|
|  - full_name           - author_id (FK->User)  - post_id (FK)     - channel_id(FK)|
|  - email / password    - content (String)      - author_id (FK)   - sender_id (FK)|
|  - avatar / cover      - media_urls (Array)    - content          - content       |
|  - friends (Array FK)  - privacy (Public/Priv) - reacts (Array)   - is_deleted    |
|  - role (FK->Roles)    - created_at (Date)     - created_at       - created_at    |
+-----------------------------------------------------------------------------------+

Kiến trúc công nghệ chi tiết (Technology Stack)

Toàn bộ hệ thống được xây dựng trên nền tảng các công nghệ cập nhật, đáp ứng tiêu chuẩn công nghiệp:

  • Frontend Engine: Next.js v14.2.3, React v18.3, Tailwind CSS v3.4, Axios v1.6, Lucide Icons.
  • Backend Runtime: Node.js v20.12.0 LTS, Express.js v4.19.2 (Framework RESTful).
  • Database & Caching Layer: MongoDB v7.0.8 Community Edition (Mongoose ODM v8.3.0), Redis Server v7.2.4.
  • Realtime Communication: Socket.io v4.7.5 (Engine.IO v6.5).
  • Identity & Security: JSON Web Token (jsonwebtoken v9.0.2), bcryptjs v2.4.3, cors, helmet.
  • Hạ tầng triển khai (DevOps): Google Cloud Compute Engine (e2-medium instance: 2 vCPU, 4GB RAM), Ubuntu 22.04 LTS, Nginx v1.24.0 (Reverse Proxy & Web Server), PM2 Process Manager v5.3.

Implementation và kết quả

Quy trình phát triển và hiện thực hóa mã nguồn

Hệ thống tuân thủ nghiêm ngặt mô hình kiến trúc MVC hướng module, tách biệt ranh giới giữa tầng điều khiển (Controllers), tầng nghiệp vụ (Services) và tầng truy xuất dữ liệu (Models).

1. Cơ chế xác thực phân quyền qua Middleware (JWT Authentication)

Mỗi truy vấn yêu cầu bảo mật phải đi qua lớp Middleware để giải mã và kiểm tra tính hợp lệ của Access Token:

// middleware/auth.middleware.js
const jwt = require('jsonwebtoken');

const verifyToken = async (req, res, next) => {
  try {
    const authHeader = req.headers['authorization'];
    const token = authHeader && authHeader.split(' ')[1]; // Bearer <token>

    if (!token) {
      return res.status(401).json({ success: false, message: 'Truy cập bị từ chối: Không tìm thấy Access Token!' });
    }

    jwt.verify(token, process.env.JWT_SECRET_KEY, (err, decoded) => {
      if (err) {
        return res.status(403).json({ success: false, message: 'Token không hợp lệ hoặc đã hết hạn!' });
      }
      req.user = decoded; // Gán payload { userId, role } vào request
      next();
    });
  } catch (error) {
    return res.status(500).json({ success: false, message: 'Lỗi máy chủ xác thực nội bộ', error: error.message });
  }
};

module.exports = { verifyToken };

2. Xử lý điều phối sự kiện thời gian thực (Realtime Event Broker)

Khi có hành động phát sinh (nhắn tin, bình luận, chấp nhận kết bạn), Backend kích hoạt kênh phát tán (Event Dispatcher) qua WebSocket:

// sockets/notification.socket.js
module.exports = (io) => {
  io.on('connection', (socket) => {
    // Đăng ký người dùng vào phòng riêng dựa trên UserId
    socket.on('join_user_room', (userId) => {
      socket.join(userId);
    });

    // Xử lý gửi tin nhắn tức thời trong kênh
    socket.on('send_message', async (data) => {
      const { channelId, senderId, receiverId, content } = data;
      // Phát sự kiện tin nhắn mới tới kênh và người nhận
      io.to(channelId).emit('receive_message', {
        channelId,
        senderId,
        content,
        createdAt: new Date().toISOString()
      });
      // Gửi thông báo trực tiếp đến phòng riêng của người nhận
      io.to(receiverId).emit('new_notification', {
        type: 'MESSAGE',
        senderId,
        message: 'Bạn có một tin nhắn mới.'
      });
    });

    socket.on('disconnect', () => {
      // Tự động thu hồi socket connection pool
    });
  });
};

3. Tối ưu hóa tái sử dụng thành phần giao diện (Next.js Reusable Components)

Frontend được module hóa thông qua việc tái sử dụng triệt để các UI Components như UserAvatar, FriendCard:

// components/common/UserAvatar.tsx
import React from 'react';
import Image from 'next/image';

interface UserAvatarProps {
  src?: string;
  alt: string;
  size?: 'sm' | 'md' | 'lg';
  isOnline?: boolean;
}

export const UserAvatar: React.FC<UserAvatarProps> = ({ 
  src = '/default-avatar.png', 
  alt, 
  size = 'md', 
  isOnline = false 
}) => {
  const sizeClasses = {
    sm: 'w-8 h-8',
    md: 'w-10 h-10',
    lg: 'w-14 h-14'
  };

  return (
    <div className="relative inline-block">
      <div className={`relative rounded-full overflow-hidden border border-gray-200 ${sizeClasses[size]}`}>
        <Image src={src} alt={alt} fill className="object-cover" />
      </div>
      {isOnline && (
        <span className="absolute bottom-0 right-0 w-3 h-3 bg-green-500 border-2 border-white rounded-full" />
      )}
    </div>
  );
};

Kết quả kiểm thử và đánh giá hiệu năng (Testing & Benchmarks)

Hệ thống đã trải qua quá trình kiểm thử tự động và kiểm thử tải thực nghiệm bằng công cụ Apache JMeter và k6:

+-------------------------------------------------------------------------+
|                KẾT QUẢ KIỂM THỬ TẢI & ĐÁNH GIÁ CHỈ SỐ KỸ THUẬT          |
+-------------------------------------------------------------------------+
| Chỉ số kiểm thử                   | Giá trị mục tiêu | Kết quả thực tế  |
+-----------------------------------+------------------+------------------+
| API Latency (95th percentile)     | < 100 ms         | 42.6 ms          |
| WebSocket Message Round-trip (RTT)| < 80 ms          | 28.4 ms          |
| Throughput (RESTful API)          | > 800 RPS        | 1,150 RPS        |
| Unit Test Coverage (Jest)         | > 75%            | 82.4%            |
| Tỉ lệ kiểm thử giao diện (E2E)    | 100% kịch bản    | 36/36 UseCases   |
| Tỉ lệ phản hồi lỗi (Error Rate)   | < 0.5%           | 0.08%            |
+-------------------------------------------------------------------------+
  • Kiểm thử chức năng (Functional Testing): Toàn bộ 36 UseCase từ đăng ký, quản lý kênh, đăng bài, xóa bài viết đến xử lý báo cáo vi phạm ở trang Admin đều đạt kết quả Pass 100% trên môi trường Production.
  • Thời gian phản hồi DOM: Next.js 14 với tính năng Server-Side Rendering giúp tối ưu First Contentful Paint (FCP) chỉ còn 0.65 giây, cải thiện 58% tốc độ so với các trang Client-Side Rendering truyền thống.

Đổi mới và đóng góp

  1. Kiến trúc thời gian thực phi chặn (Non-blocking Realtime Broker): Khắc phục triệt để hiện tượng trễ thông báo và tin nhắn thông qua cơ chế phân vùng room Socket.io gắn liền với Redis Adapter, cho phép đồng bộ hóa dữ liệu lập tức mà không gây tắc nghẽn I/O tại Database.
  2. Hệ thống tái sử dụng Component đồng nhất (Atomic Design Pattern): Đóng gói và tái sử dụng hơn 25 thành phần giao diện độc lập (như UserAvatar, CommentBox, MediaGallery), giúp giảm 40% dung lượng mã nguồn viết trùng lặp và tăng tốc độ kết xuất trang web.
  3. Cơ chế kiểm soát an toàn dữ liệu đa tầng: Triển khai cơ chế Soft-delete (xóa mềm dữ liệu tin nhắn/bài viết), mã hóa một chiều mật khẩu với thuật toán Bcrypt salt rounds = 10, kết hợp Middleware tự động lọc XSS và chặn SQL/NoSQL Injection.
  4. Bảng điều khiển quản trị toàn diện (Admin Oversight): Cung cấp giao diện trực quan cho phép theo dõi lịch sử hoạt động, tiếp nhận và xử lý báo cáo người dùng (Denounces) theo thời gian thực với phân quyền đa cấp độ.

Ứng dụng thực tế và triển khai

Kịch bản triển khai thực tế (Real-World Use Cases)

  • Mạng xã hội nội bộ cho trường đại học/doanh nghiệp: Triển khai làm nền tảng kết nối sinh viên Khoa CNTT - HCMUTE, trao đổi tài liệu học thuật, hoạt động câu lạc bộ và thông báo từ nhà trường.
  • Nền tảng cộng đồng chuyên môn (Niche Community): Tùy biến thành mạng xã hội chia sẻ công nghệ, giải pháp lập trình hoặc nhóm sở thích với chi phí vận hành tối ưu.
+-------------------------------------------------------------------------+
|                  SƠ ĐỒ ĐIỀU PHỐI HẠ TẦNG GOOGLE CLOUD VM                 |
+-------------------------------------------------------------------------+
|   Next.js Client                                    Node.js API (Port 8000)
|   (PM2 Instance 1)                                  (PM2 Instance 2)    |
|                                    MongoDB (Port 27017)      Redis (6379)
+-------------------------------------------------------------------------+

Cấu hình triển khai hạ tầng đám mây (Cloud Deployment)

Hệ thống được đóng gói và vận hành chính thức trên máy ảo Google Cloud Compute Engine thông qua tệp cấu hình Nginx Reverse Proxy:

# /etc/nginx/sites-available/social-network.conf
server {
    listen 80;
    server_name social.yourdomain.com;

    # Định tuyến giao diện người dùng Next.js
    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    # Định tuyến cổng dịch vụ RESTful API & WebSocket
    location /api/ {
        proxy_pass http://localhost:8000/api/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    location /socket.io/ {
        proxy_pass http://localhost:8000/socket.io/;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_set_header Host $host;
    }
}
  • Chi phí vận hành: Tối ưu hóa tài nguyên phần cứng giúp toàn bộ hệ sinh thái (Frontend, Backend, Database, Caching) vận hành mượt mà trên 01 máy ảo tiêu chuẩn với chi phí chỉ ~25 - 35 USD/tháng, mang lại tỷ suất ROI vượt trội so với việc thuê mua các giải pháp SaaS đóng gói sẵn.

Hạn chế và hướng phát triển

Hạn chế kỹ thuật hiện tại

  • Hệ thống hiện đang chạy trên mô hình Single-Node VM, chưa tách riêng Database cluster độc lập nên có nguy cơ nghẽn cổ chai khi số lượng người dùng đồng thời vượt quá ngưỡng 15,000 CCU.
  • Chưa có cơ chế phân tích dữ liệu tự động bằng Trí tuệ nhân tạo (AI/Machine Learning) để gợi ý bảng tin dựa trên hành vi cá nhân hóa hoặc phát hiện ảnh nhạy cảm tự động.

Định hướng mở rộng trong tương lai

  • Kiến trúc Microservices & Container hóa: Đóng gói toàn bộ dịch vụ bằng Docker và triển khai điều phối với Kubernetes (K8s) trên hạ tầng Google Kubernetes Engine (GKE).
  • Mở rộng tính năng đa phương tiện: Tích hợp hạ tầng WebRTC phục vụ gọi thoại/video độ trễ thấp và xây dựng giao thức phát trực tiếp (Livestreaming RTMP/HLS).
  • Mô-đun thương mại điện tử: Bổ sung tính năng gian hàng trực tuyến (Shop Integration) và tích hợp cổng thanh toán trực tuyến (VNPAY, MoMo, Stripe).

Đối tượng hưởng lợi

  • Sinh viên CNTT & Kỹ sư phần mềm: Nguồn tài liệu tham khảo thực tế chuẩn mực về cách thức phân tích UseCase, thiết kế sơ đồ tuần tự (Sequence Diagram), xây dựng RESTful API và cấu hình máy chủ Web Nginx trên Linux.
  • Lập trình viên Full-stack: Tiếp cận kiến trúc mẫu về cách kết hợp đồng bộ giữa Next.js 14, Express, Socket.io và MongoDB trong một dự án có quy mô hoàn chỉnh.
  • Doanh nghiệp & Tổ chức: Sở hữu khung kiến trúc sẵn sàng triển khai để xây dựng mạng xã hội nội bộ với chi phí hạ tầng thấp và khả năng kiểm soát dữ liệu 100%.
  • Nhà nghiên cứu: Cung cấp dữ liệu thực nghiệm về đánh giá độ trễ và khả năng chịu tải của kiến trúc hướng sự kiện (Event-driven Architecture) trên môi trường Cloud.

Câu hỏi thường gặp

1. Yêu cầu phần cứng tối thiểu để triển khai và chạy hệ thống là gì?

Máy chủ cần tối thiểu 1 vCPU, 2GB RAM và 20GB dung lượng ổ cứng SSD chạy hệ điều hành Ubuntu 20.04/22.04 LTS. Cần cài đặt sẵn môi trường Node.js (>= v18), MongoDB (>= v6.0), Redis (>= v6.0) và Nginx.

2. Hệ thống xử lý thế nào khi có hàng chục nghìn kết nối realtime cùng lúc?

Hệ thống sử dụng cơ chế Non-blocking I/O của Node.js kết hợp Socket.io Redis Adapter. Khi cần mở rộng tải, ta có thể triển khai cụm nhiều tiến trình Node.js bằng PM2 Cluster Mode và điều phối qua bộ cân bằng tải Nginx.

3. Dữ liệu tin nhắn và mật khẩu người dùng được bảo vệ như thế nào?

Mật khẩu người dùng được băm một chiều bằng thư viện Bcrypt với Salt Rounds = 10, hoàn toàn không thể dịch ngược. Các API gửi nhận tin nhắn được bảo vệ bằng chữ ký số JSON Web Token (JWT) và chạy qua giao thức bảo mật SSL/TLS (HTTPS/WSS).

4. Hệ thống có hỗ trợ đăng nhập qua mạng xã hội khác không?

Có. Hệ thống đã tích hợp giao thức xác thực OAuth 2.0 cho phép người dùng đăng nhập tức thì thông qua tài khoản Google một cách an toàn mà không cần trải qua bước đăng ký thủ công.

5. Chi phí bảo trì và mở rộng hệ thống có tốn kém không?

Nhờ kiến trúc phần mềm mã nguồn mở (Open-source stack) không tốn phí bản quyền và quản lý tài nguyên hiệu quả, chi phí bảo trì định kỳ của hệ thống gần như chỉ bao gồm phí thuê hạ tầng máy chủ đám mây định kỳ hàng tháng.

Kết luận

Đồ án tốt nghiệp "Xây dựng website mạng xã hội Social Network" của nhóm sinh viên Trịnh Xuân Phương và Phan Nguyễn Chu Kiệt đã chứng minh tính khả thi, độ hoàn thiện cao và năng lực giải quyết trọn vẹn các thách thức kỹ thuật của một ứng dụng mạng xã hội hiện đại. Bằng việc kết hợp nhuần nhuyễn giữa Next.js 14, Node.js/Express, Socket.io và MongoDB, đề tài không chỉ đạt được hiệu năng ấn tượng với thời gian phản hồi API trung bình dưới 50ms mà còn cung cấp trải nghiệm tương tác thời gian thực mượt mà, ổn định trên hạ tầng Google Cloud.

Đây là công trình nghiên cứu và ứng dụng thực tiễn có giá trị cao, đóng vai trò nền tảng vững chắc cho các nghiên cứu phát triển tiếp theo trong lĩnh vực kỹ thuật phần mềm và hệ thống phân tán. Bạn đọc và các nhà phát triển quan tâm có thể tham khảo kiến trúc này để triển khai các hệ thống mạng xã hội chuyên biệt hoặc áp dụng các mẫu thiết kế mã nguồn vào dự án thực tế của mình.