Giới thiệu dự án

Sự bùng nổ của kỷ nguyên số và xu hướng chuyển đổi số toàn cầu đã biến mạng xã hội thành hạ tầng giao tiếp thiết yếu. Theo thống kê từ Statista và We Are Social (2024), có hơn 5.04 tỷ người (tương đương 62.3% dân số thế giới) sử dụng mạng xã hội với thời gian trung bình 2 giờ 23 phút mỗi ngày. Tại Việt Nam, tỷ lệ này đạt gần 73.3 triệu người. Tuy nhiên, sự thống trị của các nền tảng ngoại như Facebook, Zalo, hay TikTok đang đặt ra nhiều thách thức lớn về bảo mật dữ liệu người dùng, sự phụ thuộc hạ tầng quốc tế, nguy cơ quá tải thông tin rác và sự xâm nhập của nội dung độc hại.

Đề tài "Xây dựng website mạng xã hội sử dụng công nghệ VueJs và Spring Boot" do sinh viên Từ Thanh Thoại (MSSV: 20110306) và Võ Giang Nam (MSSV: 20110680), dưới sự hướng dẫn của ThS. Nguyễn Trần Thi Văn tại Khoa Công nghệ Thông tin – Trường Đại học Sư phạm Kỹ thuật TP. Hồ Chí Minh (HCMUTE), được triển khai nhằm giải quyết trực tiếp các bài toán kỹ thuật nền tảng trong việc phát triển một hệ thống mạng xã hội độc lập, bảo mật và tương tác thời gian thực cao.

+--------------------------------------------------------------------------------+
|                        MỤC TIÊU VÀ PHẠM VI DỰ ÁN SOCIAL NETWORK                 |
+--------------------------------------------------------------------------------+
|  1. Kiến trúc phân tách Front-End (Vue.js) & Back-End (Spring Boot RESTful API)|
|  2. Tích hợp Real-time Messaging đa kênh với WebSocket (STOMP Protocol)        |
|  3. Thiết lập Video Call ngang hàng độ trễ cực thấp với giao thức WebRTC      |
|  4. Quản lý quan hệ xã hội phức tạp & Bảng tin đa phương tiện tối ưu hóa        |
+--------------------------------------------------------------------------------+

Mục tiêu dự án

  1. Nghiên cứu và làm chủ công nghệ: Khai thác sức mạnh của hệ sinh thái Java Enterprise hiện đại (Spring Boot, Spring Security, Spring Data JPA) kết hợp cùng framework giao diện phản ứng nhanh (Vue.js).
  2. Xây dựng hệ thống giao tiếp thời gian thực: Thiết kế và triển khai luồng nhắn tin văn bản, tin nhắn nhóm và thông báo đẩy tức thời thông qua WebSocket/STOMP.
  3. Hiện thực hóa truyền thông đa phương tiện P2P: Tích hợp tính năng gọi thoại và video call độ phân giải cao, độ trễ dưới 200ms qua WebRTC API.
  4. Chuẩn hóa API và quản lý dữ liệu: Xây dựng kiến trúc RESTful API hoàn chỉnh, mô hình hóa cơ sở dữ liệu quan hệ MySQL chuẩn hóa 3NF, xử lý nghiệp vụ xác thực đa lớp (JWT, OTP).
  5. Triển khai môi trường Cloud thực tế: Tự động hóa CI/CD và triển khai phân tán trên Vercel (Front-End), Railway (Back-End) và Azure SQL Database.

Phạm vi và giới hạn hệ thống

  • Phạm vi chức năng: Bao gồm 6 phân hệ cốt lõi: Quản lý tài khoản (Đăng ký OTP, Đăng nhập, Profile), Quản lý quan hệ bạn bè (Tìm kiếm theo SĐT, Kết bạn, Chặn), Bảng tin & Đa phương tiện (Đăng bài, Bình luận, Tương tác cảm xúc, Gắn thẻ), Nhắn tin tức thời (Chat 1-1, Chat nhóm), Video Call P2P và Bảng điều khiển Quản trị viên (Admin Dashboard).
  • Giới hạn: Hệ thống tập trung tối ưu hóa trên nền tảng Web Application; chưa xây dựng Native Mobile App; tính năng Video Call hiện hỗ trợ tối ưu trên mô hình Peer-to-Peer 1-1 (chưa tích hợp MCU/SFU cho nhóm lớn).

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

Phân tích hiện trạng

