一、搭建项目运行的环境

（1）修改hosts文件

更改：C:\Windows\System32\drivers\etc目录下hosts文件

添加：127.0.0.1        www.easymall.com

（2）配置虚拟主机

在tomcat的conf/server.xml中配置一个新的虚拟主机

添加：<Host name="www.easymall.com"appBase="E:\web\www.easymall.com"></Host>

（3）映射虚拟路径

在E盘下创建一个www.easymall.com文件夹，文件夹是空的，但是必须创建，如果不配置，那么访问的就是默认的webapps目录。

（4）在eclipse中创建EasyMall项目

（5）虚拟主机关联EasyMall这个Web应用

先把工程部署到tomcat服务器上，tomcat文件夹里面会自动生成一个www.easymall.com文件夹，在文件夹里面创建ROOT.xml文件

创建：D:\Jave-Web\课前资料\tomcat\tomcat-7\conf\Catalina\www.easymall.com\ROOT.xml

添加：<Context docBase="D:\workspace-web\myeclipse\EasyMall\WebRoot" />

docBase指向的路径为D:\workspace-web\myeclipse\EasyMall\WebRoot

ROOT.xml可以将EasyMall配置成www.easymall.com虚拟主机的默认web应用

这种配置的情况下，在MyEclipse中不再需要发布EasyMall项目

因为发布项目默认是将EasyMall项目中的WebRoot文件夹发送到tomcat的webapps文件夹下，相当于为localhost配置一个web应用

二、将项目的页面导入，变成jsp页面

（1）导入资源

将这四个文件里面的文件复制到EasyMall工程里面

复制完成之后

（2）创建jsp文件

创建_foot.jsp, _head.jsp, regist.jsp三个文件，并将_foot.html, _head.html, regist.html文件中的内容对应的复制进去，并把index.html文件中的内容复制到index.jsp里面

然后删除所有html文件，只保留jsp文件

此时四个文件里面的内容

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>

<html>

    <head>

        <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />

        <link rel="stylesheet" href="css/index.css"/>

        <title>欢迎光临EasyMall</title>

    </head>

    <body>

        <div id="index">

            <div id="line1">

                <img src="img/index/banner_big.jpg"/>

            </div>

            <div id="line2">

                <img id="line2_1" src="img/index/adv1.jpg"/>

                <img id="line2_2" src="img/index/adv2.jpg"/>

                <img id="line2_3" src="img/index/adv_l1.jpg"/>

            </div>

            <div id="line3">

                <img id="line3_1" src="img/index/adv3.jpg"/>

                <img id="line3_2" src="img/index/adv4.jpg"/>

                <div id="line3_right">

                    <img id="line3_3" src="img/index/adv_l2.jpg"/>

                    <img id="line3_4" src="img/index/adv_l3.jpg"/>

                </div>

            </div>

            <div id="line4">

                <img src="img/index/217.jpg"/>

            </div>

            <div id="line5">

                <span id="line5_1">

                    <img src="img/index/icon_g1.png"/>&nbsp;&nbsp;500强企业 品质保证

                </span>

                <span id="line5_2">

                    <img src="img/index/icon_g2.png"/>&nbsp;&nbsp;7天退货 15天换货

                </span>

                <span id="line5_3">

                    <img src="img/index/icon_g3.png"/>&nbsp;&nbsp;100元起免运费

                </span>

                <span id="line5_4">

                    <img src="img/index/icon_g4.png"/>&nbsp;&nbsp;448家维修网点 全国联保

                </span>

            </div>

        </div>

    </body>

</html>

index.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>

<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />

<link rel="stylesheet" href="css/foot.css"/>

<div id="common_foot">

    <p>

        Copyright © 2011-2015 达内软件技术有限公司 版权所有 保留一切权利 苏B2-20130048号 | 京ICP备09062682号-9

        <br>

        网络文化经营许可证苏网文[2012]0401-019号

    </p>

</div>

_foot.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>

<link rel="stylesheet" href="css/head.css"/>

<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />

