上海企业网站黄页个人网站 免备案
JavaWeb的实训是学校的一门课程,老师先讲解一些基础知识,然后让我们自己开发一个比较简单的Web程序。可涉及的知识何其之多,不是实训课的 3 周时间可以讲得完的,只是快速带过。他说:重点是Web开发的流程。
我的实训草草收场,一水而过,但也仍然留下了一些杂乱笔记,谨供参考。
文章目录
- 零、Hello
 - 1、心得
 - 2、问题
 - 3、其他
 
- 一、实训前要求
 - 1、eclipse
 - 2、立项
 - 3、需求分析
 - 4、概要设计
 - 5、前端设计
 
- 二、前端知识
 - 三、操作任务
 - 四、前端设计
 - 1、主页
 - 2、登录页面
 - 3、后台管理
 
- 五、数据库
 - 1、数据库基础
 - 2、MySQL基本使用
 - 3、SQL语句
 - 4、数据库设计
 - 5、数据库实现
 
- 六、连接数据库:JDBC
 - 1、使用流程
 - 2、参数处理
 - 3、简单封装
 
- 七、MVC系统架构
 - 1、架构介绍
 - 2、系统架构搭建
 - 3、小结
 - 4、Web项目运行部署
 
零、Hello
1、心得
- 不要经常打补丁式地去填充一些细节,而更应该去寻找更好的结构。
 
2、问题
for语法?- workbench创建外键的用法?
 
3、其他
- 中华英才网:招聘网站
 - 应届生:重视可塑性
 
一、实训前要求
大三暑假就可以实习,只有一年了。(考研,考公,教资,就业)
boos直聘。
- 日记:80-100字
 - 7-10班答辩取消了
 
MVC: 一种项目架构的设计模式,基于面向接口编程。
Servlet: 重要技术,但是企业不用。能接受前端的用户请求,把数据响应前端。(servlet -> springmvc -> sprintboot)
JDBC: 数据库连接技术
1、eclipse
工作空间的作用?会设置一些什么?
metadata:元数据,描述数据的数据。
-  
字体:不要改,有些字体无法被识别,如javascript会有一些要求。
 -  
字符编码:utf-8
 -  
设置JDK?
 
对象
- 类是创建对象的模板
 - 类的形成:对现实事物共同点的抽象
 - 私有属性能不能被继承?能、不能都可以,要说出原因。
 - 方法重写:只修改函数体。
 - 看源码 ?
 
继承
- 一个父类可以多个子类,但是一个子类只有一个父类。(子类属于父类类型)
 - 多态?接口?抽象?
 
2、立项
1)名称:《交个朋友》
2)需求:(实际需要需求调研)
涉及部门:产品部(主),开发部(产品不懂技术)
-  
前端功能:用户交互的界面
- 首页 
- 导航栏:注册,登录,广告(轮播图),后台管理,我的朋友,搜索
 - 内容:轮播图广告,系统推荐朋友
 - Footer:版权信息
 
 - 朋友详情 
- 头像 --> 查看信息,但不同人的信息同一个模板(不用每人写一个页面)
 
 - 个人中心 
- 登录用户的信息
 
 - 用户如何交到朋友?(流程) 
- 一方:注册 --> 登录 --> 搜索 / 推荐朋友 --> 查看 --> 好友申请 --> 等待
 - 另一方:收到申请 --> 查看详情 --> 接受 / 拒绝(理由)
 
 
 - 首页 
 -  
后台功能:接受请求 --> 发牛响应
- 登录
 - 用户管理 
- 审核用户
 - 禁用账号 / 解禁账号
 - 删除用户
 - 修改用户
 
 - 朋友推荐
 
 
