商城项目实战25:前台系统工程搭建
来源:互联网 发布:maka页面制作软件 编辑:程序博客网 时间:2024/05/18 03:16
通过上文的学习,我相信大家已经实现了商品添加的功能,本文我将来教大家如何搭建前台系统工程。
我们先来看一下淘淘商城的首页,如下图所示。
我们再来看看淘淘商城的系统架构图,我们目前只是完成了后台管理系统和商品服务,还有很多都没有实现,淘淘商城首页的展示需要用到商城门户工程和内容服务工程,本文我们便来学习商城门户的搭建。
现在我们就来新建一个taotao-portal-web工程,该工程可参考taotao-manager-web工程来搭建哟!
首先点击【File】菜单选项,并在下拉框中选中【New】,接着点击【Other】,如下:
在输入框中输入maven,并选择Maven Project,如下:
点击【Next】,勾选Create a simple project复选框,如果你不打上这个勾,它会让你选择一个骨架,但骨架里面是没有pom这个模板的。
点击【Next】,出现如下对话框,在该对话框中定义maven工程的坐标,如下:
注意:taotao-portal-web工程的打包方式是war,且须依赖父工程。
最后点击【Finish】,taotao-manager-web工程就创建好了,但是新建的web工程由于缺少web.xml文件而报错,解决方法是在webapp目录下新建一个WEB-INF目录,并在该目录下新建web.xml文件,至于该文件的内容具体是什么,后面会具体给出,这里我们并不着急。
我们可参考taotao-manager-web工程的pom.xml文件来给taotao-portal-web工程添加相关依赖,如下所示,注意最下方tomcat插件工程配置的端口号是8082(因为8080和8081已经被占用了)。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
接着在src/main/resources目录下新建一个resource目录,并在resource目录下新建一个resource.properties配置文件,这个文件暂时保留为空,以后需要配置的时候可以在这个配置文件添加配置,如下图所示。
顺便在src/main/resources目录下新建一个spring目录,并在spring目录下新建一个springmvc.xml配置文件,springmvc.xml文件的内容如下。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
从springmvc.xml文件的配置中可以看到配置的Controller的扫描包是com.taotao.portal.controller,所以我们在src/main/Java目录下新建一个com.taotao.portal.controller包,如下图所示。
上面我们在webapp目录下新建了一个WEB-INF目录,并在该目录下新建了一个web.xml文件,那么该配置文件的内容是什么呢?web.xml文件内容如下,可以看到我们配置的拦截器拦截的请求是以.html
结尾的,我们可以称之为”伪静态”,之所以称为伪静态是因为我们可以把各种动态请求都写成以.html
结尾,实质上响应的依然是动态数据,但由于请求是以.html
结尾的,浏览器便认为要访问静态资源。SEO(搜索引擎优化)喜欢收录以.html
结尾的请求,从而有利于搜索排名。
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
下面把首页静态页面添加到taotao-portal-web工程当中,下面是我为大家提供的首页静态页面资源。
其中css、images、js直接放到webapp目录下,这点与taotao-manager-web工程不一样,原因是taotao-manager-web工程配置的拦截器拦截的是以/
结尾的请求,这样的话,我们可以通过配置资源映射来访问WEB-INF目录下的静态资源,但是现在由于拦截器拦截的请求是以*.html
结尾的,springmvc根本就不会去拦截静态资源,这样即使配置资源映射也不管用。因此放到WEB-INF目录下的话,将无法访问到这些静态资源,因此需要直接放到webapp目录下才行。
那么为何jsp文件夹要放到WEB-INF下面呢?这是因为我们在springmvc.xml文件中配置了视图解析器,指定了访问的jsp目录在WEB-INF目录下,因此要放到WEB-INF下。
- 1
- 2
- 3
- 4
- 1
- 2
- 3
- 4
下面我们来访问商城首页,在com.taotao.portal.controller包下新建一个IndexController类,@RequestMapping("/index")
注解表示拦截以index.html结尾的请求(因为在springmvc拦截器配置时我们配置了以*.html
结尾的请求将会被拦截)。但是我们用户的习惯是输入域名之后直接就可以访问官网首页,不能要求用户再输入index.html,因此我们需要在web.xml文件中配置一下。
web.xml文件中的<welcome-file-list>
配置的是默认的访问页(原来是index.jsp,现在是index.html),也就是请求过来后会默认访问index.html,由于这个页面并不存在,DispatcherServlet会处理该请求,这时由于请求是以index.html结尾了,因此满足了Controller层的拦截要求,接着便执行showIndex方法,返回”index”,由于springmvc.xml文件中配置了视图解析器,会自动在”index”的后面加上”.jsp”,这样请求便成了访问index.jsp,index.jsp是我们的商城首页,因此便可以访问到商城首页了。
下面我们便来启动taotao-portal-web工程,如下图所示。
弹出如下对话框,然后在Goals一栏中输入”clean tomcat7:run”命令,点击”Apply”,然后点击”Run”。
启动成功后,我们在浏览器地址栏中输入http://localhost:8082
即可访问到商城首页,如下图所示,现在中间广告位那块还没有实现,因此没有图片。
- 商城项目实战25:前台系统工程搭建
- 商城项目实战26:CMS内容管理系统工程搭建
- 学习淘淘商城第二十四课(前台系统工程搭建)
- 淘淘商城系列——前台系统工程搭建
- 淘淘商城系列——CMS内容管理系统工程搭建
- 商城项目实战31:solar服务器搭建、搜索功能实现
- 商城项目实战
- ssm-商城项目搭建
- 实战项目商城(第一天)
- 实战项目商城(第二天)
- 实战项目商城(第三天)
- 实战项目商城(第四天)
- 实战项目商城(第五天)
- 实战项目商城(第六天)
- 实战项目商城(第七天)
- 实战项目商城(第八天)
- 商城项目实战28:内容管理
- 框架 day77 涛涛商城项目-前台系统及门户搭建,JSONP解决跨域ajax请求
- js常用的4种截取字符串方法
- linux开机启动脚本的顺序
- 基于线性表的查找:二分查找-Binary Search
- 广告点击率预估是怎么回事?
- 关于STM32莫名死机的一些问题记录
- 商城项目实战25:前台系统工程搭建
- js,jquery获取父窗口,子窗口iframe的方法
- 分类-kaggle-titanic
- Kaggle房价预测进阶版/bagging/boosting/AdaBoost/XGBoost
- Node.js 8有哪些重要功能和修复?
- h5各种问题解决方案。
- 如何利用github打造博客专属域名
- Java中的集合关系图及常见操作
- 查看linux系统版本命令