<div id="common_head">

    <div id="line1">

        <div id="content">

            <a href="#">登录</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#">注册</a>

        </div>

    </div>

    <div id="line2">

        <img id="logo" src="img/head/logo.jpg"/>

        <input type="text" name=""/>

        <input type="button" value="搜 索"/>

        <span id="goto">

            <a id="goto_order" href="#">我的订单</a>

            <a id="goto_cart" href="#">我的购物车</a>

        </span>

        <img id="erwm" src="img/head/qr.jpg"/>

    </div>

    <div id="line3">

        <div id="content">

            <ul>

                <li><a href="#">首页</a></li>

                <li><a href="#">全部商品</a></li>

                <li><a href="#">手机数码</a></li>

                <li><a href="#">电脑平板</a></li>

                <li><a href="#">家用电器</a></li>

                <li><a href="#">汽车用品</a></li>

                <li><a href="#">食品饮料</a></li>

                <li><a href="#">图书杂志</a></li>

                <li><a href="#">服装服饰</a></li>

                <li><a href="#">理财产品</a></li>

            </ul>

        </div>

    </div>

</div>

_head.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>

<html>

    <head>

        <title>欢迎注册EasyMall</title>

        <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />

        <link rel="stylesheet" href="css/regist.css"/>

    </head>

    <body>

        <form action="#" method="POST">

            <h1>欢迎注册EasyMall</h1>

            <table>

                <tr>

                    <td class="tds">用户名：</td>

                    <td>

                        <input type="text" name="username"/>

                    </td>

                </tr>

                <tr>

                    <td class="tds">密码：</td>

                    <td>

                        <input type="password" name="password"/>

                    </td>

                </tr>

                <tr>

                    <td class="tds">确认密码：</td>

                    <td>

                        <input type="password" name="password2"/>

                    </td>

                </tr>

                <tr>

                    <td class="tds">昵称：</td>

                    <td>

                        <input type="text" name="nickname"/>

                    </td>

                </tr>

                <tr>

                    <td class="tds">邮箱：</td>

                    <td>

                        <input type="text" name="email"/>

                    </td>

                </tr>

                <tr>

                    <td class="tds">验证码：</td>

                    <td>

                        <input type="text" name="valistr"/>

                        <img src="img/regist/yzm.jpg" width="" height="" alt="" />

                    </td>

                </tr>

                <tr>

                    <td class="sub_td" colspan="2" class="tds">

                        <input type="submit" value="注册用户"/>

                    </td>

                </tr>

            </table>

        </form>

    </body>

</html>

regist.jsp

（3）查看结果

启动tomcat服务器，打开谷歌浏览器，输入www.easymall.com，回车

三、在index.jsp中引入_head.jsp和_foot.jsp的内容

虽然浏览时看见页面，但是我们发现页面中只有index文件里面的内容，并没有_foot，_head两个文件的内容，此时我们要修改一下index文件

（1）修改index.jsp文件，引入_head.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" buffer="0kb" %>

<!DOCTYPE HTML>

<html>

    <head>

        <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />

        <link rel="stylesheet" href="css/index.css"/>

        <title>欢迎光临EasyMall</title>

    </head>

    <body>

    <!-- JSP的脚本片段，允许在jsp中执行java代码,引入_head.jsp中的内容 -->

    <%

        request.getRequestDispatcher("/_head.jsp").include(request, response);

    %>

        <div id="index">

            <div id="line1">

                <img src="img/index/banner_big.jpg"/>

            </div>

            <div id="line2">

                <img id="line2_1" src="img/index/adv1.jpg"/>

                <img id="line2_2" src="img/index/adv2.jpg"/>

                <img id="line2_3" src="img/index/adv_l1.jpg"/>

            </div>

            <div id="line3">

                <img id="line3_1" src="img/index/adv3.jpg"/>

                <img id="line3_2" src="img/index/adv4.jpg"/>

                <div id="line3_right">

                    <img id="line3_3" src="img/index/adv_l2.jpg"/>

                    <img id="line3_4" src="img/index/adv_l3.jpg"/>

                </div>

            </div>

            <div id="line4">

                <img src="img/index/217.jpg"/>

            </div>

            <div id="line5">

                <span id="line5_1">

                    <img src="img/index/icon_g1.png"/>&nbsp;&nbsp;500强企业 品质保证

                </span>

                <span id="line5_2">

                    <img src="img/index/icon_g2.png"/>&nbsp;&nbsp;7天退货 15天换货

                </span>

                <span id="line5_3">

                    <img src="img/index/icon_g3.png"/>&nbsp;&nbsp;100元起免运费

                </span>

                <span id="line5_4">

                    <img src="img/index/icon_g4.png"/>&nbsp;&nbsp;448家维修网点 全国联保

                </span>

            </div>

        </div>

    <!-- 引入 _foot.jsp中的内容-->

    <%

        request.getRequestDispatcher("/_foot.jsp").include(request, response);

    %>

    </body>

