eclipse 开发jsp教程-建站教程-锦华智联科技

Eclipse JSP 开发完整教程

本教程将引导你完成以下步骤：

（图片来源网络，侵删）

环境准备: 安装并配置所需的软件。
创建项目: 在 Eclipse 中创建一个动态 Web 项目。
编写代码: 创建并编写你的第一个 JSP 页面。
部署与运行: 将项目部署到 Tomcat 服务器并运行。
进阶示例: 创建一个简单的表单交互页面，展示 JSP 的动态能力。

第一步：环境准备

在开始之前,你需要安装以下三样东西：

JDK (Java Development Kit): JSP 最终会被编译成 Java 代码，所以需要 JDK，推荐使用 JDK 8 或更高版本。
- 下载地址：Oracle JDK 官网或 OpenJDK 官网
Eclipse IDE for Enterprise Java and Web Developers: 这是 Eclipse 的一个专门版本，内置了对 Web 开发（包括 JSP）的良好支持。
- 下载地址：Eclipse 官网
- 在下载页面选择 "Eclipse IDE for Enterprise Java and Web Developers"。
Apache Tomcat: 一个轻量级的 Web 应用服务器，用于运行你的 JSP 应用。
（图片来源网络，侵删）
- 下载地址：Apache Tomcat 官网
- 下载 "Core" 下的 "zip" 压缩包即可（apache-tomcat-9.0.x.zip），无需安装，解压即用。

环境变量配置 (可选但推荐):

JAVA_HOME: 设置为你的 JDK 安装目录。
CATALINA_HOME: 设置为你的 Tomcat 解压目录。

第二步：在 Eclipse 中配置 Tomcat 服务器

这是最关键的一步,让 Eclipse 知道去哪里找你的 Tomcat 服务器。

打开 Eclipse，点击顶部菜单栏的 Window -> Preferences (在 macOS 上是 Eclipse -> Settings)。
在弹出的窗口中,导航到 Server -> Runtime Environments，然后点击右侧的 Add... 按钮。
（图片来源网络，侵删）
在弹出的窗口中,选择你下载的 Tomcat 版本（Apache Tomcat v9.0），然后点击 Next。
在 Tomcat installation directory 一栏，点击 Browse...，选择你之前解压的 Tomcat 目录。确保 JRE 选项已经正确指向了你的 JDK 安装路径，然后点击 Finish。
返回 Preferences 窗口，点击 Apply and Close。

你的 Eclipse 已经成功集成了 Tomcat 服务器。

第三步：创建一个动态 Web 项目

在 Eclipse 中，点击 File -> New -> Dynamic Web Project。
在弹出的窗口中：
- Project name: 输入你的项目名称，HelloJsp。
- Target runtime: 点击 New Runtime...，选择你刚刚配置好的 Tomcat 服务器版本，点击 Finish。
- Configuration: 可以选择一个可选的配置，"Apache Tomcat v9.0"，这会自动帮你生成一些标准的目录结构，选择后点击 Finish。

项目创建成功后,你会在 Project Explorer 视图中看到如下结构：

HelloJsp
├── src
│   └── main
│       ├── java
│       └── webapp
│           ├── META-INF
│           │   └── context.xml
│           └── WEB-INF
│               ├── lib
│               └── web.xml
└── target

src/main/webapp: 这是你存放所有 Web 资源的地方，包括 JSP 文件、HTML、CSS、JavaScript 和图片等。
WEB-INF: 这是一个特殊的安全目录，里面的内容不能被客户端直接通过 URL 访问。
- web.xml: 部署描述符（Deployment Descriptor），用于配置 Web 应用。

第四步：创建并编写你的第一个 JSP 页面

