《Web技术及应用》课程设计

Web技术及应用

期末课程设计报告

题目在线交友系统

班级：网络安全与执法班

学号：201483030127/111

姓名：刘洋郭建建

成绩：

完成时间：2017 年 6 月

目录

第一章引言 (1)

1.1开发背景 (1)

1.2开发现状分析 (2)

1.2需求分析 (2)

第二章系统设计 (4)

2.1 功能设计 (4)

2.2 数据库设计 (5)

2.3 流程（或算法）设计 (6)

第三章系统实现 (6)

3.1 交友系统 (6)

第四章设计总结 (10)

参考文献 (10)

附录（核心代码） (11)

在线交友系统

第一章引言

近年来,随着移动互联网的发展，人们的交流方式变得更加的开放。上网不在局限于电脑，手机的普及，让通信从电脑上迅速转移到手机上已是不争的事实。信息化是当今世界经济和社会发展的大趋势，以网络和多媒体为核心的信息技术已经成为拓展人类能力的创造性工具。在网上不在局限于时间地点，那里有我们最新观点，最具创意的Idea，最新的消息等。当然还有我们最美好的回忆。

在大学期间，我们每个人都有很多留恋的记忆。有游玩的风景，有采风的快乐。有寂寞无聊的时间，还有单独宅的时光。学习、成长、伴随我们走过这风风雨雨的三年。真的是风霜雨雪踏歌行。我们用各种形式来记住青春的童话。在快要告别大学的时光里，当我们回忆其这些，既是一笔财富，也是一份美好而简单的记忆。出于这个理由，我设计开发了这个交友平台。来分享你我他/她的喜怒忧伤。随着互联网，微博，博客等的兴起，交流变得随时随地，更加的人性化和自由。

本次设计为简单的一个社交平台，注册的用户可以分享自己的照片，Flash 视频，心情，交友等。可以查找好友，添加好友，。好友也能同步的看到你的心情，查看你的个人资料。当然也可以进行电话交流。都为交友提供一个很好的平台。这就交友平台开发的目的-----交流分享，共同成长。这也是“网络交友”的特点所在。

1.1开发背景

为了留一份美好回忆，为了更大范围的交友，不受时间和空间的限制。为了让我们共同成长。让我们在大学的校园中成长更加自由，分享我们成长的经历，交流进步。

1.2开发现状分析

网络交友平台是一个针对学生开发的交友的平台系统。在校园中，我们都渴望成长，渴望交流、渴望进步、渴望被关注。为了在这个纯洁的环境中实现更安静的交流，让我们的生活变得更加的丰富多彩。交流变得更加有意义。

这次的设计通过好友的添加来实现组建交友的圈子。这样就可以针对特定的人群进行交流。实现情感，生活，学习等的交流，学习和指导。并且，交友平台功能丰富，界面非常的简洁大方，操作简单。容易上手。

1.3需求分析

（一）可行性分析

1.技术可行性：交友平台的开发采用成熟的JSP技术，轻量级服务器Tomcat。利用MySql 5.5作为交友平台的数据库，是一个支持多用户的新型数据库，适应于中小型规模的数据量需求。因此，交友平台的设计与开发在技术上和配备上的条件都是满足的。所以，它在技术上是可行的。

2.经济可行性：由于设计的要求比较底，所以单独的服务器来运行这个系统可以满足。又考虑到所有计算机硬件软件都是存在出错可能的，因此整个系统应该考虑使用两台服务器热备份技术。使用两台服务器同时运行，一个为主一个作备份，这样可以避免服务器故障对整个系统的影响。另外，现在计算机的价格比较便宜，因此经济上市允许的。

3.操作可行性：交友平台设计界面简洁大方，操作流程方便。用户很轻松都能上手。

（二）性能分析

1.系统性能要求

①实用性：为方便交友平台，根据用户实际的需求，设计出功能齐全、操作简单、实用性强、充分满足用户的需求。