</html>

效果：

四、修改_head.jsp内容，让注册的超链接正常跳转  regist.jsp页面

此时页面布局正常了，但是点击注册按钮并不能弹出注册界面

需要修改_head.jsp文件

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML>

<link rel="stylesheet" href="css/head.css"/>

<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />

<div id="common_head">

    <div id="line1">

        <div id="content">

            <a href="#">登录</a>&nbsp;&nbsp;|&nbsp;&nbsp;

            <!-- 由于当前项目是虚拟主机的默认web应用，因此项目映射的URL应该是“” -->

            <!-- <a href="/EasyMall/regist.jsp">注册</a> -->

            <a href="/regist.jsp">注册</a>

        </div>

    </div>

    <div id="line2">

        <img id="logo" src="img/head/logo.jpg"/>

        <input type="text" name=""/>

        <input type="button" value="搜 索"/>

        <span id="goto">

            <a id="goto_order" href="#">我的订单</a>

            <a id="goto_cart" href="#">我的购物车</a>

        </span>

        <img id="erwm" src="img/head/qr.jpg"/>

    </div>

    <div id="line3">

        <div id="content">

            <ul>

                <li><a href="#">首页</a></li>

                <li><a href="#">全部商品</a></li>

                <li><a href="#">手机数码</a></li>

                <li><a href="#">电脑平板</a></li>

                <li><a href="#">家用电器</a></li>

                <li><a href="#">汽车用品</a></li>

                <li><a href="#">食品饮料</a></li>

                <li><a href="#">图书杂志</a></li>

                <li><a href="#">服装服饰</a></li>

                <li><a href="#">理财产品</a></li>

            </ul>

        </div>

    </div>

</div>

完成