3、需求分析
1)涉及部门:开发部
需求分析是了解要做什么
4、概要设计
信息:
1)注册信息:用户昵称,性别,密码,确认密码
2)登录信息:用户昵称,密码
3)广告信息:图片,说明
4)用户详情:头像,昵称,真实姓名(对接公安系统),性别,职业,宣言…
5)首页推荐:头像,昵称,职业…
数据库设计:
5、前端设计
设计部门:前端设计部
过程:ps画页面原型 --> html页面
前端岗位:
1)传统前端:html / css / ps
2)现在前端:+ js框架 / 前端框架 / VUE前后端分离
一个标签:像java中的一个对象
二、前端知识
1)div标签,在网页中划出一块空间。
占多大 --> 设置样式。
注:div本是只是竖向排列的标签。
2)盒子模型:
3)网页布局:略
前端框架:Bootstrap (v3)。
4)框架:写好了很多东西,拿来用就好了。DIV(do it self)。
使用框架:导入.css和.js文件。
css的类选择器(class)与id选择器(id)的区别是什么?
5)响应式:拉动页面窗口(改变大小、纵横比),内容仍然可以正常显示,自适应。
6)栅格:div块的嵌套,一个横向div可以分很多列。不同的屏幕大小设备,适用于不同的样式。
- 12个分成5份?10/5,剩下的留白。
 - 文本对齐:左中右。
 - 学习框架:了解它能做哪些事情。
 - 图片:显示形状(方、圆、方形圆角)
 
三、操作任务
搭建eclipse环境,熟悉css,安装bootstrap文件
四、前端设计
1、主页
1)导航栏
- 组件:导航、分页、缩略图…
 - 先确定需求,然后开始写自己的前端页面。
 - 勾上 
generate web .xml - 建议整个网页放在一个
container容器中。 - nav:导航
 - 交互:如下拉框,js文件。导航栏中引用了jquery框架(怎么看出来的?)
 - 用行内样式可以覆盖默认样式。在浏览器修改,快速调整,不用每次都修改都刷新浏览器。
 
2)广告栏
- 调整图片大小 / div形状
 - 调整两栏之间的间隙
 
3)系统推荐
- 缩略图
 - 注意div标签的正确对应和闭合。
 
4)其它
- 将导航栏固定在顶端,同时避免遮盖。下面的广告栏加上上边距。
 
2、登录页面
- 新建文件:
register.html - 版权信息固定在底部
 - 栅格系统:左广告,右登录页
 - 表单登录:输入框,单选按钮
 <a>打开新标签页,使用target="_blank"属性。
3、后台管理
- 不太注重前端的体验
 - 用户会有默认的头像
 - 表格:
<tr>,<th>,<td>,<table>。 
五、数据库
1、数据库基础
关系型数据库。
mysql安装流程:安装mysql,安装mysql服务,登录,修改密码,设置远程连接(具体见视频)。
update user set host='%' where user='root';
 
- 官网:mysql.com 。
 
移除mysql:停止服务,mysqld -remove mysql,删除安装文件目录,删除注册表。(使用.exe文件安装的,按照普通软件方式卸载)
-  
?
services.msc -  
自己注册购买几个域名?
 -  
社区版,8.x版本
 -  
准备工作:如果机器上已经有,只要能用就无需安装。若有但不能用,需卸载干净后才能安装。
 -  
my.ini -  
mysql与mysql服务?
 -  
注册表:维护计算机运行的服务列表。
 -  
登录时指定登录端口号,使用参数
-P,使用不同版本的mysql -  
概念区分:数据库服务器,数据库,表,数据。
-  
数据库服务器:安装了数据库软件的服务器。
 -  
应用服务器:安装了应用程序的服务器。(企业中会分开部署)
 -  
数据库:在数据库服务器中创建,用来存放数据表。
 -  
表:用来存放数据,以行为单位。
 
 -  
 
