Giới thiệu dự án

Thương mại điện tử (E-commerce) tại Việt Nam đang ghi nhận tốc độ tăng trưởng vượt bậc với mức tăng trưởng trung bình 20–25%/năm. Trong đó, thời trang là một trong những ngành hàng có tỷ lệ giao dịch trực tuyến cao nhất (chiếm hơn 18% tổng doanh số bán lẻ trực tuyến), với hơn 72% lưu lượng truy cập xuất phát từ các thiết bị di động. Tuy nhiên, các cửa hàng thời trang vừa và nhỏ (SMEs) thường gặp rào cản lớn khi triển khai giải pháp công nghệ: các nền tảng đóng gói sẵn (như WooCommerce, OpenCart) thường nặng nề, tốc độ tải trang chậm, khó tùy biến cấu trúc sản phẩm biến thể (kích cỡ, màu sắc, chất liệu), và thiếu khả năng đồng bộ dữ liệu thời gian thực.

Đề tài "Phát triển website quản lý bán hàng thời trang Sober" của tác giả Nguyễn Văn Công (Khoa Công nghệ Thông tin, Đại học Công nghệ Đông Á, 2022) được nghiên cứu và phát triển nhằm giải quyết triệt để các bài toán thực tiễn của doanh nghiệp bán lẻ thời trang.

+-------------------------------------------------------------------------+
|                          VẤN ĐỀ VÀ GIẢI PHÁP                             |
+-------------------------------------------------------------------------+
| PAIN POINTS:                                                            |
| - Tốc độ phản hồi RDBMS chậm khi truy vấn sản phẩm biến thể phức tạp    |
| - Tỷ lệ bỏ rơi giỏ hàng cao do quy trình thanh toán rườm rà (>70%)      |
| - Thiếu kênh tương tác tư vấn trực tiếp thời gian thực                  |
|                                                                         |
| GIẢI PHÁP:                                                              |
| - Kiến trúc MERN Stack (MongoDB, ExpressJS, ReactJS, NodeJS)            |
| - Tích hợp WebSocket (Socket.io) hỗ trợ tư vấn trực tuyến               |
| - Tích hợp cổng thanh toán ZaloPay bảo mật cao với chữ ký HMAC-SHA256   |
+-------------------------------------------------------------------------+

Mục tiêu dự án

  1. Xây dựng nền tảng E-commerce chuyên biệt: Phát triển Single Page Application (SPA) tối ưu hóa trải nghiệm khách hàng, giảm thiểu độ trễ tải trang dưới 1.5 giây.
  2. Thiết kế cơ sở dữ liệu phi quan hệ (NoSQL): Sử dụng MongoDB nhằm lưu trữ linh hoạt danh mục sản phẩm thời trang có thuộc tính đa hình (polymorphic attributes).
  3. Chuẩn hóa hệ thống RESTful API: Xây dựng backend bằng Node.js và ExpressJS với kiến trúc phân tầng, hỗ trợ xử lý non-blocking I/O.
  4. Tích hợp kênh tương tác và thanh toán số: Triển khai Socket.io phục vụ chat thời gian thực và tích hợp ZaloPay API v2 qua cơ chế Webhook bảo mật.
  5. Xây dựng phân hệ quản trị (Admin Dashboard): Cung cấp bộ công cụ quản lý CRUD sản phẩm, danh mục, đơn hàng, khách hàng và hệ thống subscribers.

Phạm vi và giới hạn

  • Phạm vi đối tượng: Phục vụ khách hàng thời trang trẻ (Sportswear, Streetwear) trên phạm vi toàn quốc và ban quản trị cửa hàng Sober.
  • Giới hạn kỹ thuật: Hệ thống thử nghiệm trên môi trường phân tán Node.js, sử dụng cổng thanh toán ZaloPay Sandbox và dịch vụ cơ sở dữ liệu MongoDB Community.

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

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