EasyMall 项目记录-环境搭建的更多相关文章

  1. Eclipse+Tomcat+MAVEN+SVN项目完整环境搭建

    1.JDK的安装 首先下载JDK,这个从sun公司官网可以下载,根据自己的系统选择64位还是32位,安装过程就是next一路到底.安装完成之后当然要配置环境变量了. ————————————————— ...

  2. Eclipse4.6(Neon) + Tomcat8 + MAVEN3.3.9 + SVN项目完整环境搭建

    软件清单 jdk-8u102-windows-x64.exe eclipse-inst-win64.exe (Eclipse4.6 Neon) apache-tomcat-8.5.5-windows- ...

  3. Hadoop项目开发环境搭建（Eclipse\MyEclipse + Maven）

    写在前面的话 可详细参考,一定得去看 HBase 开发环境搭建(Eclipse\MyEclipse + Maven) Zookeeper项目开发环境搭建(Eclipse\MyEclipse + Mav ...

  4. Hive项目开发环境搭建（Eclipse\MyEclipse + Maven）

    写在前面的话 可详细参考,一定得去看 HBase 开发环境搭建(Eclipse\MyEclipse + Maven) Zookeeper项目开发环境搭建(Eclipse\MyEclipse + Mav ...

  5. SSM 框架-03-MyEclipse+Tomcat+MAVEN+SVN项目完整环境搭建

    SSM 框架-03-MyEclipse+Tomcat+MAVEN+SVN项目完整环境搭建 如果你是使用 Eclipse 你需要先安装 MyEclipse,请参考:SSM 框架-02-MyEclipse ...

  6. java项目测试环境搭建

    java项目测试环境搭建 2019-03-06 13:45:26 木瓜小少年 阅读数 691更多 分类专栏: 测试   版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原 ...

  7. Linux（三）—— 项目部署环境搭建

    目录 项目部署环境搭建 一.linux上网 二.rpm包管理 1.光盘挂载 2.安装卸载rpm包 3.查询是否安装 4.查看软件包 5.互相依赖关系的软件包 三.yum包管理 1.使用aliyun的y ...

  8. day76:luffy:项目前端环境搭建&轮播图的实现

    目录 1.项目前端环境搭建 1.创建项目目录 2.前端初始化全局变量和全局方法 3.跨域CORS 4.axios配置 2.轮播图功能的实现 1.安装依赖模块 2.上传文件相关配置 3.注册home子应 ...

  9. 我是如何进行Spring MVC文档翻译项目的环境搭建、项目管理及自动化构建工作的

    感兴趣的同学可以关注这个翻译项目 . 我的博客原文 和 我的Github 前段时间翻译的Spring MVC官方文档完成了第一稿,相关的文章和仓库可以点击以下链接.这篇文章,主要是总结一下这个翻译项目 ...

随机推荐

  1. vsftpd配置虚拟用户为登录用户02

    1.安装vsftpd 安装依赖包: yum -y install pam pam-devel db4 de4-devel db4-uitls db4-tcl 新建vsftpd系统用户: #建立Vsft ...

  2. 【Grails 代理Proxy设置】部署Grails遇到Error Resolve error obtaining dependencies:错误，及解决方法

    最近在使用Grails,一开始使用3.0.2版本,一直包nullpointer错误,后来使用了2.5.0版本,可以创建工程,但是在进入到工程目录后,再执行grails程序,报错了,步骤如下: 1. g ...

  3. STL标准库-Move对容器效率的影响

    技术在于交流.沟通,本文为博主原创文章转载请注明出处并保持作品的完整性 C++11新增move()语法(我暂时交错右值引用),在前面我有一篇文章叫 C++11_右值引用 简单的介绍了右值引用类的实现, ...

  4. PlistBuddy

    最近由于工作需要,发现了这么一个小工具. PlistBuddy是一个Mac里的命令行下读写plist文件的工具. 位于/usr/libexec/下,由于这个路径不在默认的PATH里,需要通过绝对路径/ ...

  5. 如何在win10（64位系统）上安装apache服务器

    今天装了Apache服务器,下面是我总结的方法: 一,准备软件 1.64位的apache版本 传送门:http://www.apachelounge.com/download/ 2.VC11运行库 下 ...

  6. SVM的新理解

    svm导出的原始问题然后利用KKT条件,为何还需要对偶空间? 一方面,实际上KKT条件怎么得到的?KKT条件的推导是:svm原始问题->极大极小问题(先算极小这步,但极小这步中α是有约束的,不好 ...

  7. matlab mod()&rem()

    一.介绍rem/mod(X,Y)当X,Y符号相同的时候,这两者一样,当符号不相同的时候才有差别,具体表现在rem结果的符号与被除数相同:mod结果的符号与除数相同 二.例子 >> a=9; ...

  8. I.MX6 make menuconfig OTG to slave only mode

    /****************************************************************************** * I.MX6 make menucon ...

  9. Texas Instruments matrix-gui-2.0 hacking -- helper_functions.php

    <?php # PHP_SELF: 但前正在执行脚本的文件名,与document root相关 # QUERY_STRING: 查询(query)的字符串 $cachefile = " ...

  10. Texas Instruments matrix-gui-2.0 hacking -- generate.php

    <?php /* * Copyright (C) 2011 Texas Instruments Incorporated - http://www.ti.com/ * * * Redistrib ...