Khảo sát thực tế hai nền tảng hàng đầu tại thị trường Việt Nam cho thấy:

  • Facebook: Hệ sinh thái khổng lồ, xử lý hàng tỷ tương tác nhưng giao diện phức tạp, mật độ quảng cáo dày đặc và thuật toán phân phối nội dung gây lo ngại về quyền riêng tư.
  • Zalo: Tối ưu hóa cực tốt cho liên lạc cá nhân theo số điện thoại, tuy nhiên phiên bản Web bị giới hạn nghiêm trọng về tính năng News Feed và khả năng đồng bộ dữ liệu lịch sử.
Tiêu chí so sánh Facebook Zalo Hệ thống đề tài (VueJs + Spring Boot)
Nền tảng hỗ trợ Web, Mobile, Desktop Mobile tối ưu, Web hạn chế Web Responsive đa thiết bị
Công nghệ Web Client ReactJS React / Internal UI Vue.js 3 (MVVM, Composition API)
Xử lý Real-time MQTT, Custom WebSocket WebSocket / Proprietary WebSocket (STOMP) + WebRTC
Tìm kiếm & Kết bạn Đa dạng (Tên, Email, Gợi ý) Chủ yếu qua Số điện thoại Số điện thoại & Định danh cá nhân
Kiểm soát quảng cáo Rất nhiều quảng cáo hướng đối tượng Quảng cáo Official Account Không quảng cáo, trải nghiệm thuần túy
Bảo mật dữ liệu Thu thập dữ liệu hành vi Mã hóa E2EE trên app di động Xác thực JWT, Mã hóa mật khẩu BCrypt, SSL/TLS

Phân tích yêu cầu theo mô hình MoSCoW

  • Must have (Bắt buộc có): Đăng ký xác thực OTP, Đăng nhập/Đăng xuất JWT, Đăng bài viết (Text/Image/Video), Like/Comment, Gửi/Nhận tin nhắn real-time, Tìm bạn bè qua SĐT.
  • Should have (Nên có): Gọi Video Call P2P qua WebRTC, Chat nhóm, Gắn thẻ bạn bè (Tagging), Chặn người dùng (Block list), Admin dashboard thống kê hệ thống.
  • Could have (Có thể có): Chia sẻ bài viết (Share post), Phản hồi tin nhắn (Message reply), Tùy chỉnh thông báo âm thanh.
  • Won't have (Chưa thực hiện ở giai đoạn này): Livestreaming đa điểm, Thanh toán trực tuyến tích hợp ví điện tử.

Thiết kế hệ thống

Hệ thống được xây dựng theo mô hình kiến trúc phân tầng (Multi-tier Architecture) phân tách độc lập giữa Client và Server nhằm đảm bảo tính Module hóa và khả năng mở rộng.

graph TD
    Client["Client Browser (Vue.js 3 SPA)"]
    Gateway["Reverse Proxy / Cloudflare (SSL/TLS)"]
    
    subgraph Spring_Boot_Backend["Spring Boot 3.x Backend Server"]
        Security["Spring Security (JWT Filter)"]
        Controllers["REST Controllers (API Endpoints)"]
        WSHandler["WebSocket Message Broker (STOMP)"]
        Services["Business Service Layer"]
        Repositories["Spring Data JPA Repositories"]
    end
    
    subgraph Data_Storage["Data & Signaling Tier"]
        MySQL[("Azure MySQL 8.0")]
        STUN["Google STUN Server (WebRTC ICE)"]
    end

    Client -->|HTTP/HTTPS REST Requests| Gateway
    Client <-->|WSS Bi-directional Protocol| WSHandler
    Client <-->|P2P Media Stream| STUN
    Gateway --> Security
    Security --> Controllers
    Controllers --> Services
    WSHandler --> Services
    Services --> Repositories
    Repositories --> MySQL

Technology Stack và phiên bản cụ thể

  • Back-End: Java 17 LTS, Spring Boot 3.2.x, Spring Security 6, Spring Data JPA, Hibernate ORM, Maven.
  • Front-End: Vue.js 3, Vue Router 4, Pinia / Vuex 4, Axios, StompJS, SockJS-client, TailwindCSS.
  • Database & Cloud: MySQL 8.0, Azure Database for MySQL, Vercel (Front-End Hosting), Railway (Back-End Container Runtime).
  • Communication Protocols: RESTful API (JSON format), WebSocket over STOMP, WebRTC (MediaStream, RTCPeerConnection).

Thiết kế cơ sở dữ liệu (Database Schema)

