【《基于Java的音乐网站的设计与实现》8600字（论文）】

基于Java的音乐网站的设计与实现摘要随着互联网和宽带上网的普及，音乐网站在中国异军突起，并且慢慢地渗透到人们的日常生活当中，极大丰富了人们的生活，让大家可以足不出户即可欣赏到自己喜欢的音乐，释放由于工作、学习而产生的压力，同时也提供了一个交流平台供广大喜爱音乐的用户使用。近几年，和国外音乐发展进程相比较，中国的音乐市场发展仿佛进入了低谷期。根据某报告研究显示，中国音乐网站市场的发展受到了很多阻碍，其中包括盗用歌曲和免费收听问题，版权不重视问题也是音乐网站发展路上的一大绊脚石。早几年，中国音乐网站产业与传统唱片市场的发展远远不如国外。但是与此同时，该报告分析指出，尽管中国音乐市场发展步伐较缓慢，但由于其潜在着庞大的意向用户群体，因此发展空间及方方面面都有待进一步的去提取和挖掘。音乐网站系统以JSP作为页面载体，后台数据库使用MySQL，在Windows环境下使用MyEclipse开发工具进行开发。前台主要实现了用户的登陆注册，音乐的上传、音乐下载以及留言等功能。后台主要用于对数据库的管理，实现管理员对音乐的删除、管理用户留言、以及对歌曲评价打分等多项功能。关键词：音乐网站；结构化；MySQL数据库；SpringBoot；目录TOC\o"1-2"\h\z\u1绪论 11.1课题研究的目的与意义 11.2国内外现状 22系统开发环境和技术 22.1开发环境介绍 22.2后端开发技术介绍 32.3前端开发技术介绍 53系统分析 73.1需求分析 73.2可行性分析 74详细设计 84.1功能分析 84.2后端项目构建 105系统实现 185.1用户注册 185.2网站首页 195.3歌单信息 205.4歌单评分 205.5歌手信息 215.6歌词详情 235.7歌曲收藏 235.8修改个人信息 245.9后台管理 256结论 28参考文献 29PAGE01绪论随着网络技术以及计算机日新月异的发展，人们也逐步进入到计算机网络这个范围。我们现在生活的时代是充满科技感的时代，越来越多的人学会利用更加便捷的工具来达到自己的需求。除了日常生活，更多的人开始关注自己的精神世界，通过满足精神需求来放松自己。音乐网站、娱乐网站等就在这样的环境下迭代更新，而制作一个紧跟时代的音乐网站需要用到新的网络技术去支持，除了基础的听歌功能，也要包含强大的搜索、留言、下载等功能。1.1课题研究的目的与意义计算机网络是多学科相互结合之下的产物。目前，网络的发展日新月异，城域网、局域网，还有各种企业网、校园网。这些网络越来越能满足人们对带宽的要求，于是人们不再满足于单调的文字或者图像，而希望能在网上传输或者分享音乐以及快速找到自己感兴趣的音乐。音乐网站应运而生，宽带音乐点播是一种受用户控制的音乐分配业务，它使每个用户都能享受到音乐服务，即使在不同地理位置或者在不同时间，用户也可以不拘泥于特定的条件而享受到音乐，并且是快速、自由、方便地获取到所需要的信息。在线播放音乐系统是由网站的形式实现的，喜爱音乐和创作的人是音乐网站的服务对象。做一个音乐网站，需要用到计算机技术、多媒体技术、数据库等多项技术，这也使得多项技术有了更广泛的运用。和传统的磁带或者收音机相比，数字化、便利性和互动性等都是在线音乐网站的优点。这也是有需求的用户自动去寻找和获取多媒体信息的过程，这种过程可以推动在线网站的发展，越来越能满足更多用户更深层次的需求。不管是国内还是国外，音乐网站都焕发出了蓬勃生机，不仅在各领域的应用十分广泛，也显示出强大的生命力。1.2国内外现状国际音乐网站市场已经有了许多发展强劲、实力雄厚的音乐品牌及周边，IPod、Microsoft、Sony、Napster、eBay、RealNetworks等等都是人们耳熟能详且十分信任的品牌，发展势头可谓是如日中天，更是抢占了音乐网站市场的大部分资源，地位也不容小觑。与此同时，由于国人对苹果模式的盲目跟风以及对版权的不重视，中国的音乐网站市场迈入了黑暗中，不知何时能找到出路。然而，如今的中国音乐市场早已焕然一新，依靠着互联网、多种媒介和传统媒体的相互融合，中国的音乐网站早已不似从前那样简易单调，而是从内容到模式，从原创到版权都已赶上了国际的步伐。从用户角度来看，越来越多的用户使用中国的音乐网站，并且愿意去支持中国的音乐网站。除了传统的广告以外，按曲收费、下载收费、包月收费、全年会员等等也越来越得到用户的习惯与接受，大家对于版权的意识也越来越强。中国音乐网站的发展不仅走出了黑暗，还走出了属于自己的路。2系统开发环境和技术2.1开发环境介绍(1)JDK介绍JDK是一个程序开发环境，它用来写Java的applet和应用程序，由一个处于操作系统层之上的运行环境还有开发者编译，其一个显著特点是随着Java版本的升级而升级，是一个主要用于移动设备、嵌入式设备上的Java应用程序。(2)MySQL介绍MySQL是一个传统的关系型数据库产品，是最流行的关系型数据库管理系统之一。MySQL具有开放式的架构的特性，这使得用户有更多样性的选择。并且，由于社区开发和维护人数众多，MySQL的功能更加稳定，性能也更加卓越。在