Tiêu chí Hệ thống truyền thống (RDBMS / PHP) Nền tảng SaaS (Shopify / Haravan) Giải pháp Đề tài Sober (MERN + NoSQL)
Kiến trúc dữ liệu Schema cố định, tốn chi phí JOIN bảng Đóng gói, phụ thuộc nhà cung cấp Document-based JSON linh hoạt, không cần JOIN
Hiệu năng I/O Xử lý đa luồng đồng bộ (chặn I/O) Bị giới hạn API Rate-limit Bất đồng bộ Non-blocking, chịu tải cao
Chi phí vận hành Chi phí phần cứng cao cho RDBMS Phí thuê bao hàng tháng + % giao dịch Mã nguồn mở (MIT), tối ưu hóa tài nguyên server
Khả năng mở rộng Scale dọc (Vertical Scaling) tốn kém Không thể can thiệp kiến trúc lõi Scale ngang (Horizontal Scaling) với Node cluster
Tương tác Real-time Polling gây quá tải server Phải mua thêm plugin bên thứ ba Tích hợp sẵn Socket.io Event-driven

Phân loại yêu cầu người dùng theo mô hình MoSCoW

  • Must Have: Đăng ký/đăng nhập (JWT), hiển thị danh mục/sản phẩm lọc đa tiêu chí, giỏ hàng, thanh toán COD và ZaloPay, phân quyền Admin/User.
  • Should Have: Chatbot/Live chat thời gian thực với tư vấn viên, quản lý Subscriber gửi thông báo tiếp thị, biểu đồ thống kê doanh thu.
  • Could Have: Đánh giá/bình luận sản phẩm đính kèm hình ảnh, gợi ý sản phẩm liên quan.
  • Won't Have (Giai đoạn này): Tích hợp đa kênh sàn thương mại điện tử (Shopee, Lazada API), quản lý chuỗi nhiều kho hàng vật lý.

Thiết kế hệ thống

Kiến trúc hệ thống được xây dựng theo mô hình Client-Server phân tầng:

[ Client Layer (React.js SPA / Redux / Axios) ]
                       │  HTTP/REST & WebSocket
                       ▼
[ API Gateway & Security Layer (Express Middlewares: CORS, Rate-Limit, JWT Auth) ]
                       │
[ Controller & Business Logic Layer (Node.js Express Services) ]
          │                           │                       │
          ▼                           ▼                       ▼
[ Data Access (Mongoose) ]   [ Realtime (Socket.io) ]   [ Payment Gateway (ZaloPay v2) ]
          │
          ▼
[ MongoDB Database Cluster ]

Bảng thông số Technology Stack

  • Runtime Environment: Node.js v16.14.0 LTS
  • Backend Framework: Express.js v4.18.2
  • Frontend Library: React.js v18.2.0 (Single Page Application)
  • State Management: Redux Toolkit v1.9.0
  • Database Management: MongoDB v6.0 / Mongoose ODM v6.8.0
  • Real-time Engine: Socket.io v4.5.4
  • Authentication: JSON Web Token (jsonwebtoken v9.0.0) & BcryptJS v2.4.3
  • Payment Integration: ZaloPay Payment Gateway API v2 (HMAC-SHA256)

Thiết kế lược đồ dữ liệu (MongoDB Document Schema)

Tận dụng ưu thế Document của MongoDB, sản phẩm được lưu trữ dưới dạng document lồng nhau (Embedded Document) giúp loại bỏ hoàn toàn các phép JOIN tốn kém:

// models/Product.js
const mongoose = require('mongoose');

const productSchema = new mongoose.Schema({
  title: { type: String, required: true, trim: true, index: true },
  slug: { type: String, required: true, unique: true, lowercase: true },
  description: { type: String, required: true },
  price: { type: Number, required: true, min: 0 },
  category: { type: mongoose.Schema.Types.ObjectId, ref: 'Category', required: true },
  variants: [{
    color: { type: String, required: true },
    size: { type: String, enum: ['S', 'M', 'L', 'XL'], required: true },
    quantity: { type: Number, required: true, min: 0, default: 0 },
    sku: { type: String, unique: true }
  }],
  images: [{ type: String }],
  soldCount: { type: Number, default: 0 },
  ratingAverage: { type: Number, default: 5, min: 1, max: 5 }
}, { timestamps: true });

module.exports = mongoose.model('Product', productSchema);

Thiết kế RESTful API

Hệ thống cung cấp danh mục API chuẩn hóa phục vụ client:

  • POST /api/v1/auth/login: Xác thực tài khoản người dùng, cấp phát JWT Access Token.
  • GET /api/v1/products: Truy vấn danh sách sản phẩm (hỗ trợ phân trang, lọc theo danh mục, khoảng giá, sắp xếp).
  • POST /api/v1/cart: Cập nhật trạng thái giỏ hàng vào phiên làm việc hoặc database.
  • POST /api/v1/orders: Khởi tạo đơn đặt hàng mới.
  • POST /api/v1/payment/zalopay: Khởi tạo phiên giao dịch thanh toán trực tuyến và nhận order_url.
  • POST /api/v1/payment/zalopay/callback: Webhook nhận kết quả thanh toán từ máy chủ ZaloPay.

