Design and Implementation of a Java-Based Web Novel Reading Platform

Technical Architecture

Backend Framework: Spring Boot

The backend infrastructure is built upon Spring Boot, a framwork designed to expedite the development of Spring-based applications. By adopting the principle of "convention over configuration," Spring Boot significantly reduces the need for manual boilerplate configuration. It offers automated configuration setups tailored to the project's dependencies, allowing developers to focus primarily on business logic rather than XML files or complex annotations. The project utilizes Maven for dependancy management and build automation, leveraging Spring Initializr to establish a robust project structure quickly.

Front end Framework: Vue.js

The user interface is constructed using Vue.js, a progressive JavaScript framework focused on simplicity and reactivity. Vue provides an intuitive API for building interactive web views. Its core feature, the two-way data binding (implemented via directives like v-model), ensures that any changes in the data model are immediately reflected in the view and vice versa, eliminating the need for excessive DOM manipulation. Additionally, Vue's lifecycle hooks offer granular control over component stages—such as creation, mounting, updating, and destruction—enabling flexible custom logic execution.

Feasibility Analysis

Technical Feasibility

The system utilizes mature Java technologies. Given the stability and extensive community support of the Java ecosystem, developing this platform using the selected tech stack is technically viable and ensures long-term maintainability.

Economic Feasibility

A cost-benefit analysis indicates that the efficiency gained by automating reading management and user interactions outweighs the development and operational costs. The system reduces manual administrative overhead, offering a positive return on investment.

Operational Feasibility

The interface design prioritizes user experience (UX). For both administrators and readers, the workflows are streamlined to ensure intuitive navigation. The system minimizes the learning curve, ensuring that users can perform tasks such as searching for novels, managing bookmarks, or updating user profiles with minimal training.

System Testing Strategy

Testing Objectives

System testing serves as the final quality gate before deployment. The primary objective is to validate that the application meets all functional requirements specified in the design document. By simulating various user scenarios, the testing phase aims to identify logic errors, security vulnerabilities, and performance bottlenecks. The process focuses on ensuring data consistency, verifying permission controls, and guaranteeing that the user interaction flows smoothly without unexpected crashes.

Functional Testing Cases

Login Module Testing

The login mechanism is tested to ensure robust authentication and error handling. The test cases verify valid credentials, incorrect passwords, empty fields, and verification code logic.

Test Case Input Expected Outcome Actual Outcome Status
Username: admin Password: password123 Captcha: Valid Redirect to Dashboard Login Successful Pass
Username: admin Password: wrongpass Captcha: Valid Display "Invalid Password" Error message displayed Pass
Username: admin Password: password123 Captcha: Invalid Display "Captcha Error" Error message displayed Pass
Username: [Empty] Password: password123 Captcha: Valid Display "Username Required" Validation prompt triggered Pass

User Management Testing

This module tests CRUD (Create, Read, Update, Delete) operations for user accounts. It checks for constraints such as duplicate usernames and mandatory fields.

Action Test Data Expected Outcome Actual Outcome Status
Add User Valid unique username and profile info User added to list User visible in list Pass
Add User Existing username Display "Username Exists" Error returned Pass
Delete User Select active user Confirm prompt & removal User removed from DB Pass
Edit User Update phone number Changes saved Database updated Pass

Database Schema Design

The database design ensures data integrity and efficient retrieval. Below is the structure for the transaction record table, which tracks user activities within the platform.

Column Name Data Type Length Constraints
id INT 11 PRIMARY KEY
create_time DATETIME - DEFAULT NULL
transaction_no VARCHAR 64 UNIQUE
novel_id VARCHAR 64 NOT NULL
novel_title VARCHAR 128 DEFAULT NULL
status_note VARCHAR 255 DEFAULT NULL
amount DECIMAL 10,2 DEFAULT 0.00
record_date DATETIME - DEFAULT NULL
account_name VARCHAR 64 DEFAULT NULL
contact_phone VARCHAR 20 DEFAULT NULL

Code Implementation

The following code snippet demonstrates a refactored utility controller. It handles geographical location resolution and image comparison features, utilizing external service configurations injected at runtime.


import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;
import java.io.File;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;

/**
 * Platform Utility Controller
 * Handles location services and biometric verification logic.
 */
@RestController
@RequestMapping("/api/v1/util")
public class UtilityController {

    @Autowired
    private ConfigurationService configService;

    private static ExternalMapService mapService;
    private static final String MAP_API_KEY_CONFIG = "external_map_api_key";