在 Project Explorer 中，右键点击 HelloJsp -> New -> JSP File。
在弹出的窗口中：
- File name: 输入文件名，index.jsp。
- **Parent folder 确保是HelloJsp/src/main/webapp`。
- Template: 选择 New JSP File (html)，这样会生成一个带有基本 HTML 结构的 JSP 文件。
- 点击 Finish。
Eclipse 会为你创建一个 index.jsp 文件，打开它，并修改其内容如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">我的第一个 JSP 页面</title>
</head>
<body>
    <h1>你好，JSP 世界！</h1>
    <%
        // 这是一个 Java 代码片段
        String message = "当前时间是: " + new java.util.Date();
    %>
    <p>
        <%= message %>
    </p>
    <p>
        2 + 2 的结果是: <%= 2 + 2 %>
    </p>
</body>
</html>

代码解释:

<%@ page ... %>: 这是指令，用于设置整个页面的属性，比如语言、编码等。
<% ... %>: 这是 脚本片段，可以在其中嵌入任何有效的 Java 代码，这里的代码在服务器端执行。
<%= ... %>: 这是 表达式，用于将 Java 表达式的结果输出到 HTML 中，等号后面不能加分号。

第五步：部署与运行

让我们把这个项目运行起来。

在 Eclipse 的 Project Explorer 中，右键点击你的项目 HelloJsp。
选择 Run As -> Run on Server。
在弹出的窗口中：
- 如果之前配置过,直接选择你的 Tomcat 服务器即可。
- 如果没有,点击 Manually define a new server，然后选择你配置好的 Tomcat，点击 Finish。
Eclipse 会自动将你的项目部署到 Tomcat 服务器，并启动服务器，它会自动在内置的浏览器中打开 index.jsp 的 URL（通常是 http://localhost:8080/HelloJsp/）。

你应该能看到类似下面的页面：

恭喜！你已经成功运行了你的第一个 JSP 应用。

第六步：进阶示例 - 表单交互

JSP 的真正强大之处在于它能处理用户输入并与后端交互，下面我们创建一个简单的登录页面。

创建登录页面 login.jsp

在 src/main/webapp 下，右键 -> New -> JSP File，命名为 login.jsp如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">登录页面</title>
</head>
<body>
    <h2>用户登录</h2>
    <!-- 
        action="welcome.jsp" 表示表单提交到 welcome.jsp
        method="post" 表示使用 POST 方法提交数据
    -->
    <form action="welcome.jsp" method="post">
        用户名: <input type="text" name="username" /><br><br>
        密码: <input type="password" name="password" /><br><br>
        <input type="submit" value="登录" />
    </form>
</body>
</html>

创建处理页面 welcome.jsp

在 src/main/webapp 下，再创建一个 welcome.jsp 文件，内容如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">欢迎页面</title>
</head>
<body>
    <%
        // request 是内置对象，代表客户端的请求
        // getParameter() 方法用于获取表单中 name 属性对应的值
        String username = request.getParameter("username");
        // 简单的验证逻辑
        if ("admin".equals(username)) {
    %>
            <h1>欢迎您, <%= username %>!</h1>
            <p>登录成功！</p>
    <%
        } else {
    %>
            <h1>错误！</h1>
            <p>用户名或密码错误。</p>
            <a href="login.jsp">返回登录</a>
    <%
        }
    %>
</body>
</html>

运行进阶示例:

右键点击 login.jsp -> Run As -> Run on Server。
在登录页面,输入用户名 admin，密码任意，点击登录。
你会被跳转到 welcome.jsp，并看到“欢迎您, admin!”。
如果输入其他用户名,则会显示错误信息。

总结与后续学习

通过本教程,你已经掌握了在 Eclipse 中使用 JSP 进行 Web 开发的基本流程：

环境搭建: JDK, Eclipse, Tomcat。
项目创建: Dynamic Web Project。
核心概念: JSP 指令、脚本片段、表达式。
内置对象: 使用 request 对象获取表单数据。
部署运行: 通过 Run on Server 快速调试。

下一步可以学习什么？

JSP 动作标签: 如 <jsp:include>, <jsp:forward>, <jsp:useBean> 等。
EL 表达式语言: 简化在 JSP 中获取数据的写法，${username} 替代 <%=username%>。
JSTL (JSP Standard Tag Library): 一套标准的标签库，用于处理循环、条件判断、格式化等，让 JSP 页面更整洁。
MVC 设计模式: 学习如何将 JSP (View)、JavaBean (Model) 和 Servlet (Controller) 分离，这是现代 Java Web 开发的核心思想。
Servlet: 学习 Servlet，它是 JSP 的基础，也是处理 HTTP 请求的核心组件。

祝你学习愉快！