传送门
AJAX入门
建议引入JQuery的封装来使用AJAX，现在基本没有需要原生创建AJAX请求的场景，JQuery封装了对不同浏览器的处理，无需自己判断
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
$.ajax({
url: 'your_url_here', // 替换成你要发送请求的URL
type: 'POST',
data: {
param1: 'value1', // 替换成你要发送的参数
param2: 'value2'
},
success: function(response) {
// 请求成功时的回调函数
console.log(response); // 输出服务器返回的数据
},
error: function(xhr, status, error) {
// 请求失败时的回调函数
console.log(error); // 输出错误信息
}
});
var postData = {
param1: 'value1',
param2: 'value2'
};
$.ajax({
url: 'your_url_here',
type: 'POST',
data: JSON.stringify(postData), // 将 postData 对象转换为 JSON 字符串
contentType: 'application/json', // 设置请求头 Content-Type 为 application/json
success: function(response) {
console.log(response);
},
error: function(xhr, status, error) {
console.log(error);
}
});
AJAX概述
AJAX开发
AJAX简单案例
课后习题
验证码和文件的上传下载
建议使用成熟的jar包，自己写比较麻烦的，比如Apache Commons FileUpload
使用JSP验证码
验证码开发
文件流给前端或者BASE64给前端都可以，个人感觉BASE64更合适，因为验证码图片体积一般不会很大
int width = 150;
int height = 50;
BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
Graphics2D g2d = image.createGraphics();
// 设置背景颜色
g2d.setColor(Color.WHITE);
g2d.fillRect(0, 0, width, height);
// 生成随机验证码 Math.Random
String captcha = generateCaptcha();
// 将验证码存储在 session 中，以便后续验证
request.getSession().setAttribute("captcha", captcha);
// 绘制验证码文本
g2d.setColor(Color.BLACK);
g2d.setFont(new Font("Arial", Font.BOLD, 24));
g2d.drawString(captcha, 30, 30);
// 结束绘图
g2d.dispose();
// 将图像转换为 Base64 字符串
ByteArrayOutputStream baos = new ByteArrayOutputStream();
ImageIO.write(image, "png", baos);
byte[] imageBytes = baos.toByteArray();
String base64Image = Base64.getEncoder().encodeToString(imageBytes);
// 将 Base64 字符串发送给前端
response.getWriter().write(base64Image);
认识文件上传
本质上是对文件流的处理
实现文件上传
// 获取上传的文件部分
Part filePart = request.getPart("file");
// 获取上传文件的文件名
String fileName = getSubmittedFileName(filePart);
// 获取上传文件的输入流
InputStream fileContent = filePart.getInputStream();
// 这里可以将文件保存到服务器上，或者进行其他操作
// 例如将文件内容写入到另一个文件中
OutputStream out = new FileOutputStream("/path/to/save/directory/" + fileName);
int read = 0;
byte[] bytes = new byte[1024];
while ((read = fileContent.read(bytes)) != -1) {
out.write(bytes, 0, read);
}
out.close();
response.getWriter().println("File " + fileName + " uploaded successfully");
//取文件的名称，比较麻烦
private static String getSubmittedFileName(Part part) {
for (String cd : part.getHeader("content-disposition").split(";")) {
if (cd.trim().startsWith("filename")) {
String fileName = cd.substring(cd.indexOf('=') + 1).trim().replace("\"", "");
return fileName.substring(fileName.lastIndexOf('/') + 1).substring(fileName.lastIndexOf('\\') + 1);
}
}
return null;
}
文件下载
课后习题
MVC和Struts2的基本原理
MVC模式
界面、业务逻辑、数据库操作，三者分开
Struts2简介
古早网站还在用，比如url是xxxx.action这种的
Struts2的基本原理
配置全局的FilterDispatcher，捕获xxx.action(可以改后缀匹配规则)请求发给对应的Class，反射处理调用execute方法，根据execute返回的字符串继续找到下一个jsp页面
Struts2的基本使用方法
- web.xml添加FilterDispatcher
- 添加struts.xml配置相关跳转页面的参数(什么字符串跳转什么jsp)
- 添加execute方法
其他问题
课后习题
Web网站安全
URL操作攻击
改请求参数，其实就是权限控制问题，简单点可以加上登录用户的校验
Web跨站脚本攻击
由于JSP是拼接HTML而产生的问题，如果不处理，参数里的脚本就会被执行
out.println(req.getParameter("str"));
//改善 org.apache.commons.text.StringEscapeUtils
out.println(StringEscapeUtils.escapeHtml4(req.getParameter("str")));
SQL注入
太常见了，PrepareStatement解决
密码保护与验证
非明文存储用户密码