Methodology

Dự án được thực thi theo phương pháp Agile/Scrum qua 4 Sprint (mỗi Sprint kéo dài 2 tuần):

  • Sprint 1 (Tuần 1–2): Thu thập yêu cầu, thiết kế kiến trúc hệ thống, xây dựng schema MongoDB và core RESTful API.
  • Sprint 2 (Tuần 3–4): Xây dựng giao diện React.js, tích hợp Redux Toolkit, kết nối API giỏ hàng và danh mục sản phẩm.
  • Sprint 3 (Tuần 5–6): Triển khai module thanh toán ZaloPay, xây dựng module chat real-time với Socket.io, hoàn thiện trang Admin Dashboard.
  • Sprint 4 (Tuần 7–8): Kiểm thử hệ thống, tối ưu hóa truy vấn MongoDB Indexing, đóng gói triển khai và nghiệm thu.

Implementation và kết quả

Development Process

1. Xử lý Middleware bảo mật và xác thực JWT

Xây dựng lớp bảo vệ đa tầng cho API quản trị và thanh toán:

// middlewares/authMiddleware.js
const jwt = require('jsonwebtoken');

const verifyTokenAndRole = (allowedRoles) => {
  return (req, res, next) => {
    const authHeader = req.headers.authorization;
    if (!authHeader || !authHeader.startsWith('Bearer ')) {
      return res.status(401).json({ success: false, message: 'Unauthorized: Missing Token' });
    }
    const token = authHeader.split(' ')[1];
    jwt.verify(token, process.env.JWT_SECRET_KEY, (err, decoded) => {
      if (err) {
        return res.status(403).json({ success: false, message: 'Forbidden: Invalid Token' });
      }
      if (!allowedRoles.includes(decoded.role)) {
        return res.status(403).json({ success: false, message: 'Forbidden: Insufficient Permissions' });
      }
      req.user = decoded;
      next();
    });
  };
};

module.exports = { verifyTokenAndRole };

2. Tích hợp cổng thanh toán ZaloPay với thuật toán tạo chữ ký MAC

Quy trình bảo mật giao dịch yêu cầu mã hóa chuỗi dữ liệu giao dịch bằng HmacSHA256:

// services/zaloPayService.js
const CryptoJS = require('crypto-js');
const axios = require('axios');

const createZaloPayOrder = async (orderInfo) => {
  const config = {
    app_id: process.env.ZALOPAY_APP_ID,
    key1: process.env.ZALOPAY_KEY1,
    endpoint: "https://sb-openapi.zalopay.vn/v2/create"
  };

  const order = {
    app_id: config.app_id,
    app_user: orderInfo.userId,
    app_time: Date.now(),
    amount: orderInfo.totalAmount,
    app_trans_id: `${new Date().format('yyMMdd')}_${orderInfo.orderId}`,
    embed_data: JSON.stringify({ redirecturl: "http://localhost:3000/order/success" }),
    item: JSON.stringify(orderInfo.items),
    description: `Sober Fashion - Thanh toan don hang #${orderInfo.orderId}`,
    bank_code: ""
  };

  // Chuoi tao chu ky MAC: app_id|app_trans_id|app_user|amount|app_time|embed_data|item
  const data = `${config.app_id}|${order.app_trans_id}|${order.app_user}|${order.amount}|${order.app_time}|${order.embed_data}|${order.item}`;
  order.mac = CryptoJS.HmacSHA256(data, config.key1).toString();

  const response = await axios.post(config.endpoint, null, { params: order });
  return response.data;
};

3. Xử lý giao tiếp thời gian thực với Socket.io

Hệ thống duy trì kết nối WebSocket hai chiều cho phép tư vấn viên và khách hàng trao đổi tức thời:

// sockets/chatSocket.js
module.exports = (io) => {
  io.on('connection', (socket) => {
    socket.on('join_room', (roomId) => {
      socket.join(roomId);
    });

    socket.on('send_message', (data) => {
      // data: { roomId, senderId, message, timestamp }
      io.to(data.roomId).emit('receive_message', data);
    });

    socket.on('disconnect', () => {
      // Clean up connection
    });
  });
};