Cơ sở dữ liệu bao gồm các thực thể quan hệ trung tâm, được thiết kế tối ưu chỉ mục (Index) trên các khóa ngoại và trường tìm kiếm thường xuyên:

-- Bảng tài khoản người dùng
CREATE TABLE `User` (
    `user_id` BIGINT AUTO_INCREMENT PRIMARY KEY,
    `phone_number` VARCHAR(15) NOT NULL UNIQUE,
    `password` VARCHAR(255) NOT NULL,
    `full_name` VARCHAR(100) NOT NULL,
    `avatar_url` VARCHAR(500),
    `cover_url` VARCHAR(500),
    `gender` ENUM('MALE', 'FEMALE', 'OTHER'),
    `date_of_birth` DATE,
    `is_active` BOOLEAN DEFAULT TRUE,
    `created_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    INDEX idx_phone (`phone_number`)
);

-- Bảng bài đăng mạng xã hội
CREATE TABLE `Post_user` (
    `post_id` BIGINT AUTO_INCREMENT PRIMARY KEY,
    `user_id` BIGINT NOT NULL,
    `content` TEXT,
    `media_url` VARCHAR(500),
    `media_type` ENUM('NONE', 'IMAGE', 'VIDEO'),
    `created_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    FOREIGN KEY (`user_id`) REFERENCES `User`(`user_id`) ON DELETE CASCADE
);

-- Bảng tương tác tin nhắn
CREATE TABLE `Message_chat` (
    `message_id` BIGINT AUTO_INCREMENT PRIMARY KEY,
    `sender_id` BIGINT NOT NULL,
    `receiver_id` BIGINT NULL,
    `group_id` BIGINT NULL,
    `content` TEXT NOT NULL,
    `media_url` VARCHAR(500),
    `sent_at` TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
    `is_read` BOOLEAN DEFAULT FALSE,
    FOREIGN KEY (`sender_id`) REFERENCES `User`(`user_id`),
    FOREIGN KEY (`receiver_id`) REFERENCES `User`(`user_id`),
    INDEX idx_chat_lookup (`sender_id`, `receiver_id`, `sent_at`)
);

Thiết kế RESTful API

Hệ thống cung cấp danh mục API tường minh với chuẩn định dạng JSON Response (code, message, data):

  • POST /api/v1/auth/register - Đăng ký tài khoản và gửi mã OTP.
  • POST /api/v1/auth/login - Xác thực và phát hành JSON Web Token (JWT).
  • GET /api/v1/posts/feed?page=0&size=10 - Lấy danh sách bài viết trang chủ có phân trang.
  • POST /api/v1/posts - Tạo bài viết mới kèm upload đa phương tiện.
  • POST /api/v1/friends/request/{targetUserId} - Gửi lời mời kết bạn.
  • GET /api/v1/messages/history?partnerId={id} - Lấy lịch sử chat 1-1.

Methodology (Phương pháp luận phát triển)

Dự án áp dụng mô hình phát triển Agile/Scrum rút gọn theo các Sprint 2 tuần, kết hợp quản lý mã nguồn bằng Git (GitFlow branching strategy):

+---------------------------------------------------------------------------------------------------+
|                           QUY TRÌNH QUẢN LÝ TIẾN ĐỘ THỰC HIỆN DỰ ÁN                               |
+---------------------------------------------------------------------------------------------------+
|  Giai đoạn 1 (04/03 - 17/03/2024): Khảo sát hiện trạng, phân tích Requirements & Use Case         |
|  Giai đoạn 2 (18/03 - 31/03/2024): R&D công nghệ Vue.js 3, Spring Boot 3 & WebSocket STOMP        |
|  Giai đoạn 3 (01/04 - 21/04/2024): Thiết kế kiến trúc, Database schema, Xây dựng Core API Back-End|
|  Giai đoạn 4 (22/04 - 12/05/2024): Tích hợp WebSocket Chat 1-1, Thiết kế UI Responsive trên Vue.js|
|  Giai đoạn 5 (13/05 - 02/06/2024): Hiện thực hóa Chat nhóm, Quản lý phân quyền & Tương tác Feed   |
|  Giai đoạn 6 (03/06 - 17/06/2024): Tích hợp Signaling WebRTC Video Call P2P, Admin Dashboard     |
|  Giai đoạn 7 (18/06 - 10/07/2024): Testing toàn diện, Tối ưu Performance, Cloud Deploy & Báo cáo   |
+---------------------------------------------------------------------------------------------------+

Implementation và kết quả

Development Process & Key Algorithms