②操作简单：交友平台适应于不同程度的用户，同时系统界面简约大方，不会出现审美疲劳，因此对系统的操作要求是尽可能简单易行。

③安装使用简便：服务器端的安装简洁明了，客户机无需再装任何软件，通过浏览器就可以直接访问，可以直接接入Internet，无论您身在何处，只要您可以访问Internet 都可以使用交友平台。

④适应性：交友平台应用广泛，可以在Windows、Linux系统上安装使用。用户可以根据自己的实际情况自行组合，是系统在不同的操作系统下都能得以应用。

⑤代码可读性好：编写代码的要求是简洁，易懂。

2.主要功能要求

①主要功能：基本的用户注册、登陆、修改个人资料。文件的上传下载，浏览上传文件、查找好友、浏览好友资料、留言、关注等

②安全性与保密要求：客户端要求提供身份验证，并且对数据库信息采用加密，只允许通过身份验证的用户使用交友平台。

③意外情况：要求在发生意外（如掉电）的情况下，保证不丢失数据。

3.交友平台的数据流图

图1.1：交友平台数据流图

设计交友平台中采用成熟的MVC框架，前台用户对数据进行处理，包括登陆注册，搜索，下载等。服务器对请求行进动态处理，与后台数据库进行交互处理。处理的结果返还给用户。管理员实现对其管理，维护和更新。其详细功能说明流程图如上面图1.1所示。

（三）需求分析

1．设计目标

设计交友平台，功能上实现用户的交友功能，用户图片、Flash视频的上传和下载。让用户分享自己的照片，视频等信息。添加对方为好友，给对方留言，搜索等目标。实用在不同的操作平台运行，要求系统简洁大方，操作方便。

2．开发意图

交友更便捷，让用户分享网络互联带来的终极体验，让交友变得更加的丰富。同时也是分享成长的大舞台。

3．功能需求分析

交友平台主要完成以下功能：

①基本功能：提供用户的注册，登陆、修改个人信息、添加好友

②用户管理：对用户账号的管理。

③数据库管理：密码管理、数据管理、数据备份等。

④操作管理：整个系统要求操作简捷，方便用户使用。

第二章系统设计

2.1 功能设计

交友系统实现所有的用户注册、登陆和注销。

●非会员注册

●会员登录

●查看和修改个人资料

●上传图片

●浏览会员信息

●登录注销

普通会员对于功能的用例图如图2.1所示

图2.1普通会员对于功能用例图

2.2 数据库设计

数据库设计是系统设计中非常重要的一个环节，数据是设计的基础，直接决定系统的失败。如果数据库设计不合理、不完善，将在系统开发中，甚至到后期的维护时，引起严重的问题。根据系统需求，创建了2张表，如下所示：

1、成员表(user)：用于存放注册用户信息。

2、照片表(pic):用于存放上传照片信息。

图2.2

图2.3

表2.1用户表(friend_user)

2.3 流程（或算法）设计

图2.4系统流程图

第三章系统实现3.1 交友系统的实现

1.安装apache-tomcat-6.0.35 ,myeclipse 以及MySql 全部按默认路径安装

图3.1

图3.2

图3.3

使用MySql 创建数据库及相关列表语句如下：

create database friend default

charset utf8;

use friend;

create table friend_user(

id bigint primary key auto_increment,

username varchar(20) unique,

password varchar(10),

name varchar(20),

age int(3),

gender tinyint(1),

phone varchar(20) );

create table friend_pic(

id bigint primary key auto_increment,

picName varchar(100),

userId bigint);

drop table friend_user;

drop table friend_pic;

2.新建web project 项目格式如下

图3.4

3.打开MySql 在数据库中建表

图3.5

4.进行测试，在web Browser下输入测试登陆网址http://localhost:8080/friends/login.jsp

图3.6

注册用户

图3.7

用户名密码正确则会进入系统不正确会出现错误

图3.8

登陆成功进入系统

图3.9