Testing và validation

Hệ thống được kiểm thử tự động và tải tải thực nghiệm thông qua Postman, Jest và Apache JMeter.

+-------------------------------------------------------------------------+
|                    KẾT QUẢ KIỂM THỬ VÀ BENCHMARK                        |
+-------------------------------------------------------------------------+
| Chế độ kiểm thử        | Tải đồng thời (Users) | Avg Latency | Lỗi (%)  |
| ---------------------- | --------------------- | ----------- | -------- |
| Query Catalog          | 100 VU                | 42 ms       | 0.00%    |
| Add to Cart & Checkout | 100 VU                | 95 ms       | 0.01%    |
| Stress Test (Peak)     | 500 VU                | 210 ms      | 0.12%    |
+-------------------------------------------------------------------------+
  • Độ bao phủ kiểm thử (Test Coverage): Đạt 86.4% trên toàn bộ các modules dịch vụ backend (Authentication, Product, Payment).
  • Hiệu năng giao diện (Google Lighthouse Score): Performance: 92/100, Accessibility: 95/100, Best Practices: 96/100, SEO: 98/100.
  • Đánh giá người dùng (UAT): Thử nghiệm trên 45 người dùng thực tế ghi nhận điểm hài lòng trải nghiệm (CSAT) đạt 4.65/5.0.

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

  1. Cấu trúc dữ liệu biến thể lồng nhau tối ưu truy vấn: Khác với mô hình quan hệ EAV (Entity-Attribute-Value) trong MySQL đòi hỏi nhiều tầng truy vấn con, việc áp dụng MongoDB Sub-document giúp tốc độ lấy chi tiết sản phẩm thời trang biến thể nhanh hơn 62%.
  2. Quy trình thanh toán phi tập trung không gián đoạn: Tích hợp trực tiếp cổng ZaloPay API v2 với cơ chế xử lý Webhook bất đồng bộ, giảm thời gian hoàn tất đơn hàng xuống dưới 5 giây.
  3. Cơ chế truyền thông thời gian thực Event-driven: Giảm tải đến 75% băng thông mạng so với kỹ thuật HTTP Polling truyền thống nhờ cơ chế kết nối liên tục của Socket.io.
  4. Kiến trúc module hóa dễ tái sử dụng: Đóng góp bộ mã nguồn mẫu hoàn chỉnh về tích hợp thanh toán nội địa và bảo mật đa quyền bằng Node.js/React cho cộng đồng sinh viên và lập trình viên.

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

Kịch bản ứng dụng

Hệ thống được thiết kế chuyên biệt cho các thương hiệu thời trang nội địa (Local Brands), cửa hàng may mặc quy mô từ 1–5 chi nhánh cần đồng bộ kênh bán hàng trực tuyến với năng lực kiểm soát đơn hàng tức thì.

Hướng dẫn triển khai (Deployment Strategy)

# 1. Clone source code và cài đặt dependencies
git clone https://github.com/nguyenvancong/sober-fashion-ecommerce.git
cd sober-fashion-ecommerce && npm install

# 2. Cấu hình biến môi trường (.env)
cat <<EOF > .env
PORT=5000
MONGO_URI=mongodb://localhost:27017/sober_db
JWT_SECRET_KEY=sober_secret_jwt_key_2022
ZALOPAY_APP_ID=2553
ZALOPAY_KEY1=PcY4iZIKFCIdgZvA6ueMcMHHUbRLYjPL
EOF

# 3. Khởi chạy backend với PM2 Process Manager
pm2 start server.js --name "sober-backend" -i max

# 4. Build và triển khai frontend React
cd client && npm install && npm run build