1. Cấu hình WebSocket Message Broker (STOMP) trên Spring Boot

Để xử lý hàng nghìn kết nối real-time đồng thời mà không nghẽn tài nguyên máy chủ, Spring Boot tích hợp Simple In-Memory Broker qua cấu hình sau:

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        // Định tuyến tin nhắn từ Server -> Client qua tiền tố /topic (broadcast) và /queue (p2p)
        config.enableSimpleBroker("/topic", "/queue");
        // Tiền tố cho các request từ Client gửi lên Server
        config.setApplicationDestinationPrefixes("/app");
        // Tiền tố định tuyến riêng cho từng user
        config.setUserDestinationPrefix("/user");
    }

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/ws-social")
                .setAllowedOriginPatterns("*")
                .withSockJS(); // Fallback khi trình duyệt không hỗ trợ thuần WebSocket
    }
}

2. Xử lý Signaling WebRTC Video Call phía Vue.js Client

Cơ chế trao đổi thông tin SDP (Session Description Protocol) và ICE Candidates được điều phối mượt mà thông qua kênh WebSocket đã thiết lập:

// Khởi tạo RTCPeerConnection và cấu hình STUN Server
const peerConnection = new RTCPeerConnection({
  iceServers: [{ urls: 'stun:stun.l.google.com:19302' }]
});

// Lắng nghe các ứng viên ICE và gửi qua STOMP Signaling
peerConnection.onicecandidate = (event) => {
  if (event.candidate) {
    stompClient.send(`/app/call/candidate/${partnerId}`, {}, JSON.stringify(event.candidate));
  }
};

// Nhận Remote Media Stream và bind vào HTML Video Element
peerConnection.ontrack = (event) => {
  const remoteVideo = document.getElementById('remoteVideoPlayer');
  if (remoteVideo) {
    remoteVideo.srcObject = event.streams[0];
  }
};
+-----------------------------------------------------------------------------------+
|                         SƠ ĐỒ TRUYỀN THÔNG TÍN HIỆU WEBRTC P2P                     |
+-----------------------------------------------------------------------------------+
|   Peer A (Caller)                 Spring Boot (Signaling)        Peer B (Callee)  |
|          |                                   |                          |         |
|          |--- 1. Send Offer (SDP) ---------->|--- 2. Route Offer ------>|         |
|          |                                   |<-- 3. Send Answer (SDP)--|         |
|          |<-- 4. Route Answer ---------------|                          |         |
|          |--- 5. Exchange ICE Candidates --->|<-- Exchange ICE -------->|         |
|          |                                                              |         |
|          |<================ 6. Direct P2P Media Stream ================>|         |
+-----------------------------------------------------------------------------------+

Testing và validation

Quá trình kiểm thử được thực hiện qua các cấp độ: Unit Testing (JUnit 5, Mockito), API Testing (Postman Test Scripts) và Stress Testing tải trọng kết nối.

+------------------------------------------------------------------------------------+
|                         CHỈ SỐ ĐO LƯỜNG VÀ HIỆU NĂNG HỆ THỐNG                      |
+------------------------------------------------------------------------------------+
|   Coverage Unit Test (Service Layer)      : 88.5%                                  |
|   Thời gian phản hồi API trung bình (TTFB): 68ms (Target < 150ms)                  |
|   Độ trễ truyền tin nhắn WebSocket        : 35ms (Local network), 92ms (Cloud)     |
|   Độ trễ truyền hình ảnh/âm thanh WebRTC   : 140ms - 180ms                          |
|   Tỷ lệ Uptime khi triển khai thực tế     : 99.8%                                  |
+------------------------------------------------------------------------------------+
  • Kết quả nghiệm thu người dùng (UAT): 45 người dùng thử nghiệm thực hiện hơn 1,200 tin nhắn và 150 cuộc gọi video. 94.2% đánh giá giao diện thân thiện, dễ làm quen; tốc độ tải bảng tin mượt mà dưới 1.2 giây trên mạng 4G tiêu chuẩn.

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

  1. Kiến trúc Hybrid Real-time độc lập: Tích hợp đồng thời kiến trúc Server-relayed Messaging (WebSocket/STOMP) cho dữ liệu văn bản/nhóm và Peer-to-Peer Streaming (WebRTC) cho truyền thông đa phương tiện độ phân giải cao. Mô hình này giúp giảm tới 75% băng thông máy chủ so với việc truyền dữ liệu Media qua Relay Server truyền thống.
  2. Xác thực và phân quyền phi trạng thái (Stateless Security): Ứng dụng mô hình Stateless JWT kết hợp Token Filter của Spring Security 6, tối ưu hóa việc phân chia các tác nhân hệ thống (Khách vãng lai, Người dùng đã xác thực, Quản trị viên) với mức độ an toàn cao, loại bỏ rủi ro tấn công CSRF phổ biến trên kiến trúc Session-based.
  3. Trải nghiệm Single Page Application (SPA) tối ưu: Sử dụng triệt để cơ chế Two-way Data Binding và Virtual DOM của Vue.js 3, giúp chuyển trang không giật lag, thời gian chuyển đổi tác vụ giảm 40% so với các ứng dụng Multi-page truyền thống.

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

