下载文档原格式
第1章JSP技术简介JSP（Java Server Pages）技术是由Sun公司发布的用于开发动态Web应用的一项技术。
它以其简单易学、跨平台的特性，在众多动态Web应用程序设计语言中异军突起，在短短几年中已经形成了一套完整的规范，并广泛地应用于电子商务等各个领域中。
在国内，JSP 现在也得到了比较广泛的重视，得到了很好的发展，越来越多的动态网站开始采用JSP技术。
本章就对JSP及其相关技术进行简单的介绍。
1.1 认识HTTP协议HTTP协议（Hypertext Transfer Protocol，超文本传送协议）是WWW服务器使用的主要协议，对HTTP协议细节的基本理解是编写JSP或Java小程序的开发人员所必需的。
因此在学习JSP技术之前有必要更加仔细地研究一下HTTP消息的格式（这里的讨论源自HTTP／1.1协议规范。
参见规范2616，网址为/rfc/rfc2616.txt）。
HTTP 协议的关键部分有HTTP请求和HTTP响应，以及客户端Web程序设计的一些基础知识，在第4章4.4节将会具体介绍。
1.2 客户端Web程序设计介绍Web浏览器现已成为深受大多数用户喜爱的用户界面。
HTML语言提供了丰富的控件，第三方厂商提供了Visual Basic编写的数百个额外的控件，这些都使得Web浏览器独具特色。
虽然Web浏览器与传统的GUI界面有一定的差距，但它提供了一种独立而又简单的方法来访问分布式资源，尤其是Internet资源。
而且越来越多的客户端Web程序扩展技术变得更加成熟，出现了包括CSS、JavaScript、VBScript、动态HTML、Java1.1.Applet应用程序等技术在内的客户端Web程序设计技术，它们的相互结合使得Web程序更加迷人。
下面简单介绍几种常用的客户端Web程序设计技术的特点。
本书假定读者对这些技术都有一定的了解，不对这些技术作详细介绍。
1.2.1 CSSCSS（Cascading Style Sheets）称为层叠样式表，是动态HTML技术的一个部分，但可以和HTML结合使用。
通过ajax、servlet实现图⽚的上传功能经测试可⾏，本⼈上传的地址是要在C盘的⽬录下建⼀个"Image"⽂件夹（当然可以⾃⾏创建）jsp页⾯：<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title></head><body><!--这⾥⽂件上传实例--><div class="container"><div class="panel-heading">分段读取⽂件：</div><div class="panel-body"><input type="file" id="file"/></div></div></body><script type="text/javascript">/** 分段读取⽂件为blob ，并使⽤ajax上传到服务器* 分段上传exe⽂件会抛出异常*/var fileBox = document.getElementById('file');file.onchange = function() {// 获取⽂件对象var file = this.files[0];var reader = new FileReader();var step = 1024 * 1024;var total = file.size;var cuLoaded = 0;("⽂件⼤⼩：" + file.size);var startTime = new Date();// 读取⼀段成功reader.onload = function(e) {// 处理读取的结果var loaded = e.loaded;// 将分段数据上传到服务器uploadFile(reader.result, cuLoaded, function() {('loaded:' + cuLoaded + 'current:' + loaded);// 如果没有读完，继续cuLoaded += loaded;if (cuLoaded < total) {readBlob(cuLoaded);} else {console.log('总共⽤时：'+ (new Date().getTime() - startTime.getTime())/ 1000);cuLoaded = total;}});}// 指定开始位置，分块读取⽂件function readBlob(start) {// 指定开始位置和结束位置读取⽂件// ('start:' + start);var blob = file.slice(start, start + step);reader.readAsArrayBuffer(blob);}// 开始读取readBlob(0);// 关键代码上传到服务器function uploadFile(result, startIndex, onSuccess) {var blob = new Blob([ result ]);// 提交到服务器var fd = new FormData();fd.append('file', blob);fd.append('filename', );fd.append('loaded', startIndex);var xhr = new XMLHttpRequest();xhr.open('post', 'http://localhost:8080//uploadtwo/UploadServlet',true);xhr.onreadystatechange = function() {if (xhr.readyState == 4 && xhr.status == 200) {// var data = eval('(' + xhr.responseText + ')');(xhr.responseText);if (onSuccess)}}// 开始发送xhr.send(fd);}}</script></html>后端UploadServlet:package com.servlet;import java.io.FileOutputStream;import java.io.IOException;import java.io.InputStream;import java.io.RandomAccessFile;import java.text.SimpleDateFormat;import java.util.Date;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;@WebServlet("/UploadServlet")public class UploadServlet extends HttpServlet {private static final long serialVersionUID = 1L;protected void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {try {// 获取客户端传过来图⽚的⼆进制流InputStream stream = request.getInputStream();// 以当前时间戳为图⽚命名SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss");String strCurrentTime = df.format(new Date());//最终⽂件存储位置String imagePath = "C://Image/" + strCurrentTime + ".png";// 这⾥的⽂件格式可以⾃⾏修改，如.jpgFileOutputStream fos = new FileOutputStream(imagePath);byte[] bbuf = new byte[32];int hasRead = 0;while ((hasRead = stream.read(bbuf)) > 0) {fos.write(bbuf, 0, hasRead);// 将⽂件写⼊服务器的硬盘上}fos.close();stream.close();/** 但是需要注意，采⽤这种原始的⽅式写⼊⽂件时，你会发现被写⼊的⽂件内容前4⾏并⾮是读取⽂件的真正内容， * 从第四⾏开始才是正⽂数据。
JSP Ajax相关技术简介Ajax不是单一的技术，而是四种技术的集合。
表8-1简要介绍了这些技术，以及它们所扮演的角色。
Ajax为用户提供了复杂的、运转良好的应用，改善了用户的交互体验。
Ajax 中主要技术之间的关系如下所述：JavaScript就像胶水将各个部分粘合在一起，定义应用的工作流程和业务逻辑。
通过使用JavaScript操作DOM来改变和刷新用户界面，不断地重绘和重新组织显示给用户的数据，并且处理用户基于鼠标和键盘的交互。
CSS为应用提供了一致的外观，并且为以编程方式操作DOM提供了强大的捷径。
XMLHttpRequest对象（或者类似的机制）则用来与服务器进行异步通信，在用户工作时提交用户的请求并获取最新的数据。
图8-1显示Ajax相关技术工作流程。
图8-1 Ajax的四个主要组件JavaScript定义了业务规则和程序流程。
应用程序使用XMLHttpRequest对象（或类似的机制）以后台方式从服务器获得的数据，通过DOM和CSS来改变界面的外观。
Ajax的四种技术之中，CSS、DOM和JavaScript这三个都不是新面孔，它们以前合在一起称作动态HTML，或者简称DHTML。
DHTML可以为Web页面创造新奇古怪的、交互性很强的界面，但是它永远也无法克服需要完全刷新整个页面的问题。
问题在于，如果没有和服务器通信的能力，只有空的漂亮界面，还是无法实现一些真正有意义的功能。
Ajax除了大量使用DHTML，还可以发送异步请求，这大大延长了Web页面的寿命。
通过与服务器进行异步通信，无须打断用户正在界面上执行的操作，Ajax与其前任DHTML相比，为用户带来了真正的价值。
更加方便的是，所有这些技术都已经预先安装在绝大多数Web浏览器之中，包括微软公司的IE、Mozilla/Gecko系列的浏览器（例如Firefox、Mozilla Suite、Net scape Navigator和Camino）、Opera、苹果公司的Safari，以及它的近亲UNIX KDE 桌面系统里的Konqueror。
使用JSP/Servlet技术开发新闻发布系统_第一章小结●动态网页基础B/S架构的工作原理概念：在B/S架构中，浏览器端与服务器端采用请求/响应模式进行交互。
B/S架构工作流程1.浏览器接受用户的输入2.浏览器向服务器端发送请求3.数据处理4.发送响应什么是URL概念：URL(Uniform Resource Locator)的意思是统一资源定位符，是用于完整地描述Internet上网页和其他资源的地址的一种标识方法。
URL的组成结构1.协议：HTTP(Hyper Text Transfer Protocol)协议，即超级文本传输协议，该协议支持简单的请求和响应会话（目前WWW中应用最广的协议）2.服务器域名或IP3.端口号：端口是服务器用于内外部通信的通道，当从外部访问服务器时就需要通过指定的通道来访问。
不同的协议有着各自不同的默认开发端口。
4.路径：文件所存放的位置●部署简单的Web应用Tomcat服务器概念：Tomcat是一个Web容器（Web容器是一种服务程序，在服务器一个端口就有一个提供相应服务的程序，而这个程序就是处理从客户端发出的请求）Tomcat的获取与安装Tomcat的获取：安装Tomcat前必须确保在系统中已经正确安装了Java运行环境，然后再安装TomcatTomcat的安装：安装时必须添加系统变量，名称为CATALINA_HOME;设置值为Tomcat的安装目录Tomcat的目录结构如下表：Tomcat端口号的配置具体的操作步骤如下：1.在Tomcat目录结构下找到其子目录conf2.在conf目录中打开server.xml文件3.在打开的文件中，找到<Connector>节点，然后修改端口号4.保存设置Web应用的目录结构如下表：配置起始访问页面通过修改/WEB-INF目录下的web.xml文件中的<welcome-file-list>元素来设定Web应用的起始访问页面；<welcome-file>元素用于指定页面。
课程“Accp6.0_S2.使用JavaScript增强交互效果”题库试题汇编【001】在JavaScript中，以下变量命名非法的是（）.（选择一项）A) numb_1B) 2numbC) sumD) de2$f【002】关于以下JavaScript代码，说法正确的是（）。
var s = document.getElementsByTagName("p");for(var i = 0;i<s.length;i++) {s[i].style.display="none";}（选择一项）A) 隐藏了页面中所有id为p的对象B) 隐藏了页面中所有name为p的对象C) 隐藏了页面中所有标签为<p>的对象D) 隐藏了页面中标签为<p>的第一个对象【003】在JavaScript中()方法可以对数组元素进行排序（选择一项）A) add()B) join()C) sort()D) length()【004】下列正则表达式中( )可以匹配首位是小写字母,其他位数是小写字母或数字的最少两位的字符串。
（选择一项）A) /^\w{2,}$/B) /^[a-z][a-z0-9]+$/C) /^[a-z0-9]+$/D) /^[a-z]\d+$/【005】下面选项中，（）能够获取滚动条距离页面顶端的距离。
（选择一项）A) onscrollB) scrollLeftC) scrollTopD) top【006】在DOM对象模型中，直接父对象为根对象window的对象中不包括（）。
（选择一项）A) historyB) documentC) locationD) form【007】分析下面的JavaScript代码段，输出结果是（）。
var mystring="I am a student";a=mystring.charAt(9);document.write(a);（选择一项）A) I am a stB) uC) udentD) t【008】在HTML中，运行下面的javascript代码，则在弹出的提示框中显示的消息内容为（）。
介绍005.JSP+SQL新闻发布系统3.2.1 前台系统功能划分前台系统主要包括⽤户浏览模块、评论模块、搜索模块。
前台系统模块如图3-1。
图3-1 前台系统模块图3.2.2 后台系统功能划分后台系统可分为⽤户管理模块、添加新闻内容模块、新闻内容管理模块、评论管理模块、新闻类别管理模块。
后台系统如图4-2。
图 3-2 后台系统模块3.3 系统功能描述3.3.1 前台系统功能描述1.⽤户浏览模块完成⽤户对新闻的内容的浏览，新闻内容是分类存放的，⽤户可以浏览⾃⼰感兴趣的新闻的内容。
这是前台管理模块的主要功能。
2.评论模块当⽤户浏览完⾃⼰感兴趣的新闻后，可以对新闻发表⾃⼰的评论。
3.新闻搜索模块由于⽹站的新闻量⽐较⼤，⽤户想要浏览某个特定的新闻时，可以使⽤此功能来查找，以便快速定位，可以输⼊关键字，按新闻的标题和新闻的内容进⾏查找。
3.3.2 后台系统功能描述1 ⽤户管理模块⽤户管理模块包括添加⽤户，对⽤户基本信息的浏览，更改⽤户密码等功能。
2.添加新闻内容模块此模块完成新闻内容的添加的功能。
需要输⼊要添加新闻的标题，新闻的内容，新闻的类别，发布⼈的信息等。
此处添加的新闻将在前台系统中以分类的形式进⾏显⽰。
3.新闻管理模块此模块的功能是对已有的新闻的各项信息进⾏修改，对过期的新闻进⾏删除操作。
4.评论管理模块此模块的功能是对⽤户的评论信息进⾏修改或删除。
5.新闻类别管理模块此模块完成新闻类别的添加、删除和修改，本系统可以实现对新闻的⼆级分类。
4.3 后台系统的实施虽然系统是从新闻阅读者的⾓度开始设计的，但是在新闻发布系统中作为系统的设计者，⾸先⾯对的是新闻的管理者。
阅读者的需求实际上是系统需求的⼀部分，更重要的是应先解决管理者对系统管理的需求。
在做好后台管理系统的基础上，再做前台系统，由于数据库⾥有了各种实际的资料，会更加直观。
后台系统主要是为管理员服务的，主要由六个模块组成，管理员登录模块、⽤户管理功能模块、新闻信息添加功能模块、新闻信息管理模块、评论信息管理模块、类别信息管理模块。
Servletservelt:（基于网络的）什么是Servelt：运行在web服务器或应用服务器上的java程序，他是一个中间层负责连接来自web浏览器或其他HTTP客户程序的请求和HTTP服务器上的数据库或应用程序。
为什么使用servlet:Servlet是一种服务器端的Java应用程序，具有独立于平台和协议的特性,可以生成动态的Web页面。
它担当客户请求（Web浏览器或其他HTTP客户程序）与服务器响应（HTTP服务器上的数据库或应用程序）的中间层。
Servlet是位于Web 服务器内部的服务器端的Java 应用程序，与传统的从命令行启动的Java应用程序不同，Servlet由Web服务器进行加载，该Web服务器必须包含支持Servlet的Java虚拟机。
Servlet的优点：servlet是用Java编写的，所以它们一开始就是平台无关的。
这样，Java 编写一次就可以在任何平台运行(write once,run anywhere)的承诺就同样可以在服务器上实现了。
servlet还有一些独特优点：■servlet是持久的。
servlet只需Web服务器加载一次，而且可以在不同请求之间保持服务(例如一次数据库连接)■servlet是与平台无关的。
如前所述，servlet是用Java编写的，它自然也继承了Java 的平台无关性。
■servlet是可扩展的。
由于servlet是用Java编写的，它就具备了Java所能带来的所有优点。
Java是健壮的、面向对象的编程语言，它很容易扩展以适应你的需求。
servlet自然也具备了这些特征。
■servlet是安全的。
从外界调用一个servlet的惟一方法就是通过Web服务器。
这提供了高水平的安全性保障，尤其是在你的Web服务器有防火墙保护的时候。
■setvlet可以在多种多样的客户机上使用。
由于servlet是用Java 编写的，所以你可以很方便地在HTML中使用它们。
JSP+Servlet+Ajax实现⽤户增删改查的例⼦⼀、数据库设计⽤户表User已有的测试数据⼆、Java代码编写Java EE的架构⼀般分为以下五层：①.Domain②.DAO③.Service④.Controller⑤.View这⾥的项⽬结构如下：使⽤的环境为：JDK1.8+Servlet3.0+Tomcat8.0前端统⼀使⽤Ajax⽅式和JSON数据格式向后端发送请求及数据，后端统⼀返回JSON数据格式的信息1.Domain层1package domain;23import java.util.Date;45public class User {67public User() {89 }1011private Integer id;1213private String account;1415private String password;1617private String name;1819private String info;2021private Date createTime;2223private Date modifiedTime;2425public Integer getId() {26return id;27 }2829public void setId(Integer id) {30this.id = id;31 }3233public String getAccount() {34return account;35 }3637public void setAccount(String account) {38this.account = account;39 }4041public String getPassword() {42return password;43 }4445public void setPassword(String password) {46this.password = password;47 }4849public String getName() {50return name;51 }5253public void setName(String name) { = name;55 }5657public String getInfo() {58return info;59 }6061public void setInfo(String info) { = info;63 }6465public Date getCreateTime() {66return createTime;67 }6869public void setCreateTime(Date createTime) {70this.createTime = createTime;71 }7273public Date getModifiedTime() {74return modifiedTime;75 }7677public void setModifiedTime(Date modifiedTime) { 78this.modifiedTime = modifiedTime;82public String toString() {83return "User [id=" + id + ", account=" + account + ", password=" + password + ", name=" + name + ", info="84 + info + ", createTime=" + createTime + ", modifiedTime=" + modifiedTime + "]";85 }8687 }User.java2.Dao层1package dao;23import java.util.List;45import er;67public interface UserDao {89/** 显⽰所有⽤户 */10public List<User> listAll();1112/** 添加⼀个⽤户 */13public boolean add(User user);1415/** 根据id删除⼀个⽤户 */16public boolean deleteById(Integer id);1718/** 更新⼀个⽤户 */19public boolean update(User user);2021/** 根据id查找⼀个⽤户 */22public User getById(Integer id);2324 }UserDao.java1package dao.impl;23import java.sql.Connection;4import java.sql.PreparedStatement;5import java.sql.ResultSet;6import java.sql.SQLException;7import java.util.ArrayList;8import java.util.List;910import erDao;11import er;12import util.DBUtil;1314public class UserDaoImpl implements UserDao {1516 @Override17public List<User> listAll() {18 List<User> users = new ArrayList<User>();19 Connection conn = DBUtil.getConnection();20 String sql = "select * from user";21try {22 PreparedStatement pst = conn.prepareStatement(sql);23 ResultSet rst = pst.executeQuery();24while (rst.next()) {25 User user = new User();26 user.setId(rst.getInt("id"));27 user.setAccount(rst.getString("account"));28 user.setPassword(rst.getString("password"));29 user.setName(rst.getString("name"));30 user.setInfo(rst.getString("info"));31 user.setCreateTime(rst.getTimestamp("gmt_create"));32 user.setModifiedTime(rst.getTimestamp("gmt_modified"));33 users.add(user);34 }35 rst.close();36 pst.close();37 } catch (SQLException e) {38 e.printStackTrace();39 }40return users;44public boolean add(User user) {45 Connection conn = DBUtil.getConnection();46 String sql = "insert into user(account, password, name, info) value (?, ?, ?, ?)";47try {48 PreparedStatement pst = conn.prepareStatement(sql);49 pst.setString(1, user.getAccount());50 pst.setString(2, user.getPassword());51 pst.setString(3, user.getName());52 pst.setString(4, user.getInfo());53int count = pst.executeUpdate();54 pst.close();55return count > 0 ? true : false;56 } catch (SQLException e) {57 e.printStackTrace();58 }59return false;60 }6162 @Override63public boolean deleteById(Integer id) {64 Connection conn = DBUtil.getConnection();65 String sql = "delete from user where id = ?";66try {67 PreparedStatement pst = conn.prepareStatement(sql);68 pst.setInt(1, id);69int count = pst.executeUpdate();70 pst.close();71return count > 0 ? true : false;72 } catch (SQLException e) {73 e.printStackTrace();74 }75return false;76 }7778 @Override79public boolean update(User user) {80 Connection conn = DBUtil.getConnection();81 String sql = "update user set account = ?, password = ?, name = ?, info = ? where id = ?"; 82try {83 PreparedStatement pst = conn.prepareStatement(sql);84 pst.setString(1, user.getAccount());85 pst.setString(2, user.getPassword());86 pst.setString(3, user.getName());87 pst.setString(4, user.getInfo());88 pst.setInt(5, user.getId());89int count = pst.executeUpdate();90 pst.close();91return count > 0 ? true : false;92 } catch (SQLException e) {93 e.printStackTrace();94 }95return false;96 }9798 @Override99public User getById(Integer id) {100 User user = new User();101 Connection conn = DBUtil.getConnection();102 String sql = "select * from user where id = ?";103try {104 PreparedStatement pst = conn.prepareStatement(sql);105 pst.setInt(1, id);;106 ResultSet rst = pst.executeQuery();107while (rst.next()) {108 user.setId(rst.getInt("id"));109 user.setAccount(rst.getString("account"));110 user.setPassword(rst.getString("password"));111 user.setName(rst.getString("name"));112 user.setInfo(rst.getString("info"));113 user.setCreateTime(rst.getTimestamp("gmt_create"));114 user.setModifiedTime(rst.getTimestamp("gmt_modified"));115 }116 rst.close();117 pst.close();118 } catch (SQLException e) {119 e.printStackTrace();120 }121return user;122 }123124 }UserDaoImpl.java3.Service层1package service;23import java.util.List;45import er;67public interface UserService {89/** 显⽰所有⽤户 */10public List<User> listAll();1112/** 添加⼀个⽤户 */13public boolean add(User user);1415/** 根据id删除⼀个⽤户 */16public boolean deleteById(Integer id);1718/** 更新⼀个⽤户 */19public boolean update(User user);2021/** 根据id查找⼀个⽤户 */22public User getById(Integer id);2324 }UserService.java1package service.impl;23import java.util.List;45import erDao;6import erDaoImpl;7import er;8import erService;910public class UserServiceImpl implements UserService { 1112 @Override13public List<User> listAll() {14 UserDao userDao = new UserDaoImpl();15return userDao.listAll();16 }1718 @Override19public boolean add(User user) {20 UserDao userDao = new UserDaoImpl();21return userDao.add(user);22 }2324 @Override25public boolean deleteById(Integer id) {26 UserDao userDao = new UserDaoImpl();27return userDao.deleteById(id);28 }2930 @Override31public boolean update(User user) {32 UserDao userDao = new UserDaoImpl();33return userDao.update(user);34 }3536 @Override37public User getById(Integer id) {38 UserDao userDao = new UserDaoImpl();39return userDao.getById(id);40 }4142 }UserServiceImpl.java4.Controller层1package controller;3import java.io.IOException;4import java.util.List;56import javax.servlet.ServletException;7import javax.servlet.annotation.WebServlet;8import javax.servlet.http.HttpServlet;9import javax.servlet.http.HttpServletRequest;10import javax.servlet.http.HttpServletResponse;1112import er;13import net.sf.json.JSONArray;14import net.sf.json.JSONObject;15import erService;16import erServiceImpl;17import util.JSONUtil;1819 @WebServlet("/UserServlet")20public class UserServlet extends HttpServlet {2122private static final long serialVersionUID = 1L;2324public UserServlet() {25super();26 }2728protected void doGet(HttpServletRequest request, HttpServletResponse response) 29throws ServletException, IOException {30// 设置返回编码格式，解决中⽂乱码31 response.setCharacterEncoding("utf-8");3233// 根据action的值来执⾏不同的动作，例如显⽰所有⽤户或显⽰单个⽤户34 String action = request.getParameter("action");3536// 显⽰所有⽤户37if (action.equals("listAll")) {38 UserService userService = new UserServiceImpl();39 List<User> users = userService.listAll();4041// 返回JSON数据格式42 JSONArray jsonArr = JSONArray.fromObject(users);43 JSONObject jsonObjOut = new JSONObject();44 jsonObjOut.put("users", jsonArr);45 JSONUtil.returnJSON(request, response, jsonObjOut);46 }4748// 显⽰单个⽤户49if (action.equals("getById")) {50int id = Integer.parseInt(request.getParameter("id"));51 UserService userService = new UserServiceImpl();52 User user = userService.getById(id);5354// 返回JSON数据格式55 JSONObject jsonObjOut = new JSONObject();56 jsonObjOut.put("user", user);57 JSONUtil.returnJSON(request, response, jsonObjOut);58 }59 }6061protected void doPost(HttpServletRequest request, HttpServletResponse response) 62throws ServletException, IOException {63// 获取JSON数据64 JSONObject jsonObjIn = JSONUtil.getJSON(request, response);6566 User user = new User();67 user.setAccount(jsonObjIn.getString("account"));68 user.setPassword(jsonObjIn.getString("password"));69 user.setName(jsonObjIn.getString("name"));70 user.setInfo(jsonObjIn.getString("info"));7172 UserService userService = new UserServiceImpl();73boolean isSuccess = userService.add(user);7475// 返回JSON数据格式76 JSONObject jsonObjOut = new JSONObject();77 jsonObjOut.put("isSuccess", isSuccess);78 JSONUtil.returnJSON(request, response, jsonObjOut);79 }8081protected void doDelete(HttpServletRequest request, HttpServletResponse response) 82throws ServletException, IOException {83// 获取JSON数据84 JSONObject jsonObjIn = JSONUtil.getJSON(request, response);85int id = jsonObjIn.getInt("id");87 UserService userService = new UserServiceImpl();88boolean isSuccess = userService.deleteById(id);8990// 返回JSON数据格式91 JSONObject jsonObjOut = new JSONObject();92 jsonObjOut.put("isSuccess", isSuccess);93 JSONUtil.returnJSON(request, response, jsonObjOut);9495 }9697protected void doPut(HttpServletRequest request, HttpServletResponse response)98throws ServletException, IOException {99// 获取JSON数据100 JSONObject jsonObjIn = JSONUtil.getJSON(request, response);101102 User user = new User();103 user.setId(jsonObjIn.getInt("id"));104 user.setAccount(jsonObjIn.getString("account"));105 user.setPassword(jsonObjIn.getString("password"));106 user.setName(jsonObjIn.getString("name"));107 user.setInfo(jsonObjIn.getString("info"));108109 UserService userService = new UserServiceImpl();110boolean isSuccess = userService.update(user);111112// 返回JSON数据格式113 JSONObject jsonObjOut = new JSONObject();114 jsonObjOut.put("isSuccess", isSuccess);115 JSONUtil.returnJSON(request, response, jsonObjOut);116 }117118 }UserServlet.java5.View层1 <%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>2 <% String basePath = request.getScheme() + "://" + request.getServerName() + ":"3 + request.getServerPort() + request.getContextPath() + "/"; %>45<!Doctype html>6<html>7<head>8<base href="<%=basePath%>">9<title>⽤户管理</title>10<meta charset="utf-8">11<link rel="stylesheet" href="static/css/style.css">12<link rel="stylesheet" href="static/js/jquery-ui/jquery-ui.min.css">13<script src="static/js/jquery-3.3.1.min.js"></script>14<script src="static/js/jquery.serializejson.min.js"></script>15<script src="static/js/jquery-ui/jquery-ui.min.js"></script>16</head>17<body>18<!-- ⽤户列表 -->19<div class="tbl-title">⽤户列表</div>20<button onclick="showAddUserModal()">添加新的⽤户</button>21<table id="users" class="tbl-list">22<thead>23<tr>24<th>账户</th>25<th>密码</th>26<th>⽤户名</th>27<th>信息</th>28<th>操作</th>29</tr>30</thead>31<tbody>32</tbody>33</table>3435<!-- 添加⽤户模态框 -->36<div id="add-user-modal" title="添加⽤户" style="display:none;">37<form id="add-user-form">38<table class="modal-tbl">39<tr><td>账户</td><td><input type="text" name="account"></td></tr>40<tr><td>密码</td><td><input type="password" name="password"></td></tr>41<tr><td>姓名</td><td><input type="text" name="name"></td></tr>42<tr><td>信息</td><td><input type="text" name="info"></td></tr>43</table>44</form>45</div>4647<!--删除⽤户对话模态框 -->48<div id="delete-user-modal" title="删除⽤户" style="display:none;">49<p>确定删除该⽤户吗？</p>50</div>5152<!-- 更新⽤户模态框 -->53<div id="update-user-modal" title="更新⽤户" style="display:none;">54<form id="update-user-form">55<table class="modal-tbl">56<tr style="display: none"><td>ID</td><td><input type="text" name="id"></td></tr>57<tr><td>账户</td><td><input type="text" name="account"></td></tr>58<tr><td>密码</td><td><input type="password" name="password"></td></tr>59<tr><td>姓名</td><td><input type="text" name="name"></td></tr>60<tr><td>信息</td><td><input type="text" name="info"></td></tr>61</table>62</form>63</div>6465<!-- 提⽰信息模态框 -->66<div id="msg-modal" title="" style="display:none">67<p></p>68</div>6970<script>71// 开始72 $(function() {73 listAllUser();74 });7576// 显⽰所有⽤户77function listAllUser() {78 $.ajax({79 type: "GET",80 url: "UserServlet?action=listAll",81 dataType: "json",82 success: function(data) {83 $("#users tbody").empty(); // 每次载⼊前先清空显⽰区域，防⽌数据重复显⽰84var users = ers;85for (var i in users) {86var user = users[i];87var userStr = JSON.stringify(user);88 $("#users tbody").append('<tr><td>' + user.account + '</td>'89 + '<td>' + user.password + '</td>'90 + '<td>' + + '</td>'91 + '<td>' + + '</td>'92 + '<td><button onclick=\'showUpdateUserModal(' + userStr + ')\'>更新</button> '93 + '<button onclick="deleteUser(' + user.id + ')">删除</button></td></tr>');94 }95 },96 error: function() {97 console.log("ajax error");98 }99 });100 }101102// 显⽰添加⽤户模态框103function showAddUserModal() {104 $("#add-user-form")[0].reset(); // 每次载⼊前先清空表单，防⽌显⽰之前的信息105 $("#add-user-modal").dialog({106 resizable: false,107 modal: true,108 buttons: {109 "提交": function() {110 addUser();111 },112 "取消": function() {113 $(this).dialog("close");114 },115 },116 });117 }118119// 添加⽤户120function addUser() {121// 获取序列化表单信息122var user = $("#add-user-form").serializeJSON();123var userStr = JSON.stringify(user);124125 $.ajax({126 type: "POST",127 url: "UserServlet",128 data: userStr,129 dataType: "json",130 success: function(data) {131if (data.isSuccess) {132 $("#add-user-modal").dialog("close");133 showMsg('添加成功！');134 listAllUser();135 } else {136 $("#add-user-modal").dialog("close");137 showMsg('添加失败！');138 listAllUser();139 }140 },141 error: function() {142 console.log("ajax error");143 },144 });145 }146147// 删除⽤户148function deleteUser(id) {149// 将id封装为JSON格式数据150var data = {};151 data.id = id;152var dataStr = JSON.stringify(data);153// 显⽰删除⽤户模态框154 $("#delete-user-modal").dialog({155 resizable: false,156 modal: true,157 buttons: {158 "确认": function() {159 $.ajax({160 type: "DELETE",161 url: "UserServlet",162 data: dataStr,163 dataType: "json",164 success: function(data) {165if (data.isSuccess) {166 $("#delete-user-modal").dialog("close");167 showMsg('删除成功！');168 listAllUser();169 } else {170 $("#delete-user-modal").dialog("close");171 showMsg('删除失败！');172 listAllUser();173 }174 },175 error: function() {176 console.log("ajax error");177 },178 });179 },180 "取消": function() {181 $(this).dialog("close");182 },183 },184 });185 }186187//显⽰更新⽤户模态框188function showUpdateUserModal(user) {189 $("#update-user-form")[0].reset(); // 每次载⼊前先清空表单，防⽌显⽰之前的信息190// 表单赋值191 $("#update-user-form input[name='id']").val(user.id);192 $("#update-user-form input[name='account']").val(user.account);193 $("#update-user-form input[name='password']").val(user.password);194 $("#update-user-form input[name='name']").val();195 $("#update-user-form input[name='info']").val();196197 $("#update-user-modal").dialog({198 resizable: false,199 modal: true,200 buttons: {201 "提交": function() {202 updateUser();203 },204 "取消": function() {205 $(this).dialog("close");206 },207 },208 });209 }210211// 更新⽤户212function updateUser() {213// 获取序列化表单信息214var user = $("#update-user-form").serializeJSON();215var userStr = JSON.stringify(user);216217 $.ajax({218 type: "PUT",219 url: "UserServlet",220 data: userStr,221 contentType: 'application/json;charset=utf-8',222 dataType: "json",223 success: function(data) {224if (data.isSuccess) {225 $("#update-user-modal").dialog("close");226 showMsg('更新成功！');227 listAllUser();228 } else {229 $("#update-user-modal").dialog("close");230 showMsg('更新失败！');231 listAllUser();232 }233 },234 error: function() {235 console.log("ajax error");236 },237 });238 }239240//显⽰提⽰信息241function showMsg(text) {242 $("#msg-modal p").text(''); // 每次载⼊前先清空显⽰区域，防⽌显⽰之前的信息243 $("#msg-modal p").text(text);244 $("#msg-modal").dialog({245 modal: true,246 });247// 2s后消失248 setTimeout(function() {249 $("#msg-modal").dialog("close")250 },2000);251 }252</script>253</body>254</html>admin_user.jsp1@charset "utf-8";23.tbl-title {4 margin: 10px 0;5 font-size: 24px;6 }78.tbl-list {9 margin: 10px 0;10 border: 1px solid #000000;11 border-collapse: collapse;12 }1314.tbl-list th, .tbl-list td {15 padding: 5px;16 border: 1px solid #000000;17 }1819.modal-tbl{}style.cssjs相关下载：链接：提取码：ubt06.⼯具类1package util;23import java.sql.Connection;4import java.sql.DriverManager;56public class DBUtil {78private static String Driver = "com.mysql.jdbc.Driver";9private static String url = "jdbc:mysql://localhost:3306/demo?useUnicode=true&characterEncoding=utf8";10private static String user = "root";11private static String psd = "123456";12private static Connection conn = null;1314// 连接数据库15public static Connection getConnection() {16if (conn == null) {17try {18 Class.forName(Driver);19 conn = DriverManager.getConnection(url, user, psd);20 System.out.println("开始数据库连接");21 } catch (Exception e) {22 e.printStackTrace();23 }24 }25return conn;26 }2728// 关闭数据库连接29public static void CloseConnection() {30if (conn != null) {31try {32 conn.close();33 System.out.println("关闭数据库连接");34 } catch (Exception e) {35 e.printStackTrace();36 }37 }38 }39 }DBUtil.java1package util;23import java.io.BufferedReader;4import java.io.IOException;5import java.io.PrintWriter;67import javax.servlet.ServletException;8import javax.servlet.http.HttpServletRequest;9import javax.servlet.http.HttpServletResponse;1011import net.sf.json.JSONObject;1213public class JSONUtil {1415// 从输⼊流中获取JSON数据16public static JSONObject getJSON (HttpServletRequest request, HttpServletResponse response)17throws ServletException, IOException {18// 输⼊流19 StringBuffer sb = new StringBuffer();20 String line = null;21 BufferedReader br = request.getReader();22while ((line = br.readLine()) != null) {23 sb.append(line);24 }25// 返回JSONObject26 String jsonStr = sb.toString();27 JSONObject jsonObj = JSONObject.fromObject(jsonStr);28return jsonObj;29 }3031// 返回JSON格式的数据32public static void returnJSON (HttpServletRequest request, HttpServletResponse response, JSONObject jsonObj) 33throws ServletException, IOException {34// 设置编码格式，解决乱码35 response.setCharacterEncoding("utf-8"); 3637 PrintWriter out = response.getWriter() ;38 out.write(jsonObj.toString());39 out.flush();40 out.close();41 }4243 }JSONUtil.java7.所需要的jar百度云下载地址：提取码：f1gu三、实现效果1.显⽰所有⽤户2.添加⽤户3.修改⽤户4.删除⽤户。
Servlet/JSP配置详解初学者问的诸如：《怎样配置环境变量》《怎样运行Servlet》啊？这样的问题太多了，现在我写一个初学者入门必读，以便对初学者有指导作用！首先是下载工具：我建议初学者用Editplus＋JDK，我觉得如果用例如JB，Eclipse，JCreator，虽然刚开始的时候比较方便，但是确使初学者门不知道怎样配置环境变量，从而难以达到知其然，知其所以然的地步。
然后就是安装JDK，我是把它装到从c:\JDK目录下面。
然后设置CLASSPATH的问题了：正如操作系统利用PATH来搜索可执行程序一样，Java运行环境也会遍历CLASSPATH来查找类，即便是HelloWorld这样简单的程序，JVM 也会遍历CLASSPATH定义的每一个路径，直到找到相应的文件为止。
相信大家用的系统不是2k就是XP，然后就应当如下设置Path：我的电脑-＞属性-＞高级-＞环境变量然后在环境变量的Path后面追加: C:\JDK\bin;.;C:\JDK\lib 也可以这样配置:C:\JDK\bin;.;C:\JDK\lib\dt.jar;C:\JDK\lib\tools.jar ★记住:环境变量中的. 切记不能少，它表示当前路径，如果少掉出现的错误等会就说！dt.jar是关于运行环境的类库，tools.jar是关于一些工具的类库如果没有配置:C:\JDK\bin，则会出现“javac' 不是内部或外部命令，也不是可运行的程序或批处理文件。
”这样的错误。
下面我们就写一个示例程序：打开Editplus，新建一个Java文件，请照着如下输入，要一字不漏，并且分清大小写：public class HelloWorld{public static void main(String[] args){System.out.println("Hello,World!");}}然后把这个文件保存(ctrl + s)到HelloWorld.java,Java是分大小写的，所以大小写一定要分清，是HelloWorld.java不是helloworld.java或者其他。
利用Javascript、servlet和ajax实现SQL数据库访问以前设计的要访问数据库页面表单选择后都是先通过提交后，再由服务器返回新的过滤页面，相当于刷新了页面，这样此前表单中已填列的内容会清空，必须重新输入，很不方便。
上海满智的Emsflow开发平台做得很好，但他们的源代码不开放，所以离开了他们的平台很多功能就没法实现。
现在通过Javascript、servlet和ajax，能实现数据库的访问，要通过访问数据库过滤表单内容的，只用在客户端页面的Javascript中实现，自动从后台获取服务器中的数据库内容，并填入表单中，相当方便适用。
测试的三个程序代码如下，直接可以应用，但在实际开发中，可以比照着修改一下，数据库连接可以改用连接池，SQL的查询条件语句可以用String condition += sql ;表示：一、js_ajax.jsp 代码：<%@ page contentType="text/html; charset=GBK" language="java" import="java.sql.*" errorPage="" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><title>JS+ajax访问数据库</title></head><script src="jqueryUI_1_8/js/jquery-1.6.2.min.js"type="text/javascript"></script><script language = "javascript">function checkValue(){var buttonValue = document.getElementById("textfield").value;if(buttonValue.length == 0){alert("输入不能为空！")document.getElementById("textfield").focus();}else{if(buttonValue.length==11){alert("手机的位数应为11位！");document.getElementById("textfield").value = "";document.getElementById("textfield").focus();}else{$.ajax({//method:"get",type:"post",url:"./jsajax",data:{buttonValue: buttonValue.toString()},success:function(data){document.getElementById("textdata").value=data;if(data=="false"){alert("错误：您的号[" + buttonValue.toString() + "]未在系统中注册。
JSPB/S构架中，浏览器端与服务器端采用请求/响应模式进行交互，这个过程可分解为如下步骤：（1）客户端接受用户输入，发送对系统的访问请求（2）客户端向应用服务器发送请求，等待服务器响应（3）数据处理（4）发送响应Jsp执行过程：（1）翻译阶段（转换成java源码）：当web服务器接收到jsp请求时，首先会对jsp文件进行翻译，将翻译好的jsp文件通过引擎转换成可识别的java源码（2）编译阶段（编译源文件为字节码文件）；将java源文件编译成可执行的字节码文件。
（3）执行阶段（生成可执行的二进制字节码文件）；将生成的页面返回到客户端Jsp指令元素：page指令：通过设置多个属性来定义jsp文件中的全局变量注：page指令只能对当前自身页面进行设置语法：<%@ page 属性1=”属性值1”属性2=”属性值2”属性3=”属性值3”……>Jsp脚本元素：表达式（express）、小脚本（scriptlet）、声明（declaration）的统称小脚本：<%%>标记表达式：<%=java表达式%>声明：<%! Declaration;[Declaration;]……%>Jsp内置对象：当编写jsp页面时，不需做任何声明就可以直接使用的对象out：用于向客户端输出数据，常用方法是print()，这个方法在页面中打印字符串信息例：<%out.print(“你好！”);%>request：包含有关浏览器请求信息，主要用于处理客户端请求常用方法：getParameter();此方法可以获得上一页面所提交的参数值getParameterValues()获取到一个数组，这个数组中存储的就是所有选中的复选项对应的值setCharacterEncoding()设置编码JSP数据交互response：用于响应客户请求并向客户端输出信息常用方法：addCookie(Cookie cookie)在客户端添加CookiesetContentType(String type)设置HTTP响应的contentType类型setCharacterEncoding(String character)设置编码sedRedirect(String path)将请求重新定位到一个不同的URL上转发与重定向：转发：使用getRequestDispatcher()方法实现重定向：使用sedRedirect(String path)对比：转发和重定向有什么区别：转发和重定向都能实现页面跳转，不同之处表现在一下几方面：重定向过程：Web服务器向浏览器发送一个新的http请求，浏览器接受此响应后在发送一个新的http请求到服务器，服务器根据此请求寻找资源并发送给浏览器。
使⽤jQuery发送Ajax请求JQERYJSPjavascript原⽣的ajax操作⽐较⿇烦，新版js中提供了更为便捷的操作⽅式我们后⾯再介绍，这⾥先看下jQuery操作ajax。
jQuery提供了⼀些函数简化了这些操作，接下来我们看下如何使⽤jQuery发送ajax请求。
先准备⼀个servlet⽤来处理ajax发送的请求。
先来⼀个 servlet：package ajax;import java.io.IOException;import java.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;/*** 使⽤JQ - AXAJ的操作 POST请求*/public class ajax extends HttpServlet {protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {}protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {request.setCharacterEncoding("utf-8");response.setContentType("text/html;charset=utf-8");//上⾯编码下⾯获取参数并打印String username = request.getParameter("username");String password = request.getParameter("password");System.out.println(username);System.out.println(password);//下⾯返回⼀个字符表⽰成功访问PrintWriter out = response.getWriter();out.write("你成功⽤JQ操作了AJAX！分享这⼀秒的喜悦！");}}其功能在注释⾃⼰认真看看！然后我们来个JSP：写个按钮叫发送JQ的AJAX操作：【POST请求的】记住导⼊jq的插件<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><script type="text/javascript" src="jqsourse.js"></script></head><body><input type="button" value="AXAJ发送数据"><script type="text/javascript">//先百度⼀下 jq中ajax的参数？$('input').on('click',send);function send() {$.ajax({url:"ajax" , //请求路径type:"POST" , //请求⽅式data:{"username":"bi-hu","password":123456},//请求参数dataType:"text",//设置接受到的响应数据的格式//回调函数success:function (data) {//这个data 是服务器返回的内容什么格式就要看你设置的 dataType了：alert(data);console.log(data);},error:function () {console.log("出错啦...")}//表⽰如果请求响应出现错误，会执⾏的这个回调函数})}</script></body></html>来看下效果图：具体⾃⼰操作！免得说我骗你 .吃个宵夜先待续....继续啊现在来个 jq中axaj操作的 get 和 post 讲解语法：1 get：$.get(url, [data], [callback], [type])参数描述URL必需。
第一章动态网页开发基础
静态页面是哪些技术组成？
动态网页与静态网页有什么关系？
什么是B/S结构？
URL由哪三部分组成？
Tomcat的配置文件目录和web程序的目录名叫什么？
如何启动和停止Tomcat?
动态网页由哪此技术组成？
如何配置Tomcat的端口号？
为什么说javascript是客户端脚本？
学校论坛是B/S程序吗？为什么？
第二章Hello JSP
JSP的执行过程？
JSP页面由哪些组成？
out对象通过哪些方法输出字符？
JSP与S1阶段的java程序有何关系？
page指令有哪些常用属性？
写出JSP脚本的语法？
request 对象的作用？
分别写出HTML和JSP的注释
JSP与HTML的关系
JSP中如何导入需要的包
第三章、数据交互
JSP中如何重定向到另一个页面显示
重定向的作用
使用转向与重定，url上有何区别
如何阻止表单提交
根目录下的a.gif，用绝对路径如何表示JDBC访问数据库需要涉及哪些对象response对象的状态
如何设置显示时的中文字符编码
简述完成注册功能的过程
如何设置get请求的字符编码
第四章、状态管理
什么是cookie
如何让cookie保存在客户端浏览器中
简述会话ID的作用
在JSP页面中，实现拒绝访问的思路include指令的作用
application与session的区别
jsp中对象有哪四种范围
会话与cookie有什么区别
如何设置会话的有效期
什么是会话超时
第五章、JSP应用优化
什么是连接池
DataSource中，调用哪个方法获取连接池中的java.sql.Connection接口的对象在哪个文件中配置连接池
连接池与传统的JDBC相比有什么优点
java web项目上目录结构
如何封装数据
什么是JavaBean
tomcat连接池能不能在main方法中访问？为什么？
MyEclipse中如何布署web项目
使用JNDI获取数据源的步骤
第六章、JSP开发业务应用
简述分页效果需要提供哪些功能
上传文件使用哪个类型表单元素
oracle中使用什么方法提取前10行记录
实现上传，form标签需要修改哪些属性
SmartUpload控件有哪些方法
contentType有什么作用
使用oracle数据库实现分页时，如何获取总的记录数
使用oracle数据库实现分页时，如何获取总页数
SmartUpload使用哪个方法过滤文件类型
第七章、使用分层实现业务处理
三层结构是指哪三层
数据访问层的作用
分层后，表示层能不能直接访问数据访问层，为什么
使用三层开发的优势
使用三层开发的原则
传统JSP开发的不足
业务逻辑层是用什么方式实现
实体类型在三层结构中发挥什么作用
使用三层实现登录与以往实现方式的区别
第八章、JSTL和EL
EL的语法
EL的隐式对象有哪些
EL的用途
使用标签库有步骤
核心标签库中的常用标签有哪些
if标签有哪些属性
迭代使用哪个标签
迭代标签中的item应该如何赋值，var代码什么意思
如何从会话中取得名为user的对象
jstl和el有何关系
第九章、指导学习
第十章、项目案例：论坛短消息
第十一章、Servlet基础
Servlet与JSP的关系
Servlet生命周期都有哪些方法
Servlet的类型名
配置Servlet的代码段
ServletContext的作用
Servlet中重定向的代码
Servlet中请求转发的代码
request和response的类型名
配置Servlet URL的代码
Servlet中使用接收Get请求和Post请求
第十二章神奇的Ajax
Ajax包含哪些技术
使用ajax的优点
Ajax的使用哪个核心类型
web2.0的特点
使用javascript发送请求的几种状态
status属性是什么意思
XMLHtttpRequest使用哪个属性接收服务器响应
页面无刷新的原理
javascript中发送请求的过程
状态200、404、405分别代码什么含义
简述如何使用ajax实现搜索功能
第十三章、项目案例电子书城第十四章、课程总复习。
