音乐播放器 —— 测试报告

原创

已于 2025-02-26 14:58:38 修改 · 884 阅读

标签

#selenium #jmeter #测试工具

于 2025-02-26 10:28:33 首次发布

在这里插入图片描述

作者简介： zoro-1，目前大三，正在学习Java，数据结构等
作者主页： zoro-1的主页
欢迎大家点赞 👍 收藏 ⭐ 加关注哦！💖💖

项目简介

一. 项目背景

在数字化时代，音乐已深深融入人们的日常生活，其消费和传播方式也发生了显著转变。传统音乐播放方式逐渐向线上转变，越来越多的人希望能够通过方便的网络平台，在任何时间和地点享受丰富多样的音乐资源。为了满足这一需求，我们研发了一个在线音乐播放器项目，目标是为用户提供一个功能强大且易于操作的音乐播放和管理平台。用户将不再局限于本地音乐的存储，能够轻松地探索、播放和管理海量的音乐曲目。

二. 运用技术

（1）后端开发

Spring 框架：作为核心框架，Spring 提供依赖注入等功能，有效管理组件对象，解耦模块之间的依赖关系，提高代码的可维护性和扩展性。

SpringBoot：基于 Spring，SpringBoot 简化了项目的搭建和配置，通过自动配置让开发者专注于业务逻辑，显著提升开发效率，并便于项目的部署和运维。

Mybatis：作为数据访问层的核心，Mybatis 灵活地将 SQL 查询与 Java 代码映射，便于对 MySQL 数据库进行数据持久化，满足高效的数据访问需求。

SpringMVC：遵循 MVC 设计模式，SpringMVC 清晰分离前端请求与后端处理，负责处理各种 HTTP 请求，如用户登录和音乐查询，并将结果返回前端展示。

BCrypt 加密算法：BCrypt 用于加密存储用户密码，确保数据库中的密码安全，有效防止泄露导致的账号安全问题。

（2）前端开发

HTML：构建页面的基本结构，定义各个元素与布局，如音乐列表、用户登录和喜欢音乐列表等页面的框架。

CSS：用于美化页面样式，通过设置字体、颜色、背景和布局等属性，提升页面的视觉效果和用户体验。

JS：为页面添加动态交互功能，实现音乐播放控制、用户操作响应（如登录按钮点击、添加喜欢音乐）和数据验证，增强页面的交互性。

jQuery：简化 JavaScript 开发，提供丰富插件和简便操作方法，便于选择页面元素、绑定事件和实现动画效果，提高前端开发效率与代码简洁性。

Ajax：实现前端与后端的异步数据交互，允许在不刷新页面的情况下与服务器传输数据，如实时查询音乐和更新播放列表，提升用户体验的流畅性。

（3）数据库

采用 MySQL 关系型数据库存储数据，能够高效管理音乐信息（如歌曲名、歌手、音频文件路径）、用户信息（用户名、密码）和用户音乐喜好（喜欢的歌曲），确保数据的完整性、一致性与持久性，为平台的稳定运行提供有力支持。

三.项目功能

登录功能：用户通过已存在的用户名和加密后的密码登录，成功后跳转到音乐列表页。

音乐列表页：展示所有音乐信息，包括音乐名称和歌手。每个音乐行有播放、暂停、删除、喜欢三个功能按钮，并提供多选框以支持批量删除操作。

喜欢音乐列表页：布局与音乐列表页相似，提供取消喜欢音乐和返回首页的功能，支持对喜欢的音乐进行查询，但不支持批量删除。

上传音乐功能：用户在音乐列表页上传音乐，可输入歌手名。

四.功能测试

1.编写测试用例

在这里插入图片描述

2.具体功能测试

（1）正常登录（账号密码正常）

账号密码正常

（2）错误登录（密码错误）

=密码错误

（3）删除单个音乐

在这里插入图片描述

（4）批量删除音乐

在这里插入图片描述

（5）喜欢音乐

在这里插入图片描述

（6）上传音乐

在这里插入图片描述

（7）错误上传

在这里插入图片描述

（8）查询音乐

在这里插入图片描述

（9）取消收藏音乐