查看交友信息

图3.10

图3.11

至此，交友系统完全实现

第四章设计总结

本系统不仅实现了要求的主要的功能，还实现了页面返回和退出系统的功能，页面返回只是简单的页面切换，而退出功能则是单独使用了一个servlet 来实现session的Invalidate()方法。除此之外，为实现图片上传时绑定用户id,使用了form的隐藏域，但由于此时form的enctype属性发生了改变，并不能通过键值对的方式获得传过来的参数，而是通过FileItem对象判断是否是普通的表单域，从而使用getString()方法来获得隐藏域中value的值。在实验过程中数据库的配置给了自己一组很大的压力，老是配置不成功，在经过让同学的帮忙下成功调试成功，测试完成。

刘洋：50%；郭建建：50%

参考文献

[1]、JavaWeb应用开发，蒋伟祥，清华大学出版设，2009

[2]、JavaScript 应用开发技术详解，王萍萍，科学出版社，2008

[3]、Servlet/JSP深入详解，孙鑫，电子工业出版社，2008

[4]、Tomcat与Java Web开发技术详解，封超、晁阳，清华大学出版社，2008

[5]、DreamweaverMX2004网页设计标准教材，王军，电子工业出版社，2007

[6]、软件工程与项目管理，何礼富，国防科技大学出版社2009.5.1

[7]、SQL Server数据库基础与实训教程，吕凤顺，清华大学出版社2006.9.1

附录（核心代码）

public class User {

private int id;

private String username;

private String password;

private String name;

private int age;

private int gender;

private String phone;

public int getId() {

return id;

}

public void setId(int id) {

this.id = id;

}

public String getUsername() {

return username;

}

public void setUsername(String username) { https://www.360docs.net/doc/967615789.html,ername = username;

}

public String getPassword() {

return password;

}

public void setPassword(String password) { this.password = password;

}

public String getName() {

return name;

}

public void setName(String name) {

https://www.360docs.net/doc/967615789.html, = name;

}

public int getAge() {

return age;

}

public void setAge(int age) {

this.age = age;

}

public int getGender() {

return gender;

}

public void setGender(int gender) {

this.gender = gender;

}

public String getPhone() {

return phone;

}

public void setPhone(String phone) {

this.phone = phone;

}

}

import java.sql.Connection;

import java.sql.DriverManager;

import java.sql.PreparedStatement;

import java.sql.ResultSet;

import java.sql.SQLException;

import java.sql.Statement;

import java.util.Properties;

public class DBUtil {

private static String URL = "";

private static String USERNAME = "";

private static String PASSWORD = "";

static{

try{

Class.forName("com.mysql.jdbc.Driver");

Properties pro = new Properties();

pro.load(DBUtil.class.getResourceAsStream("/db.properties"));

URL = pro.getProperty("url");

USERNAME = pro.getProperty("username");

PASSWORD = pro.getProperty("password");

}catch(Exception e){

e.printStackTrace();

}

}

//获取连接

public static Connection getConnection() throws SQLException{

Connection conn = null;

conn = DriverManager.getConnection(URL,USERNAME,PASSWORD);

return conn;

}

public static Statement getStatement(Connection conn) throws SQLException{ Statement stmt = null;

stmt = conn.createStatement();

return stmt;

}

public static PreparedStatement getPreparedStatement(

Connection conn,String sql) throws SQLException{

PreparedStatement pstmt = conn.prepareStatement(sql);

return pstmt;

}

//关闭连接

public static void close(Connection conn,Statement stmt,

ResultSet rs) throws SQLException{

if(rs!=null){

rs.close();

}

if(stmt!=null){

stmt.close();

}

if(conn!=null){

conn.close();

}

}

public static void close(Connection conn,PreparedStatement pstmt,

ResultSet rs) throws SQLException{

if(rs!=null){

rs.close();

}

if(pstmt!=null){

pstmt.close();

}

if(conn!=null){

conn.close();

}

}

}