    /**
     * Retrieves city information based on longitude and latitude.
     */
    @GetMapping("/location/resolve")
    public ResponseEntity<Map<String, String>> resolveLocation(@RequestParam String longitude, @RequestParam String latitude) {
        if (mapService == null) {
            initializeMapService();
        }
        Map<String, String> locationData = mapService.getCityByCoordinates(longitude, latitude);
        return ResponseEntity.ok(locationData);
    }

    private void initializeMapService() {
        String apiKey = configService.getParamValue(MAP_API_KEY_CONFIG);
        if (apiKey == null || apiKey.isEmpty()) {
            throw new RuntimeException("Map API Key is not configured in the system settings.");
        }
        mapService = new ExternalMapService(apiKey);
    }

    /**
     * Compares two uploaded images to verify identity.
     */
    @PostMapping("/identity/verify")
    public ResponseEntity<VerificationResult> verifyIdentity(@RequestParam String imageOnePath, @RequestParam String imageTwoPath) {
        try {
            // Initialize client logic (e.g., Baidu/AWS Face API)
            BiometricClient client = getBiometricClient();

            // Load images from static resources
            File sourceImg = new File(getUploadDir() + "/" + imageOnePath);
            File targetImg = new File(getUploadDir() + "/" + imageTwoPath);

            String encodedSource = Base64Encoder.encode(sourceImg);
            String encodedTarget = Base64Encoder.encode(targetImg);

            // Execute comparison
            ComparisonRequest req1 = new ComparisonRequest(encodedSource, "BASE64");
            ComparisonRequest req2 = new ComparisonRequest(encodedTarget, "BASE64");

            VerificationResult result = client.compareFaces(req1, req2);
            return ResponseEntity.ok(result);

        } catch (IOException e) {
            return ResponseEntity.status(500).body(new VerificationResult("File Processing Error", false));
        }
    }

    private BiometricClient getBiometricClient() {
        // Implementation details for fetching API keys and initializing the client
        String accessKey = configService.getParamValue("biometric_access_key");
        String secretKey = configService.getParamValue("biometric_secret_key");
        return new BiometricClient(accessKey, secretKey);
    }

    private String getUploadDir() {
        return ResourceUtils.getFile("classpath:static/upload").getAbsolutePath();
    }
}

Database Initialization Script

The following SQL scripts set up the core tables for the application, including the user accounts, feedback system, and authentication tokens.


CREATE TABLE `users` (
  `id` BIGINT NOT NULL AUTO_INCREMENT COMMENT 'Primary Key',
  `created_at` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT 'Creation Timestamp',
  `username` VARCHAR(200) NOT NULL COMMENT 'Login Username',
  `password_hash` VARCHAR(200) NOT NULL COMMENT 'Encrypted Password',
  `full_name` VARCHAR(200) DEFAULT NULL COMMENT 'Real Name',
  `gender` VARCHAR(50) DEFAULT NULL COMMENT 'Gender',
  `avatar_url` VARCHAR(255) DEFAULT NULL COMMENT 'Profile Image Path',
  `mobile_number` VARCHAR(20) DEFAULT NULL COMMENT 'Contact Phone',
  `id_card` VARCHAR(200) DEFAULT NULL COMMENT 'ID Number',
  PRIMARY KEY (`id`),
  UNIQUE KEY `idx_username` (`username`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='User Accounts';

CREATE TABLE `feedback_messages` (
  `id` BIGINT NOT NULL AUTO_INCREMENT COMMENT 'Primary Key',
  `created_at` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT 'Timestamp',
  `user_id` BIGINT NOT NULL COMMENT 'Poster ID',
  `nickname` VARCHAR(200) DEFAULT NULL COMMENT 'Display Name',
  `message_content` TEXT NOT NULL COMMENT 'Message Body',
  `admin_reply` TEXT COMMENT 'Admin Response',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='User Feedback';

CREATE TABLE `auth_tokens` (
  `id` BIGINT NOT NULL AUTO_INCREMENT COMMENT 'Primary Key',
  `user_id` BIGINT NOT NULL COMMENT 'Associated User ID',
  `username` VARCHAR(100) NOT NULL COMMENT 'Username',
  `role` VARCHAR(50) NOT NULL COMMENT 'User Role',
  `token_string` VARCHAR(512) NOT NULL COMMENT 'Auth Token',
  `issued_at` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT 'Issued Time',
  `expires_at` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT 'Expiration Time',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COMMENT='Authentication Tokens';

Tags: java SpringBoot Vue.js MySQL SystemDesign

Posted on Thu, 13 Aug 2026 16:15:27 +0000 by nut legend