| Java | 数据库 | 
|---|---|
| 一个类 | 一张表 | 
| 类属性 | 表字段 | 
| 属性类型 | 字段类型 | 
| 对象 | 一行 | 
MySQL客户端的安装:navicat_trial。workbench是老版本。
- 本机:
localhost,127.0.0.1 - navicat_trial报错:
1251 - Client does not support authentication protocol requested by server; consider upgrading MySQL client,应该是版本太旧了。 
2、MySQL基本使用
-  
登录:
mysql -u root -p,其中-p并不是password的意思,而是用于指定数据库,参数可以为空(即不选择),在登录后通过use <database_name>来选择数据库。 -  
sql的分类:DDL(数据定义语言), DCL(数据控制语言), DML(数据操作语言), DLL(数据事务语言)
 -  
创建数据库:可在客户端中创建。
 -  
创建数据表
- (sex) 1boy 2girl,使用代号比使用字符串查询更快。
 - (birthday),如果使用
timestamp(记录从1970年开始的毫秒数),则1970前的生日无法表示。可以使用datetime。 - 表名字不使用
user,因为是sql的关键字。 - workbench显然没有navacat好用,比如写入日期时没有选项框,只能手打。
 
 -  
数据类型:int, varchar, double, datatime, timestamp; 长串数字,若不用于运算,一律使用varchar而不用int。
 -  
数据输入:
 -  
主键:能够唯一标识一条字段。一般不参与业务逻辑运算,如学生主键经常使用id而不用学号。
- 修改表结构:在workbench中右键目标表,选择
alter table。 - 设置自动维护主键:勾选·
Auto Increment。记录已经被使用过的主键的最大值,删掉也不影响。 
 - 修改表结构:在workbench中右键目标表,选择
 -  
外键:在一张表中,关联另一张表的约束。
-  
键名冲突:例如学生表有个id,地址表也有个id,如果要创建外键就会有问题。因此,可以给每个表自己的主键加个标识,例如重命名为uid。
(或者给外键加个标识成aid应该也行 ) -  
主外键约束。参照完整性,外键的值得在被关联表中存在。约束的是外键列的值。
 -  
主外键约束的建立。外键不能参照不存在的主键,于是已经被参照的主键也无法被删除。
注意 :在开发过程中,表和表在结构上体现主外键关系,但不创建主外键约束。因为删除(修改)一个主键字段,就要先删除参照它的外键字段,这个外键字段的行可能又被被人参照,表间关联和约束太多导致维护困难。
 -  
主表:表中有一个主键被其他表用来当外键的表。
 -  
从表:把另外一个表中的主键当作自己的外键的表。
 
 -  
 
3、SQL语句
-  
增加:
insert into 表名(字段1, 字段2) values(值1, 值2) -  
修改:
update 表名 set 字段=新值, ... where 条件 -  
删除:
delete from 表名 where 条件 -  
查询:
select 字段1, 字段2... from 表名 where 条件-  
查询部分数据:
limit; -  
模糊查询。关键字
like;通配符% _;%可以代表任意多个字符,_可以代表任意一个字符。 -  
排序。
order by;对查询好像结果排序,ASC(升序) | DESC(降序)
 -  
分组。
group by;分组的目的是统计。常见的统计函数有(max min sum avg count)。
含有goupy by的sql中,select后只能接被分组的字段或统计函数。否则在mysql5.x版本会报错;在8.x中不会报错但是无意义。
 -  
多表连接查询
 -  
子查询
将一个查询的结果作为另一个查询的对象。
案例:和李四住在一起的人有哪些?
分析:首先知道李四住在哪,然后将李四住址作为条件进行查询。
 
 -  
 
-- 1、查询部分数据
select * from users limit 2; -- 返回查询数据的前两个
select * from users limit 0,1; -- 从0到1,注意下标从0开始
-- 2、模糊查询
select * from users where name like %航%;
-- 4、分组
select * from users group by aid; -- 显示每组的第一条数据
select aid, count(id) from users group by aid; -- 查询每个地址人数
-- 5、连接
select * from users,address where users.aid = address.id;
select * from users as u,address a where u.aid = a.id; -- 简化写法
-- 6、子查询 --> 和李四住在一起的人有哪些?
select id,name,aid from users where aid = 
(select aid from users where name="李四");
 
