IDEA创建MAVEN WEB项目图解

最新推荐文章于 2024-09-22 14:40:34 发布

guoyp2126

最新推荐文章于 2024-09-22 14:40:34 发布

阅读量1.5k

点赞数 5

分类专栏： springMVC简介文章标签： java web

本文链接：https://blog.csdn.net/guoyp2126/article/details/115896402

版权

springMVC简介专栏收录该内容

11 篇文章 0 订阅

订阅专栏

引言

尽管目前大多数WEB项目使用SpringMVC创建前后端完全分离项目，但servlet+bean还是基础，创建传统的Java web程序，有助于对基础的进一步夯实。
IDEA使用MAVEN 创建WEB项目时，由于MAVEN缺少archetype-catalog.xml文件，而导致创建工程失败。还有创建完工程后发现在main文件夹缺少Java源文件夹等问题，再此做一记录备忘

工程创建

打开IDEA工具，点击欢迎页中Create New Project按钮，进入下图对话框
在这里插入图片描述
按照图上标示1、2、3步骤完成后，点击Next按钮；

输入工程域名和工程名，点击下一步，进入如下目录，系统根据配置自动提取目录等内容

点击下一步，弹出对话框，如下图

完成工程创建，创建完成工程后，项目创建失败，提示
“NO ARCHETYPE FOUND IN REMOTE CATALOG. DEFAULTING TO INTERNAL CATALOG”
这个是本地仓库缺少“archetype-catalog.xml文件缘故，通过网上下载此文件，将下载好的文件解压，存放到本地仓库路径下，目录很深，如本地的目录仓库如下图：
在这里插入图片描述
设置maven配置，点击File—>Setting弹出对话框，如下：

在这里插入图片描述
再次重复创建maven web工程创建，点击finish完成工程创建，创建成功后，如下图所示：

完善WEB工程

工程创建完成后，发现在main文件下没有java源文件夹，
在这里插入图片描述
然后设置文件夹类型，java设置为Sources Root，resources设置为Resources Root，设置过程如下图所示

配置tomcat

tomcat安装及环境变量配置：https://www.cnblogs.com/HhNnanChangSha/p/13907264.html

点击菜单：Run—>EditConfigurations，打开界面如下图所示
在这里插入图片描述
点击Local后打开如下对话框

在这里插入图片描述
配置tomacat，完成后点击OK设置完成，在ideatoolbar显示，可运行程序，如下图所示

点击运行按钮（右侧绿色的三角符号），运行结果如下：

代表配置成功。但是注意看域名后跟“webapp_war_exploded”很丑陋，将其转换为项目名比较好，Run—>EditConfigurations，打开界面如下图所示
在这里插入图片描述
此时地址栏显示，路径为：localHost：8080/webapp，比好看多了

编写测试程序

在com.bjwl下创建controller和pojo两个包，分别存放servlet和实体类，如下图
在这里插入图片描述
controller包中创建StudentServlet 继承HttpServlet，代码如下：

public class StudentServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    }

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        List<StudentEntity> list = new ArrayList<StudentEntity>();
        StudentEntity student = new StudentEntity();
        student.setSno("1");
        student.setsAge(18);
        student.setsSex("男");
        student.setsDept("计算机学院");
        student.setsName("张三");
        list.add(student);

        StudentEntity student2 = new StudentEntity();
        student2.setSno("2");
        student2.setsAge(18);
        student2.setsSex("女");
        student2.setsDept("计算机学院");
        student2.setsName("李四");
        list.add(student2);

        request.setAttribute("data",list);
    request.getRequestDispatcher("./jsp/StudentList.jsp").forward(request,response);
    }
}

pojo包中创建实体类如下：

public class StudentEntity implements Serializable {
    private String sno;
    private String sName;
    private String sSex;
    private int sAge;
    private String sDept;
    
    public String getSno() {
        return sno;
    }

    public void setSno(String sno) {
        this.sno = sno;
    }

    public String getsName() {
        return sName;
    }

    public void setsName(String sName) {
        this.sName = sName;
    }

    public String getsSex() {
        return sSex;
    }

    public void setsSex(String sSex) {
        this.sSex = sSex;
    }

    public int getsAge() {
        return sAge;
    }

    public void setsAge(int sAge) {
        this.sAge = sAge;
    }

    public String getsDept() {
        return sDept;
    }

    public void setsDept(String sDept) {
        this.sDept = sDept;
    }
}

修改jsp代码，修改webapp根目录下index.jsp代码如下：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>欢迎页面</title>
</head>
<body>
<form action="student" method="get">
   <P>javaWeb测试</P>
   <input type="submit" value="查询" />
</form>
</body>
</html>

在webapp根目录下，增加jsp目录用于存放页面文件，创建页面文件StudentList.jsp，代码如下：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page import="com.bjwl.pojo.StudentEntity"%>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<html>
<head>
    <base href="<%=basePath%>">
    <title>学生列表页面</title>
</head>
<body>
<%
    ArrayList list = (ArrayList) request.getAttribute("data");
%>
<!-- 声明一个表格,这是表头 -->
<h2 align = "center">学生列表</h2>
<table border = 1px align = "center">
    <tr>
        <th>学号</th>
        <th>姓名</th>
        <th>性别</th>
        <th>所在院系</th>
    </tr>
    <!-- 继续使用jsp语句 循环放入存放于list中的Book实体类中的数据 -->
    <%
        for(int i = 0;i<list.size();i++){
            StudentEntity Student =(StudentEntity) list.get(i);%>
    <tr>
        <th><%=Student.getSno() %></th>
        <th><%=Student.getsName()%></th>
        <th><%=Student.getsSex()%></th>
        <th><%=Student.getsDept()%></th><br>
    </tr>
    <% }%>
</table>
</body>
</html>

配置web.xml文件，配置文件如下

<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
  <display-name>Archetype Created Web Application</display-name>

  <!--设置网站首页-->
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>

  <!--设置servlet-->
  <servlet>
    <servlet-name>StudentServlet</servlet-name>
    <servlet-class>com.bjwl.controller.StudentServlet</servlet-class>
  </servlet>
  <!--jsp页面与controller中servlet的映射关系-->
  <servlet-mapping>
    <servlet-name>StudentServlet</servlet-name>
    <url-pattern>/student</url-pattern>
  </servlet-mapping>
</web-app>

运行，点击下图中运行按钮
在这里插入图片描述
运行结果如下

点击查询按钮，打开如下页面

总结与问题

到此为止，我们使用maven创建了一个web项目，并使用servlet与前段的jsp页面完成了通讯。目前还存在好几个问题，一是前段页面很难看，我们可以使用css设置样式来完成，也可以使用UI框架，如easyui，可以轻松完成页面的美化。二是当前的页面并非是流行的前后端完全分离的，前后端分离我们可以借助SpringMVC框架来完成。三是配置很麻烦，我们也可以使用SpringBoot轻松解决。之所以这样做主要目的是为了了解WEB开发的工作原理。