Môi trường triển khai Production

  • Front-End Deployment: Tích hợp Vercel thông qua kết nối Git Webhook, tự động Build & Minify mã nguồn Vue.js, phân phối qua mạng lưới Edge CDN toàn cầu.
  • Back-End Deployment: Đóng gói ứng dụng Spring Boot thành Docker Container và host trên nền tảng Railway với tính năng Auto-restart và cân bằng tải tài nguyên.
  • Database Engine: Azure Database for MySQL với tính năng tự động sao lưu dữ liệu hàng ngày (Automated Backup) và cấu hình tường lửa (Firewall Rules) hạn chế truy cập trực tiếp từ Internet.
+-----------------------------------------------------------------------------------+
|                        MÔ HÌNH TRIỂN KHAI CLOUD DISTRIBUTED                       |
+-----------------------------------------------------------------------------------+
| [Developers] ---> Push Code (GitHub)                                              |
|                         |                                                         |
|          +--------------+--------------+                                          |
|          | (CI/CD Webhook)             | (Container Build)                        |
|          v                             v                                          |
|  [Vercel Edge Network]         [Railway Container Engine]                         |
|  (Vue.js SPA Bundle)           (Spring Boot Java 17 Runtime)                      |
|          |                             |                                          |
|          +------------> SSL/TLS <------+                                          |
|                         |                                                         |
|                         v                                                         |
|             [Azure Database for MySQL]                                            |
+-----------------------------------------------------------------------------------+

Ước tính chi phí & Khả năng mở rộng

  • Chi phí vận hành ban đầu: 0 - 15 USD/tháng (Sử dụng các gói Tier Free/Hobby trên Vercel, Railway và Azure for Students), rất phù hợp để triển khai nội bộ trường học, doanh nghiệp vừa và nhỏ hoặc các cộng đồng ngách.
  • Khả năng mở rộng (Scalability): Kiến trúc Backend không lưu Session (Stateless) cho phép mở rộng ngang (Horizontal Scaling) thành cụm nhiều Container phía sau một Load Balancer (Nginx/HAProxy) khi lượng người dùng đồng thời (CCU) vượt mốc 10,000.

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

Hạn chế kỹ thuật

  • Chưa tích hợp Media Server chuyên dụng (như Kurento, Janus hoặc Jitsi) để hỗ trợ gọi video nhóm đa điểm (> 2 người).
  • Chưa có giải pháp nén video trực tiếp phía Client trước khi upload, dẫn đến tốn thời gian xử lý khi người dùng đăng video dung lượng lớn.
  • Cơ chế tìm kiếm mới chỉ dừng lại ở việc so khớp chính xác chuỗi (SQL LIKE query) qua số điện thoại và tên, chưa áp dụng Full-text Search hoặc Elasticsearch.

Hướng phát triển tương lai

  • Tích hợp Elasticsearch: Tối ưu hóa bộ máy tìm kiếm bài viết, hashtag và gợi ý bạn bè thông minh dựa trên sở thích chung.
  • Triển khai SFU (Selective Forwarding Unit): Nâng cấp tính năng Video Call từ P2P lên Group Video Conference hỗ trợ phòng họp trực tuyến từ 10-50 thành viên.
  • Phát triển Mobile Client với Flutter/React Native: Tái sử dụng toàn bộ hệ thống 100% RESTful API và WebSocket hiện có để mở rộng sang nền tảng iOS và Android.

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

