MVC框架——基于java web简单开发
- 1214 次检阅

MVC框架——基于java web简单开发(作业)

我的JSP作业要求:

练习要求如下:
1.按照*.bmp做好客户端login.jsp文件
2.在客户端login.jsp文件中用javascript实现登陆验证,要求非空字符,非空对象等验证。
3.在服务器端口checkLogin.jsp文件中进行分类执行
1)学生用户:用户名为:本人姓名,密码为:本人学号,登陆成功后用response跳转到student.jsp页,输出个人信息。提醒:1.session应用;2.注意中文乱码处理。
2)管理员用户:用户名为:admin,密码为:admin,登陆成功后用jsp:forward跳转到student.jsp页,输出目前有多少人登陆服务器页面。提醒:application应用。
3)来宾账户:用户名为:guest,密码为:guest,登陆成功后输出“我来逛一圈,马上走!”。用超级链接跳转到客户端页。


MVC全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范,用于组织代码用一种业务逻辑和数据显示分离的方法。

哎呀,这些对我这个新手只能百度吧。

闲话少说了,下面开始手把手记录一下如何搭建MVC框架,作为例子,展示的是一个最(超级)简单的登录流程。

  • 第一步:创建项目

创建项目的工具我推荐MyEclipse,毕竟MyEclipse可以加载强大的插件,缺点就是吃资源->创建项目完毕之后,我们可以立刻启动项目。

启动项目完毕之后,MyEclipse自带的浏览器会向我们展示这么一个简单到不能再简单的页面

看到项目的文件结构,不难在WebRoot文件夹下找到名为index.jsp这一文件。浏览器所展示的页面,就是此文件经过处理过后的结果。

点开之后,修改<body></body>之间的内容,例如改成This is My MVC project.。重新启动项目后,告诉我你看到了什么。

好了,解决完页面来源问题之后,接下来就是解答为什么会展示这么一个页面的问题了。我们点WebRoot文件夹节点,再点击WEB-INF文件夹节点,找到web.xml文件并且双击打开,然后看看里面的内容

看到第7行的代码中的index.jsp,是不是觉得似曾相识呢?没错,它就是我们刚才一直在讨论的那个页面。这里设置的就是项目启动后浏览器展示的第一个页面,以后我们可以试着再WebRoot目录下添加一个HTML文件或JSP文件,然后将这里的index.jsp改成所添加的文件名,重新启动项目,你就会发现哪里就改成你的默认首页页面。web.xml文件,用处还不止一点,因为我自己也不怎么懂!哈哈哈

前面已经创建完项目了,那么下面一个步骤就是逐一新建在MVC框架中负责V(视图)、C(控制器)、M(模型)的对应文件。

  • 第二步:新建负责V(视图)的JSP文件

在文件夹Web-Root下新建名为login.jsp的JSP文件,代码如下:

提交的表单,action为"MyServlet/checkLogin",发出请求是post,具体请看代码

下面是login.css代码:

这个文件的文件名login.jsp。(建议初学者做完这个步骤之后先运行一遍项目,看看效果如何,再看看有没有出错的地方)

如果运行的效果如下图,那应该就没什么问题了。

所谓的V(视图),通俗地来讲,就是用户所看到的内容。具体到这个Java web项目,就是用户所看到的页面。

  • 第三步:新建负责C(控制器)的Servlet

首先,要在src目录下新建一个包,包名为MyServlet然后,再在该包下新建一个servlet文件,名为checkLogin,代码如下:

控制器(C)的作用,就是对流程的控制,接收视图传来的参数,交由模型进行处理,再根据处理的结果决定下一步的操作。具体到本项目,servlet接收jsp传来的参数username和password,交由user处理,根据返回的boolean结果跳转到登录成功(失败)的页面。

  • 第四步:修改web.xml文件,注册servlet并且建立action与servlet之间的映射。

前面说到,MyServlet.checkLogin会处理提交的请求,那么,为什么checkLogin会接收到这个请求呢?因为,我事先修改了web.xml文件,在里面添加了相应的代码。web.xml的完整代码如下:

看到关于action的那一行XML代码,是否想到了什么呢?没错,就是jsp表单中所定义的action。试着修改,看看会有什么效果?

  • 第五步:新建M(模型)的user文件

首先,在src文件下新建包,包名为Uers。然后在该包下新建class文件,名为user。

为了让读者,尤其是初学者更快地理解MVC,而不是将精力耗费在理解user以及数据库操作上面,我将user进行了尽可能的简化。代码如下:

  • 第六步:新建V(视图)中的另外几个JSP文件

代码如下:

 

  • 第七步:跑项目,看效果

(1)输入账号:admin,密码:admin 将会跳转到页面如下:

(2)输入错误的账号或错误的密码,将会跳转到页面如下:

其他的功能你可以去尝试!

下面是整个MVC的代码还有素材

点击下载


这是小菜鸟半小时的作品,就是一些效果那些老师没有要求所以我就简单的接收数据就OK了。这个MVC是无数据库版的,嗯尽情的喷我挑转页面没有CSS和HTML且都很垃圾!其实我真的挺垃圾的!好了我现在就洗洗睡了!晚安了我的基友们!

分享到:
, ,

这篇文章有9条评论

  1. 叶蕾
    NO:152 / 發布於 - 2016-11-19 #1 回复

    棒棒哒٩( ‘ω’ )و

  2. 广告已经屏蔽
    NO:154 / 發布於 - 2016-11-22 #2 回复

    装作看得懂的样子来评论下

  3. NO:155 / 發布於 - 2016-11-22 #3 回复

    又长又臭-

发表评论