一、今天完成的事情

1.今天听了老大讲了一天的java课。

2.完成图片上传功能，进度条也解决了。

3学习正则表达式。

二、明天计划的事情

继续任务10。

三、遇到的问题

1. 上传图片的，预览图片没有效果。如图：

具体原因还在查找，明天解决。

2. 登录页的表单验证，原先在任务5有完成一些还差飞非法字符验证，还想不能用angular内置命令动态生成，明天解决。

拓展一下：说一下四种常见的验证表单方式

1）浏览器端验证

传统上，表单数据一般都通过浏览器端的 Javascript 验证。浏览器端的验证速度快，若有不符合要求的输入，响应信息快速的返回给用户。由于验证数据不需要提交给服务器，不会加重服务器的负载。一个浏览器端验证的过程如图 1 所示，表单提交，若通过验证则提交服务器处理，不成功则回馈给用户。

 浏览器端验证原理图

2）浏览器端和服务器端双重验证

浏览器端和服务器端双重验证方法在浏览器端验证方法基础上增加服务器端的验证，其原理如图 2 所示，该方法增加服务器端的验证，弥补了传统浏览器端验证的缺点。若表单输入不符合要求，浏览器端的 Javascript 验证能很快地给出响应，而服务器端的验证则可以防止恶意用户绕过 Javascript 验证，保证最终数据的准确性。

浏览器端和服务器端双重验证原理图

3）服务器端验证

综合上述两种验证方法，现在考虑使用服务器端的验证方法，该方法结构非常简单，其原理如图 3 所示。客户端负责表单提交，服务器端验证表单，若发现错误数据，则回传表单页面，错误信息被加到同一页面中。若验证通过，则处理表单。

服务器端验证原理图

4）基于 Ajax 技术的验证

基于 Ajax 技术的表单验证技术综合了服务器端验证，浏览器端及服务器端双重验证方法的优点，摒弃了两者的缺点。服务器端验证方法结构清晰，可以防止恶意攻击，其主要问题在于若输入错误表单信息，需重传整个页面，同时若同一页面有多个表单，回传整个页面可能会增加用户等待的时间。浏览器端及服务器端的双重验证响应速度快，其问题在于代码冗余。

基于 Ajax 技术的验证方法也需要做两次验证：首先是回馈验证，无论表单数据准确与否，服务器均给出反馈信息，其作用等同于双重验证中的浏览器端的验证；表单处理前的验证防止恶意修改，其作用等同于双重验证中的服务器端的验证。其原理如图 5 所示，一旦有表单提交，首先构建表单信息字段，交由 Ajax engine 发送给服务器端验证，服务器将验证结果发送给用户，客户端根据回馈信息，判断表单输入是否正常，在 Ajax 技术下，对用户而言，以上操作均在后台运行，不会影响当前页面各表单的状态。若是非法输入，则回馈提示信息给用户；若是正常输入，客户端将按照正常方法提交表单。为了防止恶意修改，表单处理之前还需验证，此步验证与之前验证共用代码。

基于 Ajax 技术验证原理图

四、收获

1.听老大的java课还是受益良多。

2.学习了如何上传图片，写进度条。

3.学习了四种常见的表单验证方式。