4、数据库设计
回头再改表结构是非常麻烦的。
三大范式:1NF(列的原子性),2NF(直接依赖,即所有其他属性都直接依赖于主键),3NF(每个字段不能传递依赖于主键,如有aid列,就不要address列了)。
原则:数据库的性能,比规范化重要。
数据库设计的过程:
- 找出实体(对象)
 - 找出实体的属性
 - 找出实体之间的关系 (E-R实体关系图)
 - 将ER图转换为表
 
找实体:
-  
用户实体 users:主键 uid,密码 password,头像 photo,昵称 nickname,真实姓名 name,性别 sex,职业 career,宣言 words,
审核状态 chechstatus(待审核1 通过2 未通过3) ,
账号状态 accstatus(正常1 禁用2)
首页推荐 indexstatus(未推荐1 已推荐2)
 -  
广告实体 ad:主键 adid,图片 image,说明
 -  
朋友实体 friends:主键 fid,邀请方 send,被邀请方 accept,邀请状态 status(未处理1 通过2 拒绝3)
 -  
职业表 carrer:主键 cid,名称 cname
 
英文命名尽量通俗,去查的单词可能后来自己都不认识了。
5、数据库实现
表的Comments在哪里体现?
为什么要单独创建一个职业表?
- 头像:用字符串存放路径
 
六、连接数据库:JDBC
Web项目的三大块:前台,后台,数据库。
JDBC:Java DataBase Connectivity
1、使用流程
实现步骤:
- 导入驱动jar包。数据库厂商给java提供了连接db的实现类。java只提供接口,实际调用的数据库厂商的实现。即java的同一套接口可以连接不同的数据库。 
- jar包放到 
/lib目录下 - Add to Build Path,产生一个Referenced Libraries。
 
 - jar包放到 
 - 注册驱动。 
- 记得注册时区
 - localhost | 127.0.0.1
 - 有多个异常:使用父类
Exception捕获所有的异常。 
 - 创建连接。 
desc users可以查看表的属性。
 - 创建业务sql。
 - 创建传送和执行sql的对象。
PrepareStatement- 修改操作,得到的是影响行数。
 - 查询操作,得到的是一张表。返回List,遍历即可。
 
 - 执行sql,根据结果处理业务逻辑。 
- 从语句的影响行数来判断是否成功执行
 
 - 关闭资源。
 
-  
在一行数据中取属性。
- 使用各种
get方法,一个个地取出属性。 - 然后将这些属性构成一个对象。
 
 - 使用各种
 -  
javabean:能够存储数据的一些类。(那记录呢?)
-  
自动生成
get和set方法、构造方法。source --> Generate Getters and Setters
 -  
标准的javabean:又脚vo(值对象),dto(数据传输对象),model(数据类型)
 -  
唯一作用:进行数据存储(封装)和传输。
 
 -  
 
// ResultSet对象的使用示例
while(rs.next()) {String id = rs.getString(1);int sex = rs.getInt("sex");System.out.println(id);
}
 
重载:一件事情,根据不同的条件有不同的实现方式。
对比:突然感觉,python中的字典就很方便。
局部类型推断 var:在java10版本后。
感想:好像,自己写代码的时间就过得特别快。
2、参数处理
-  
sql注入。可以干嘛?
-  
sql的执行计划?
 -  
防御:sql语句使用占位符参数,查询时再给参数赋值,会自动进行类型转换(内部有很多处理),丢掉多余的部分。
将sex值只作为sex的字段值进行设置,而不是组合sql语句。
 -  
组合模糊查询:
nm+"%" 
 -  
 
// _sex = "1 or 1=1"
// 可以被sql注入的语句
String sql  = "select * from users where sex = " + _sex + ";";
PreparedStatement pstmt = conn.prepareStatement(sql);
// 防sql注入的语句
String sql  = "select * from users where sex = ?;";
PreparedStatement pstmt = conn.prepareStatement(sql);
pstmt.setString(1, _sex);select * from users where sex = '1 or 1=1';
 