+-----------------------------------------------------------------------------------+
|                         GIÁ TRỊ MANG LẠI CHO CÁC NHÓM ĐỐI TƯỢNG                   |
+-----------------------------------------------------------------------------------+
| 1. Sinh viên CNTT / Kỹ thuật phần mềm:                                            |
|    - Cung cấp tài liệu tham khảo chuẩn mực về đồ án tốt nghiệp công nghệ cao.     |
|    - Tiếp cận mã nguồn thực tế kết hợp giữa Spring Boot 3 và Vue.js 3.            |
|                                                                                   |
| 2. Lập trình viên Fullstack (Developers):                                         |
|    - Mẫu thiết kế (Design Pattern) hoàn chỉnh cho luồng Signaling WebRTC.         |
|    - Cấu hình chuẩn hóa Spring Security 6 với Stateless JWT & WebSocket Broker.   |
|                                                                                   |
| 3. Doanh nghiệp / Khởi nghiệp (Startups):                                         |
|    - Bộ khung (Boilerplate) sẵn sàng để phát triển mạng xã hội nội bộ chuyên biệt.|
|    - Tối ưu hóa chi phí bản quyền và hạ tầng nhờ công nghệ mã nguồn mở 100%.      |
+-----------------------------------------------------------------------------------+

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

1. Yêu cầu phần cứng và môi trường tối thiểu để triển khai hệ thống là gì?

  • Server: CPU 2 Cores, RAM tối thiểu 2GB, Ổ cứng SSD 20GB, Cài đặt sẵn JDK 17+ và MySQL 8.0+.
  • Client: Bất kỳ trình duyệt web hiện đại nào có hỗ trợ chuẩn HTML5, WebSocket và WebRTC (Google Chrome 90+, Mozilla Firefox 88+, Safari 14+, Microsoft Edge).

2. Hệ thống xử lý nghẽn kết nối như thế nào khi lượng truy cập tăng vọt?

Nhờ thiết kế Stateless của Spring Boot API, hệ thống có thể scale ngang nhiều node phía sau Reverse Proxy. Đối với WebSocket, có thể tích hợp RabbitMQ hoặc Redis Pub/Sub làm external message broker thay thế cho In-memory Simple Broker mặc định để đồng bộ tin nhắn qua nhiều máy chủ.

3. Tại sao chọn Vue.js thay vì React hay Angular cho giao diện người dùng?

Vue.js sở hữu đường cong học tập (learning curve) nhẹ nhàng, cú pháp SFC (Single File Component) trực quan, cơ chế reactivity hiệu năng cao và kích thước bundle sau khi build rất nhỏ (~30KB gzipped), giúp tốc độ render trang nhanh hơn đáng kể trên môi trường mạng hạn chế.

4. Cuộc gọi WebRTC có an toàn không và có yêu cầu cấu hình đặc biệt qua tường lửa NAT?

WebRTC bắt buộc sử dụng chuẩn mã hóa DTLS (Datagram Transport Layer Security) và SRTP (Secure Real-time Transport Protocol), đảm bảo âm thanh và hình ảnh không thể bị nghe lén. Hệ thống sử dụng STUN Server công cộng của Google để giải quyết địa chỉ NAT; đối với các mạng tường lửa nghiêm ngặt đối xứng (Symmetric NAT), việc bổ sung TURN Server (như Coturn) sẽ đảm bảo tỷ lệ kết nối thành công đạt 100%.

5. Dự án này có thể tích hợp thêm ứng dụng di động trong tương lai không?

Hoàn toàn dễ dàng. Vì toàn bộ tầng nghiệp vụ Back-End được thiết kế theo chuẩn RESTful API phi trạng thái và WebSocket tiêu chuẩn, lập trình viên di động có thể kết nối ngay lập tức bằng Flutter, React Native, Swift (iOS) hoặc Kotlin (Android) mà không cần thay đổi logic xử lý máy chủ.


Kết luận

Đề tài "Xây dựng website mạng xã hội sử dụng công nghệ VueJs và Spring Boot" của nhóm sinh viên Từ Thanh Thoại và Võ Giang Nam tại Đại học Sư phạm Kỹ thuật TP.HCM đã hiện thực hóa thành công một nền tảng mạng xã hội hiện đại, hoàn chỉnh về cả mặt lý thuyết học thuật lẫn sản phẩm thực tiễn.

Bằng việc kết hợp nhuần nhuyễn giữa hiệu năng mạnh mẽ, tính toàn vẹn dữ liệu của Spring Boot cùng sự linh hoạt, mượt mà của Vue.js, dự án đã giải quyết xuất sắc bài toán truyền thông thời gian thực với WebSocketWebRTC. Đây không chỉ là một công trình tốt nghiệp xuất sắc mà còn là tài liệu tham khảo giàu giá trị học thuật và ứng dụng cho cộng đồng phát triển phần mềm Việt Nam.