在这里插入图片描述

3.发现bug以及解决bug

（1）bug 1 ——密码错误状态下也可以正常登录

问题说明：这里我输入的密码是12345而数据库正密码是123456这里点击登录仍然可以正常登录，显然不符合需求。

在这里插入图片描述

解决问题：经过查看代码我发现是登录的接口逻辑出现错误，这里密码匹配不管有用吗成功返回的语句都是成功，显然是我复制是忘记更改返回值中的status和message值了应该为 return new ResponMessage<>(-1, “⽤⼾名或者密码错误”, userinfo);

在这里插入图片描述

修改bug后

在这里插入图片描述

（2）bug 2 ——上传文件为以ogg后缀的Word文件也可以上传

问题说明：上传文件需求的文件是以ogg为后缀的音频文件，这里可以上传以ogg后缀的Word文件，显然是不符合需求的。

在这里插入图片描述

解决问题:经过思考，发现是没有添加对ogg文件格式的筛选，只筛选了后缀名为ogg的。只能判断这个文件是否是以ogg为后缀名，不能判断这个文件是否真是ogg音频文件，所以我加了一个对ogg文件格式判断的函数。

   public static boolean isOggFileByHeader(String filePath) {
   
   
      File file = new File(filePath);
      if (!file.exists() || file.isDirectory()) {
   
   
         return false;
      }
      try (FileInputStream fis = new FileInputStream(file)) {
   
   
         byte[] buffer = new byte[OGG_HEADER.length];
         int bytesRead = fis.read(buffer);
         if (bytesRead == OGG_HEADER.length) {
   
   
            for (int i = 0; i < OGG_HEADER.length; i++) {
   
   
               if (buffer[i] != OGG_HEADER[i]) {
   
   
                  return false;
               }
            }
            return true;
         }
      } catch (IOException e) {
   
   
         e.printStackTrace();
      }
      return false;
   }

修改bug后

在这里插入图片描述

五.自动化测试

1.编写测试化用例

在这里插入图片描述

2.自动化测试代码编写

（1）创建空项目

① 添加依赖（pom.xml 文件）代码如下所示：

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>org.example</groupId>
    <artifactId>music_selenium</artifactId>
    <version>1.0-SNAPSHOT</version>
    <dependencies>
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-java</artifactId>
            <version>4.0.0</version>
        </dependency>
        <dependency>
            <groupId>io.github.bonigarcia</groupId>
            <artifactId>webdrivermanager</artifactId>
            <version>5.8.0</version>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>commons-io</groupId>
            <artifactId>commons-io</artifactId>
            <version>2.6</version>
        </dependency>
    </dependencies>
    <properties>
        <maven.compiler.source>17</maven.compiler.source>
        <maven.compiler.target>17</maven.compiler.target>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    </properties>

</project>

② 创建项目结构，如下图所示：

在这里插入图片描述

（2）创建测试用例工具类

创建 Utils 类，用它存放我们自动化代码中通用的方法，在这个类中我们要创建的方法如下：

创建驱动对象；

创建屏幕截图方法；

创建构造方法。

有关 Utils 类的具体代码及详细介绍如下所示：

package common;

import io.github.bonigarcia.wdm.WebDriverManager;
import org.apache.commons.io.FileUtils;
import org.openqa.selenium.OutputType;
import org.openqa.selenium.TakesScreenshot;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;

import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.time.Duration;

public class Utils {
   
   
    public static WebDriver driver;

    public static WebDriver createDriver()
    {
   
   
        if(driver == null)
        {
   
   
            WebDriverManager.chromedriver().setup();
            ChromeOptions options = new ChromeOptions();
            //允许访问所有的链接
            options.addArguments("--remote-allow-origins=*");

            driver = new ChromeDriver(options);

            //等待
            driver.manage().timeouts().implicitlyWait(Duration.ofSeconds(1));
        }
        return driver;
    }

    public Utils(String url)
    {
   
   
        //调用driver对象
        driver = createDriver();
        //访问url
        driver.get(url);
    }

    public void getScreenShot(String str) throws IOException {
   
   

        //     ./src/test/image/
        //