Web应用方面，MySQL是最好的关系数据库管理系统应用软件之一，它的特点不是将所有数据放在一个大仓库内，而是将数据保存在不同的表中再放入不同的数据库中，这样的设计增加了MySQL的读取速度，灵活性和可管理性也得到了很大提高。(3)Node介绍Node的正式名称为Node.js，是基于ChromeJavaScript运行时建立的一个平台。当用户需要创建一个快速可扩展的网络应用时，它就起到了很大的作用。Node.js是服务器端JS的代码解析器，Node.js可以解析和应用存储在服务器端的JS代码。Node.js也提供了一个交互式的运行环境，JS可以通过这个环境立即执行JS代码。Node.js的官方还提供了很多模块，这些模块分别可以实现一种功能。npm是Node.js的包管理工具，npm定义了包依赖关系标准，我们使用npm主要用来下载第三方包和管理本地下载的第三方包。(4)IDE介绍IDE的中文称为集成开发环境，早期的IDE并不是什么主流工具，当它开始在主机或终端机开发程序时，才渐渐的成为必要的工具。IDE是一个辅助程序员开发的应用软件，它有很多不同的技术和业务用例，这说明有很多专有和开源的IDE供我们选择。IDE有很多优点，比如节省我们的时间和精力，其次它可以建立一个统一的标准，最后它还可以管理开发工作。2.2后端开发技术介绍(1)SpringBootSpring是一个开源框架，而SpringBoot实际上就是一个启动Spring项目的工具，简单来说，它是一些库的集合，也可以说，它是一个包含了许多东西的大框架，其中Spring就是最核心的内容之一。SpringBoot有四个主要特性，第一个是SpringBootStarter，第二个是自动配置，第三个是命令行接口，最后一个是Actuatir。SpringBoot的目的就是简化Spring项目的搭设和开发过程。(2)MyBatisMyBatis的前身叫iBatis，本来是Apache的一个开源项目，后来迁移到了googlecode，同时改名为MyBatis。MyBatis是一个优秀的持久层框架，它支持普通的SQL查询、存储过程以及高级映射。MyBatis本身很小而且简单，不用依赖第三方，所以它简单易学并且非常灵活。MyBaits功能架构可以分为三层，分别是API接口层、数据处理层和基础支撑层。2.3前端开发技术介绍(1)Vue介绍Vue.js是三大主流前端框架之一，也是目前非常火的一个前端框架，作为一个友好、高性能且多用途的JavaScript框架，它是渐进式的，它使网页变得越来越强大和动态化。换句话说，如果你有一个已经存在的服务端应用，那就可以把Vue作为该应用的一部分嵌入其中,这会给你带来更加丰富的交互体验.而且Vue有一个特点即被设计成自底向上的逐层应用,因此它非常容易上手和学习,且容易和第三方库或者既有的项目整合。(2)Vuex介绍Vuex是一种状态管理模式，是一种可以实现组件全局状态数据管理的机制，可以很方便的实现数据共享。它是专门为Vue.js应用程序开发的，换句话说，它就是一个加强版的data。如果我们需要构建一个中大型的单页面应用程序，我们就可以使用Vuex帮助我们在组件外更好的统一管理状态。并且存放在Vuex中的数据都是响应式的,能够实时保持数据与页面的同步。状态管理模式即状态自管理应用包含状态、视图和操作。以下是一个表示“单向数据流”理念的简单示意：图2.1单向数据流但是，“单向数据流”仅仅适用于一个组件的情况，在多个组件共享状态时，单向数据流就做不到如此简洁明了了。当多个视图依赖于同一状态或者来自不同视图的行为需要变更同一状态时，我们就需要思考，如果把组件的共享状态抽取出来变成一个全局的单例模式管理会变成什么样呢？在这种模式下，我们的组件树会变成什么样？图2.2全局视图(3)Axios介绍Axios是一个基于Promise的网络请求库，而Promise主要用来解决异步问题。简单来说就是,当程序员习惯于同步思考时,异步对于他们就变得很困难,从而导致代码一层嵌套一层变得无比复杂，或者当图片加载时由于图片大小不同出现堵塞的情况，Promise就可以解决这些问题。而Axios主要是用于向后台发起请求，可以用于浏览器和node.js。Axios的使用非常简单,并且尺寸小、提供易于扩展的接口。(4)ElementUI介绍Vue中的ElementUI是基于Vue封装实现的一套UI组件库，并且它是不依赖业务的，同时它也是一个桌面组件库，能提供多种多样的PC端组件，还可以减少用户对常用组件的封装，从而降低开发的难易程度，提高重用性原则，因此非常受用户的欢迎。3系统分析3.1需求分析随着生活条件的普遍改善，大众对于精神需求的满意度是日益提高的，一个质量高的音乐网站无疑会收到大众的欢迎。再加上国内外的音乐网站五花八门、争奇斗艳，设计一个功能完整、操作简单的音乐网站能提高市场的活力，给用户更多的选择。3.2可行性分析(1)技术可行性目前做网站需要用到的工具已经日渐成熟，例如html用来创建网站结构；css用来修饰网站样式；javascript用来制作网站特效；JSP用来实现网站业务逻辑；数据库用来存放网站技术；服务器可以使网站上线。而本系统后端采用SpringBoot+MyBatis,前端采用Vue+Vue-Router+Vuex+Axios+ElementUI，都是可以在网络上找到教程的技术，我们先去了解这些技术的背景及应用，将所需软件安装到电脑上，再通过大量教程学习使用。(2)经济可行性一个没有经济支撑的系统难以开发成功，而一个音乐网站的收益来源于用户，比如歌曲播放量，包月、包年会员还有付费歌曲下载和歌单购买等。这些收益足以支撑网站的开发，且收益是源源不断的，只要网站仍在运营且不断维护，收益就远远大于开发网站所需成本。因此，从经济角度看，开发此音乐网站是可行的。(3)操作可行性对于网站受众即广大用户来说，网站操作是简单明了的。新用户只需注册登录，就能到达音乐网站主页面。主页面包括搜索、歌单、榜单、歌手、个人信息等，用户只需要简单操作便能掌握音乐网站的所有功能。4详细设计4.1功能分析此次音乐网站的设计旨在提供一个免费、开放、便利的音乐交流平台，对于一个网站，我们需要一个固定的服务器让用户可以进行访问。用户的访问也会在系统中留下记录，以便后台管理员进行相关操作，也可以根据用户行为猜测用户行为，改善和调整相关功能，还可以根据一些情况来增加其他管理员对音乐网站进行管理。以下是音乐网站的完整功能：用户登录注册用户通过登录注册获得浏览和使用网站资格，用户界面可以进行信息编辑，比如昵称和头像的修改，而后续的打分、评论歌曲功能也只有已登录的用户可以使用；歌曲、歌单搜索在我看来，一个音乐网站最重要，也是用户比较在意的一个功能就是强大、贴心的搜索功能。当想不起来一个歌手或者一首歌曲的全名时，用户只需要输入歌手或者歌曲的其中几个字，底下就会出现尽可能全面的相关信息，帮助用户尽快找到所需要的信息，这样会增强用户的体验感，也会让用户对拥有这样强大搜索功能的音乐网站形成依赖，帮助网站留住用户、吸引更多客户。(3)歌曲打分、评论这是音乐网站较新颖的功能，每个用户都可以对多首歌曲进行打分，表达自己对该歌曲的喜爱程度，形成歌曲排行榜以便没有听歌目标的用户也能快速找到符合大众口味的好听歌曲。而评论功能则设计在每首歌曲里面，用户在听歌时可以点开评论了解歌曲背景和其他人对歌曲的评价，找到与其他听歌人的共鸣。(4)歌单列表、歌手列表分页显示这个功能极大方便了用户，可以对歌单和歌手分别进行搜索，大大加快搜索速度，达到自己的目的。(5)歌词同步显示这是每个音乐播放器都必须带的功能，当播放一首歌曲时，歌词同步滚动显示，还能随时根据歌词暂停歌曲。(6)音乐收藏、下载、音量控制当用户听到一首歌并且很喜欢时，可以一键收藏音乐，方便下次快速找到，而下载功能可以让用户在没有网络时也可以收听音乐，同时可以通过控制音量找到最合适的听歌氛围和节奏。(7)后台对用户、歌曲、歌手和歌单信息的管理后台管理员对整个网站拥有最高管理权，可以修改用户信息，还有歌曲、歌手和歌单信息。比如曲库的更新，对注册过的用户进行删改还有对歌手的分类管理等。图4.1功能模块图4.2后端项目构建(1)创建数据库表一个音乐网站需要提供大量的音乐信息给用户，并对这些信息进行管理，数据库是该系统的核心和基础。我们需要将系统中的信息按照某种特定的模型组织起来，以便后台管理。因此，数据库在整个音乐网站中起着重要的作用，是整个系统应用的根基。图4.2创建数据库表(2)创建项目打开idea，新建一个项目，在new一个新项目的时候，选择SpringInitialize，在选择项目依赖的时候勾选Web下的SpringWebStarter和SQL下的MySQLDriver和MyBatisFramework，然后我们就会得到三层结构。(3)配置文件=1\*GB3①perties配置perties文件，用于连接数据库。=2\*GB3②generatorConfig.xml利用MyBatisGenenrator自动生成代码（实体类，Mapper接口和Mapper.xml文件），需要指定

