javaweb_project

数据库设计

1） 抽取实体 : 用户登录信息、用户详情信息 、 日志 、 回贴 、 主人回复
2） 分析其中的属性：
- 用户登录信息：账号、密码、头像、昵称
- 用户详情信息：真实姓名、星座、血型、邮箱、手机号…
- 日志：标题、内容、日期、作者
- 回复：内容、日期、作者、日志
- 主人回复：内容、日期、作者、回复
3） 分析实体之间的关系
- 用户登录信息 ： 用户详情信息 1：1 PK
- 用户 ： 日志 1：N
- 日志 ： 回复 1：N
- 回复 ： 主人回复 1：1 UK
- 用户 ： 好友 M ： N
3.数据库的范式：
1） 第一范式：列不可再分
2） 第二范式：一张表只表达一层含义（只描述一件事情）
3） 第三范式：表中的每一列和主键都是直接依赖关系，而不是间接依赖
4.数据库设计的范式和数据库的查询性能很多时候是相悖的，我们需要根据实际的业务情况做一个选择：

• 查询频次不高的情况下，我们更倾向于提高数据库的设计范式，从而提高存储效率
• 查询频次较高的情形，我们更倾向于牺牲数据库的规范度，降低数据库设计的范式，允许特定的冗余，从而提高查询的性能

Cookie

Cookie

1. 创建Cookie对象
2. 在客户端保存Cookie

@WebServlet("/cookies01")
public class CookieServlet01 extends HttpServlet {
    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        Cookie cookie = new Cookie("uname", "jim");
        response.addCookie(cookie);
        request.getRequestDispatcher("hello.html").forward(request,response);
    }
}

4. 设置Cookie的有效时长

  cookie.setMaxAge(60)  ， 设置cookie的有效时长是60秒
  cookie.setDomain(pattern);
  cookie.setPath(uri);

5. Cookie的应用：
   4-1: 记住用户名和密码十天 setMaxAge(60 * 60 * 24 * 10)
   4-2: 十天免登录

Kaptcha

1. 为什么需要验证码
2. kaptcha如何使用:
   • 添加jar
     
   • 在web.xml文件中注册KaptchaServlet，并设置验证码图片的相关属性

 	<servlet>
        <servlet-name>KaptchaServlet</servlet-name>
        <servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>
        <init-param> <!--设置验证码属性-->
            <param-name>kaptcha.border.color</param-name>
            <param-value>red</param-value>
        </init-param>
    </servlet>
    <servlet-mapping>
        <servlet-name>KaptchaServlet</servlet-name>
        <url-pattern>/kaptcha.jpg</url-pattern>
    </servlet-mapping>

  - 在html页面上编写一个img标签，然后设置src等于KaptchaServlet对应的url-pattern

<img src="kaptcha.jpg">

3. kaptcha验证码图片的各个属性在常量接口：Constants中
   

4. KaptchaServlet在生成验证码图片时，会同时将验证码信息保存到session中

		HttpSession session = request.getSession();
        Object obj = session.getAttribute("KAPTCHA_SESSION_KEY");
        System.out.println("obj = " + obj);

  因此，我们在注册请求时，首先将用户文本框中输入的验证码值和session中保存的值进行比较，相等，则进行注册。

JS中的正则表达式

（1）正则表达式的使用三步骤：

1. 定义正则表达式对象
   正则表达式定义有两个方式：
   1. 对象形式
      var reg = new RegExp(“abc”)
   2. 直接量形式
      var reg = /abc/;
   3. 匹配模式：
      - g 全局匹配
      - i 忽略大小写匹配
      - m 多行匹配
      - gim这三个可以组合使用，不区分先后顺序
      例如： var reg = /abc/gim , var reg = new RegExp(“abc”,“gim”);

        var reg = /o/gi ;        // g表示匹配的模式，表示全文匹配 ; i表示忽略大小写匹配

2. 定 义待校验的字符串
3. 校验

（2)元字符
. , \w , \W , \s , \S , \d , \D , \b , ^ , $

（3)[]表示集合
[abc] 表示 有a或者b或者c都匹配
[^abc] 表示取反，只要不是a不是b不是c就匹配
[a-c] 表示a到c这个范围匹配

（4) 出现的次数
* 表示多次 （0 ~ n ）
+ 至少一次 ( >=1 )
? 最多一次 (0 ~ 1)
{n} 出现n次
{n,} 出现n次或者多次
{n,m} 出现n到m次