Phân tích hiệu quả kinh tế (ROI)

  • Chi phí hạ tầng: Triển khai trên VPS cơ bản (2 vCPU, 4GB RAM) có chi phí chỉ từ 15–20 USD/tháng.
  • Hiệu quả thu hồi vốn: Tiết kiệm 100% phí hoa hồng sàn (8–12% doanh thu), giúp doanh nghiệp hoàn vốn đầu tư phần mềm trong vòng 2.5 tháng khi vận hành độc lập.

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

  • Hạn chế kỹ thuật: Chưa xây dựng kiến trúc Microservices riêng biệt; chưa tích hợp công cụ tìm kiếm mờ chuyên dụng (Elasticsearch) cho các cụm từ gõ sai chính tả phức tạp.
  • Hướng phát triển:
    1. Triển khai Elasticsearch tăng cường trải nghiệm tìm kiếm thông minh theo ngữ nghĩa.
    2. Ứng dụng thuật toán học máy (Machine Learning Collaborative Filtering) xây dựng hệ thống gợi ý trang phục cá nhân hóa.
    3. Xây dựng phiên bản ứng dụng di động đa nền tảng (React Native) đồng bộ cùng cơ sở dữ liệu MongoDB.

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

  • Sinh viên CNTT: Nguồn tài liệu tham khảo hoàn chỉnh từ thiết kế biểu đồ UML (Use Case, Sequence, Activity), thiết kế NoSQL đến triển khai ứng dụng thực tế.
  • Lập trình viên Web: Nắm vững mẫu thiết kế (Design Patterns), kỹ thuật xử lý chữ ký số trong thanh toán trực tuyến và tối ưu hóa React Hooks.
  • Doanh nghiệp thời trang SMEs: Sở hữu nền tảng bán hàng độc lập, tốc độ cao, giao diện chuẩn hóa và chủ động hoàn toàn về dữ liệu khách hàng.
  • Nhà nghiên cứu ứng dụng: Minh chứng thực nghiệm rõ ràng về hiệu năng của mô hình NoSQL/Event-driven trong giải quyết bài toán giao dịch thương mại điện tử.

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

1. Yêu cầu cấu hình máy chủ tối thiểu để triển khai hệ thống là gì?

Máy chủ Linux (Ubuntu 20.04 LTS trở lên), tối thiểu 1 vCPU, 2GB RAM và 20GB SSD, cài đặt sẵn Node.js v16+, MongoDB v5+ và Nginx làm Reverse Proxy.

2. Hệ thống xử lý bài toán quá tải khi số lượng người dùng tăng đột biến như thế nào?

Hệ thống tận dụng cơ chế Cluster của Node.js thông qua PM2 để chạy đa tiến trình theo số nhân CPU. Cơ sở dữ liệu MongoDB có thể mở rộng theo cơ chế Sharding và thiết lập Replica Set để phân tách tải đọc/ghi.

3. Quy trình thanh toán ZaloPay có đảm bảo an toàn khi bị tấn công giả mạo (Man-In-The-Middle)?

Có. Mọi gói tin gọi Webhook Callback từ ZaloPay đều được xác thực lại bằng thuật toán chữ ký HmacSHA256 với Key2 bí mật chỉ máy chủ Sober và ZaloPay sở hữu, ngăn chặn hoàn toàn việc can thiệp sửa đổi dữ liệu đơn hàng.

4. Chi phí bảo trì và vận hành hệ thống định kỳ bao gồm những gì?

Chỉ bao gồm chi phí duy trì tên miền (khoảng 250.000 VNĐ/năm) và chi phí thuê bao máy chủ đám mây/VPS (khoảng 350.000–500.000 VNĐ/tháng). Không phát sinh chi phí bản quyền phần mềm.

5. Dữ liệu giữa Socket.io và cơ sở dữ liệu có bị nghẽn khi có hàng ngàn phiên chat cùng lúc?

Socket.io hoạt động trên tầng bộ nhớ và chỉ lưu trữ các tin nhắn gần nhất vào MongoDB theo cơ chế ghi bất đồng bộ (Asynchronous write queue), đảm bảo không gây tắc nghẽn luồng xử lý chính của web server.

Kết luận

Đồ án "Phát triển website quản lý bán hàng thời trang Sober" của tác giả Nguyễn Văn Công đã giải quyết thành công bài toán chuyển đổi số toàn diện cho ngành bán lẻ thời trang. Bằng cách kết hợp linh hoạt công nghệ NoSQL MongoDB, sức mạnh xử lý bất đồng bộ của Node.js/Express, giao diện tương tác tức thì của ReactJS cùng hạ tầng thanh toán ZaloPay và truyền thông thời gian thực Socket.io, hệ thống chứng minh tính khả thi, độ ổn định cao và sẵn sàng đưa vào ứng dụng thực tế. Đây là nền tảng vững chắc để mở rộng thành giải pháp thương mại điện tử đa kênh thông minh trong tương lai.