mysql-connector-java

（

src/main/resources

目录下）和生成文件的路径。在

src/main/resources

目录下创建

generatorConfig.xml

文件并配置。=3\*GB3③Pom.xmlpom.xml

文件负责配置项目相关的依赖和插件，包括上面的MyBatisGenerator（项目plugins标签中注视掉的代码是对Mybatis-generator插件的配置），在创建项目时，idea已经帮我们引入了一些依赖，下面我们需要在dependencies标签中引入项目需要的一些依赖，配置的代码可以直接看代码，下面对主要依赖进行下描述：表4-1对主要依赖的描述package说明Mybatis-spring-boot-starterMyBatis核心ForSpringBootMySQLconnector-JavaJava与MySQL连接的jar包驱动程序Fastjson实现json对象与JavaBean对象的转换在plugins标签中对Mybatis-generator进行配置，用于自动生成代码。至此，项目的配置就弄完了，在命令行执行

./mvnwmybatis-generator:generate

自动生成代码，得到的项目结构如下所示。此时会看到多生成了

dao、domain、mapper

目录及下面的文件。生成项目后，需要将上面

pom.xml

文件中Mybatis-generator插件的配置注释掉，因为这个文件就是初始时候自动生成代码用的，如果不注视每次运行都会再生成一次，即覆盖之前的代码。(4)测试创建好项目之后先测试一下，首先在