原生的Ajax（异步的JavaScript and XML）

目的： 用来发送异步的请求，然后当服务器给我响应的时候再进行回调操作
好处： 提高用户体验；局部刷新：降低服务器负担、减轻浏览器压力、减轻网络带宽压力
第一步： 客户端发送异步请求；并绑定对结果处理的回调函数
1)
2) 定义ckUname方法：
- 创建XMLHttpRequest对象
- XMLHttpRequest对象操作步骤：
- open(“GET”,url,true)
- onreadyStateChange 设置回调
- send() 发送请求
- 在回调函数中需要判断XMLHttpRequest对象的状态:
readyState(0-4) , status(200)
0 － （未初始化）还没有调用send()方法
1 － （载入）已调用send()方法，正在发送请求
2 － （载入完成）send()方法执行完成，已经接收到全部响应内容
3 － （交互）正在解析响应内容
4 － （完成）响应内容解析完成，可以在客户端调用了

第二步：服务器端做校验，然后将校验结果响应给客户端

Vue

1) {{}} - 相当于innerText
2) v-bind:attr 绑定属性值。例如，v-bind:value - 绑定value值
   简写：    :value
3) v-model 双向绑定
   v-model:value   , 简写  v-model
4) v-if , v-else , v-show
   v-if和v-else之间不能有其他的节点
   v-show是通过样式表display来控制节点是否显示
5) v-for 迭代
   v-for="fruit in fruitList"
6) v-on 绑定事件
7) 其他：
   - trim:去除首尾空格 , split() , join()
   - watch表示侦听属性
   - 生命周期

Axios

Axios是Ajax的一个框架,简化Ajax操作
Axios执行Ajax操作的步骤：

1. 添加并引入axios的js文件

2-1. 客户端向服务器端异步发送普通参数值
- 基本格式： axios().then().catch()
- 示例：
axios({
method:“POST”,
url:“…”,
params:{
uname:“lina”,
pwd:“ok”
}
})
.then(function(value){}) //成功响应时执行的回调 value.data可以获取到服务器响应内容
.catch(function(reason){}); //有异常时执行的回调 reason.response.data可以获取到响应的内容

                                                               reason.message / reason.stack 可以查看错误的信息

2-2. 客户端向服务器发送JSON格式的数据
- 什么是JSON
JSON是一种数据格式
XML也是一种数据格式
XML格式表示两个学员信息的代码如下：


jim
18


tom
19


JSON格式表示两个学员信息的代码如下：
[{sid:“s001”,age:18},{sid:“s002”,age:19}]
- JSON表达数据更简洁，更能够节约网络带宽
- 客户端发送JSON格式的数据给服务器端
1) 客户端中params需要修改成： data:
2) 服务器获取参数值不再是 request.getParameter()…
而是：
StringBuffer stringBuffer = new StringBuffer(“”);
BufferedReader bufferedReader = request.getReader();
String str = null ;
while((str=bufferedReader.readLine())!=null){
stringBuffer.append(str);
}
str = stringBuffer.toString() ;

3) 我们会发现 str的内容如下：
   {"uname":"lina","pwd":"ok"}

-  服务器端给客户端响应JSON格式的字符串，然后客户端需要将字符串转化成js Object

2-3.Servlet中Java对象与JSON字符串互转
1)JSON字符串–>Java对象

StringBuffer stringBuffer = new StringBuffer("");
BufferedReader bufferedReader = request.getReader();
String str = null;
while ((str=bufferedReader.readLine())!=null){
    stringBuffer.append(str);
}
str = stringBuffer.toString();
Gson gson = new Gson();
// 8.将JSON字符串还原为Java对象
Student student = gson.fromJson(str, Student.class);
    

2)Java对象转为JSON

User user = new User();
user.setUname("liuxinyu");
user.setPwd("000930");
//Java对象转为JSON字符串
String userJsonStr = gson.toJson(user);
response.setCharacterEncoding("utf-8");
response.setContentType("appliation/html;charset=utf-8");
PrintWriter out = response.getWriter();
out.write(userJsonStr);

3)Js字符串转为JSON

var str = "{\"uname\":\"lina\",\"age\":20}";
var user =  JSON.parse(str);

4）JSON对象转为Js字符串

var user={"uname":"lina","age":99};
var userStr = JSON.stringify(user)