OO音乐网站总结

发表于 | 分类于 ，

这是上学期学完SSM后，自己写的一个音乐网站，拿来练手用的。音乐网站的一些基本功能，基本实现了。但是有的功能，实现的方式比较麻烦，还能有改善的空间。马上准备面试了，所以打算重写看一下代码，以免时间长，忘记了 。

一、数据库

1. user(用户信息表)

存储基本的用户信息，用户名，密码，头像，网名。

2. song(歌表)、songsheet(歌单表)、sstos(歌单对应的歌表)

song：歌名，歌的地址，封面，歌曲播放的次数，歌手，所属专辑(这个我没弄)

songsheet：歌单名，创建歌单的用户，用户的id，封面，创建的时间

sstos：歌单id，歌曲id

3. 歌手表

因为我没有弄歌手的主页，所以歌手表很简单，就一个歌手的id，歌手名，歌手图片。

4. comentary(主评论表)、reply(从评论表)

当时弄这个评论回复的功能弄了好久，试了好几种方式，最后都实现不了，总是出问题，是评论显示的问题，就是我没有办法，让每条评论的评论显示在它的评论下。最后终于想到一个解决方案，建立一个主评论表，用来放每首歌下的显示的评论，或者说是评论歌曲的。然后建另外一个表，从评论表，用来放回复评论的，这个表里有一个属性，是回复的哪一个评论的id，这样，我就能把回复评论和评论相互对应起来，然后显示出来。总之，这个功能费了我很大的功夫。

comentary：主评论的id，评论的内容，评论的时间，评论歌曲的id，评论用户的id

reply：回复的哪一个主评论的id，回复的内容，回复哪个用户的id，回复用户的id，评论状态，评论哪条评论的内容

需要特殊说明一个属性，是r_status(评论状态)，这是用作消息提示功能的，根据这个的值，来判断这条评论是否被查看。

5. collectss(歌单收藏表)

用户id，歌单id

6. attention(关注表)

用户id,关注的人的id

二、业务功能

1. 评论提示功能

描述：当别人回复你的评论后，你的头像旁边的邮件，会显示别人给你评论的个数，然后你点邮件进去，这个个数会重新归为0。然后你可以在这个页面，查看别人给你的评论，然后进行回复。

主要实现：

1
2
3
4
5
6
7
8
<c:set var="mes" value="0"></c:set>
<c:forEach items="${replyList}" var="reply">
    <c:forEach items="${reply.userList}" var="ru">
        <c:if test="${reply.r_onid == user.id && reply.r_status == 1}">
            <c:set var="mes" value="${mes+1}"></c:set>
        </c:if>
    </c:forEach>
</c:forEach>

其实这就是个思路，主要是reply表里，建一个r_status属性。先判断被回复的用户id，是不是和登陆用户id相同，然后判断这个评论的状态是不是为1，为1的话就是还没有查看，这时就会给mes+1。然后显示。

2. 登陆注册功能

登陆注册功能使用了Bootstrap的模态框，点击右上方的登陆，跳出来登录框，进行登陆。注册在登陆框的下方，点击注册，登陆框会消失，然后弹出注册框。这是通过js来实现的。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function openLogin(){
    document.getElementById("win").style.display="";
}
function closeLogin(){
    document.getElementById("win").style.display="none";
}
function openReg(){
    document.getElementById("win").style.display="none";
    document.getElementById("reg").style.display="";
}
function closeReg(){
    document.getElementById("reg").style.display="none";
}
function returnLogin(){
    document.getElementById("reg").style.display="none";
    document.getElementById("win").style.display="";
}

这段代码，是用来控制，登陆和注册这两个模态框的互相切换，还用模态框的自由拖拽。当时给我整的有点头疼，总是出问题。

然后，注册的时候，有一个简单的前台验证。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function check() {
        var password = $("#userpass").val();
        var password2 = $("#password").val();
        if(password == password2)
        {
            $("#tishi").html("两次密码相同");
            $("#tishi").css("color","green");
            $("button").removeAttr("disabled","disabled");
        }
        else {
            $("#tishi").html("两次密码不相同");
            $("#tishi").css("color","red");
            $("button").attr("disabled","disabled");
        }
    }

3. 创建歌单和收藏歌曲

创建歌单这个功能很简单，就不说了。

收藏歌曲，这个当时我感到麻烦的地方，就是，在模态框里，通过ajax显示出用户所创建的歌单，然后在提交。

解决方法：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function getArticles(ele) {
            $(ele).empty();
            $.ajax({
                url:"${pageContext.request.contextPath }/ss/ajaxSongsheet.action",
                type:"GET",
                success:function (result) {
                    //console.log(result);
                    $.each(result.extend.songsheetList, function () {
                        var optionEle = $("<option></option>")
                            .append(this.ss_name).attr("value",this.ss_id);
                        optionEle.appendTo(ele);
                    });
                }
            });
        }

通过ajax,后台获取，然后前台展示。所以我感觉js是我的一个问题，目前掌握的还不够熟练。

4. 评论回复功能

这个功能折磨了我好久，我一直想用ajax做出那种异步的效果，js不好的我，让我在这个功能上探索了很久。

前面提到过，主要建立两个表，这样就能在打开歌曲页面的时候，将对歌曲的评论展示出来，然后在点击展开评论的时候，通过该评论的Id,查询出这条评论下的回复。麻烦的是取值和前台显示。

0%