src/main/java/com/example/demo

目录下创建service包，service包下创建ConsumerService接口和impl包，impl包下创建ConsumerServiceImpl类。=1\*GB3①ConsumerService接口的代码如下Packagecom.example.demo.service;Importcom.examole.demo.domain.Consymer;PublicinterfaceConsumerService{booleanaddUser(Consumerconsumer);}=2\*GB3②ConsumerServicelmpl类的代码如下：Packagecom.example.demo.service.impl;Importcom.example.demo.dao.ConsumerMapper;Importcom.example.demo.domain.Consumer;Importcom.example.demo.service.ConsumerService;Importorg.springframework.beans.factory.annotation.Autowired;Importorg.springframework.stereotype.Service;@ServicePublicclassConsumerServiceImplimplementsConsumerService{@AutowiredprivateConsumerMapperconsumerMapper;@OverridepublicbooleanaddUser(Consumerconsumer){ReturnconsumerMapper.addUser(consumer)>0?True:false;}}=3\*GB3③打开SpringBoot的启动类，加上@MapperScan注解，指向dao层接口所在的包路径。@MapperScan(“com.example.demo.dao”)=4\*GB3④然后在

src/test/java/com/example/demo

下的测试文件中写测试代码，没有提示错误，且数据库中成功存入数据，说明项目构建成功，接下来就可以开始写接口了。(5)开发接口以下对项目层次做一下介绍，主要根据