问题:
pstmt.setString()是将_sex作为一个字符串加入sql语句的,它为什么可以正常执行呢?在什么阶段进行了处理?答:你会发现下面这条语句就是可以正常执行(即使sex的类型为int)。
select * from users where sex = '1 or 1=1';
 
3、简单封装
- 一共只需要一个,也只需要建立一次数据库连接。
 - 开发角度的封装。
 
-  
抽取connection对象的创建。
public static Connection getConn() -  
抽取资源的关闭。
public static void close(Connection conn, PreparedStatement pstmt) 
- 单例模式? 
- 静态块:只在类加载时执行一次。
 - finally关键字:不管catch执不执行,里面都会执行。
 - 条件判断将null写在前面(老手):
null != pstmt;理论上可以避免空值异常。为啥? 
 
感受:在jdbcUtil类中,多层嵌套的
try-catch-finally看起来好丑。
七、MVC系统架构
1、架构介绍
不管java如何,先看生活中如何。
-  
顾客:前端
-  
静态技术:html,css,js,bs
 -  
动态技术:jsp,vue --> 静态数据动态化
 
 -  
 -  
下单:发送请求
 -  
服务员(控制层):控制整个业务流程走向,向前端负责。
- 接受前端请求,并将请求获取到的数据响应前端。
 - 技术:jsp,Servet,SpringMVC,SpringBoot
 
 -  
厨师(服务层):向控制层负责,为控制层提供服务。
- 能够提供各种方法,处理控制层的业务。
 - 思想:面向接口编程。接口定义功能,实现类实现功能。控制层只需要调用接口方法即可,而无需知道具体实现。
 
 -  
配菜师(DAO层):数据访问层,从数据库中获取数据交给服务层,为服务层服务。
- 只负责数据处理,将数据处理的结构反馈给服务层即可。也面向接口编程。
 - 数据库连接技术:JDBC,MyBatis
 
 -  
菜(DB数据库):存放数据。
- MySQL,ORACLE,DB2
 
 
MVC:Model(数据模型),View(视图),Controller(控制)
流程:View --> Controller --> Services --> DAO --> DB
2、系统架构搭建
- src- edu.ft.control- edu.ft.services- edu.ft.dao- edu.ft.util- edu.ft.bean
- WebContent
 
- 层次展示包结构:Package Presentation --> Hierarchical
 
想法:总是只看功能,不关心如何实现,真的好吗?
理解mvc代码执行流程:(以模拟注册为例)
-  
control:把注册信息入库,得到入库的结果,将结果告知用户。
 -  
service:给控制器提供一个能够入库的功能。
 -  
dao:给服务层提供一个能够插入数据库的功能。存粹地处理数据,而不进行任何业务逻辑的处理。
 
- control- Test
- services- impl :实现类- IUsersServiceImpl- IUsersService :一个接口
- dao- impl- IUsersDaoImpl- IUsersDao 
 
- 使用对象传数据,避免冗长的参数列表。
 
问题:注解Override是什么?
问题:给类再包一层接口,不会显得多余吗?
3、小结
- 需求分析:要做什么。
 - 概要设计:做成什么样子。
 - 详细设计:每一个细节怎么做。
 
各个步骤可以并行开始,而不是只能一条龙。
- 执行计划:解析sql
 
4、Web项目运行部署
要实现静态数据的动态化。
-  
服务器:运行项目的一个容器,其实就是一个软件,如tomcat。汽车要放到马路环境,才能启动运行。
 -  
在Eclipse中配置tomcat:windows --> Preferences --> Server --> Runtime Environments
 -  
给项目配置tomcat:右键项目 --> Propenties for … --> Java Build Path --> Libraries
 -  
运行项目(部署到tomcat中):Window --> show view --> 搜索Servers --> open
默认端口号为8080
 -  
访问项目:url:
http://IP(localhost):端口号/项目资源,例如http://localhost:8080/friends/index.html 