domain、DAO、Service、Controller这几层主要实现的功能和它们之间的联系进行介绍。=1\*GB3①实体类:实体类就是一个拥有Set和Get方法的类，通常和数据库联系在一起。实体类就是一个载体，通俗点来说，即一张表里的一个类或者一条记录中的一个对象。=2\*GB3②Mapper层/DAO层:数据操作层向数据库发送SQL语句，完成数据库操作。分为Mapper接口和Mapper接口映射文件。Mapper接口在dao目录下，定义操作数据库的函数（函数不能直接去进行CURD），Mapper接口映射文件在mapper目录下，完成对数据库的访问。=3\*GB3③Service层:服务层完成业务逻辑处理，调用Mapper层操作数据库，分为Service接口+Service实现，用面向接口的编程思想，方便后续功能。=4\*GB3④Controller层:控制层对请求和响应进行控制，调用Service层进行业务逻辑处理，最后将处理好的数据返回给前端。访问的接口由Controller层来处理，所以，要返回所有用户的信息，把它当成一个命令，交给Service层去做，这样，一个返回所有用户信息的接口就写完了，打开Terminal输入如下:./mvnwspring-boot:run在浏览器中输入查看结果图4.3查看结果(6)总结当前段要访问数据的时候后端就提供相应接口，接口的编写是通过Controller层监听请求，数据的处理交给Service层，而Service层再通过Mapper层操作数据库，操作完成后数据再一层层往上走，最后返回给前段。图4.4最终项目结构(7)客户端项目构建直接用官方提供的脚手架，运行如下命令先全局安装vue，然后进行安装npminstall–g@vue/cli#进要创建项目的地方vuecreatemusic-client=1\*GB3①安装好后进入项目，执行如下命令：npmrunserve图4.9执行命令进入App=2\*GB3②管理端最终项目结构图4.10管理端最终项目结构5系统实现5.1用户注册 用户可以在本网站进行注册，成功后便拥有了网站账号，可以进入网站首页进行一系列操作，包括修改个人资料、搜索歌手或歌单、下载歌曲等等。图5.1用户登录界面5.2首页网站首页丰富多彩、吸人眼球又简洁明了，功能板块分布合理，让用户一眼就能看到自己想要的功能模块，给用户提供了极大的便利。首页界面通常是近期较流行的歌曲或MV及比较经典的歌曲。图5.2首页界面5.3歌单信息歌单分类通过歌曲种类、语言、乐器等来完成，帮助对歌曲有着不同喜好的用户快速找到自己喜欢的音乐，也方便了后台管理员的管理。图5.3歌单界面5.4歌单评分用户通过对歌单评分来抉择出热门歌单，这样能让新用户快速找到高质量、符合大众审美的音乐。同时，打分功能可以增加用户参与感，拉进用户与音乐网站的亲密关系，来达到留住更多老用户的目的，也能吸引更多新用户参与进来为自己喜欢的歌单打分。图5.4歌单评分5.5歌手信息歌手信息分为全部歌手、男歌手、女歌手和组合歌手。这样清晰明确的分类深受广大用户的喜爱，不仅帮助用户节省了搜索时间，也大大方便了后期网站维护时后台管理人员的工作。当你找到某个感兴趣的歌手时，点开头像便是歌手详细信息，并且详细信息下方就是歌手的作品。这样的设计更是方便了用户，节省了用户时间，通常我们将这样的设计称为人性化设计。图5.5.歌手界面图5.6歌手具体信息界面5.6歌词详情当你听某首歌曲时，点开歌曲就能到达歌曲详情页，详情页显示歌词和评论。图5.7歌词界面5.7歌曲收藏当用户将自己喜欢的歌曲收藏起来时，歌曲便会出现在我的收藏里，帮助用户快速找到自己喜爱的歌曲，收藏的歌曲不仅显示歌手还显示歌曲所属专辑。图5.8收藏界面5.8修改个人信息用户可以在设置中修改个人信息，例如修改头像等。图5.9修改信息界面5.9后台管理5.9.1管理后台数据从统计结果来看，女性用户数量远远多于男性用户。从歌单播放量统计结果来看，华语歌单播放量占比最大，其次是欧美、日韩和轻音乐。后台管理员通过这些后台数据可以及时调整网站结构、更新编辑歌单。图5.10后台数据5.9.2管理用户信息添加、删除和修改用户信息。图5.11管理用户信息5.9.3管理歌手信息添加、删除、更新和修改歌手信息，还可以管理歌手的所有歌曲。图5.12管理歌手信息5.9.4管理歌曲信息例如更新歌手照片、增加删除歌曲所属专辑歌单等等。图5.13管理歌曲信息5.9.5管理歌单给歌单进行分类，编辑删除歌单等等。图5.14管理歌单信息6结论经过一个多月的努力，论文终于告一段落，这也代表我的大学生活接近了尾声。在写论文的过程中，我是既痛苦又欣慰的。痛苦的是找文献、装软件和纠错代码的过程，但是在痛苦之余，学习会带给我更大的喜悦。软件的成功安装、代码一个错误的成功解决以及了解到一项技术的正确使用，这些都是很大的收获。在我看来，仅凭借本科的有限知识，音乐网站并不好做，尽管相关技术已经非常成熟，但仍需要花大量时间去寻找教程并且尝试着实现出来。在开始论文之前，我一度对它不以为然，以为和寻常的大作业一样，殊不知后来它会耗费我极大地心血。在写论文的过程中，我遇到了一系列的问题。首先是论文的选题，在没有选题范围的情况下，我参考了网上关于计算机方面的论文选题。在大概了解了它们的难度后，我选择了现在的选题。之后遇到的问题就是如何找到论文的切入点。最开始，一篇论文模板摆在我面前我却不知如何下手，无奈之下我只能先写了致谢。后来参考了几篇论文后，我慢慢找到了方向，先把绪论、国内外现状写好了。然后我就开始着手研究网站该如何做，到处去找教程学习。安装软件过程中也遇到了很多问题，我不停的百度问有经验的同学，一样样的去解决问题。后来就是改错问题，代码总是无缘无故出现很多错误，往往刚刚改好一个错误，便又多出好几个其他的错误。每每这个时候我都会懊恼本科学习期间不够认真、没有再多敲几行代码、没有多解决一些问题。好在路是一步步走的，只要脚踏实地。随着时间过去大半，论文也基本上完成了。认真严谨、实事求是的学习态度，坚持不懈、不怕困难的精神是我在这次毕业设计中最大的收获。这不仅仅是对意志的磨练，也是对我实际能力的一次提升。希望在往后的学习或者工作中，也能继续延续勇往直前的精神。参考文献[1]袁庆龙，侯文义.Ni-P合金镀层组织形貌及显微硬度研究[J]．太原理工大学学报，2001，32(1)：51-53.[2]姜静,孙立权.在线音乐网站系统的设计与实现[J].计算