今天完成的事情：

task9图片预览+上传返回url：

本地预览：

1、使用URL.createObjectURL(低版本浏览器不兼容)

URL.createObjectURL()方法会根据传入的参数创建一个指向该参数对象的URL. 这个URL的生命仅存在于它被创建的这个文档里. 新的对象URL指向执行的File对象或者是Blob对象.

每次调用createObjectURL,一个新的URL对象就被创建.即使已经为同一个文件创建过一个URL. 若不再需要这个对象,要使用URL.revokeObjectURL()方法. 当页面被关闭,浏览器会自动释放，性能优化，不用即消除。

#image.src=window.URL.createObjectURL(file)

 2、html5 FileReader API（也存在兼容性问题）

异步API，将文件读入内存，读取文件数据；

FileReader接口有4个方法，其中3个用来读取文件，另一个用来中断读取。无论读取成功或失败，方法并不会返回读取结果，这一结果存储在result属性中。

var reader=new FileReader()

    reader.readAsDataURL(files);

    reader.onload=function () {

        #image.src=this.result

}

图片上传：

FormData 对象：

用一些键值对来模拟表单控件，还可以使用 XMLHttpRequest 的 send() 方法来异步的提交表单。与普通的 Ajax 相比，使用 FormData 的最大优点就是可以异步上传二进制文件。

创建FormData对象，并用append（name,file）方法向其添加字段；可为file或blob值。

设置请求头：

anjularjs对于post和get请求默认的Content-Type header 是application/json，要让当前的request成为一个Multipart/form-data请求，可以通过设置‘Content-Type’: undefined，这样浏览器不仅帮我们把Content-Type 设置为 multipart/form-data，还填充上当前的boundary，如果手动设置为： ‘Content-Type’: multipart/form-data，后台会抛出异常：the current request boundary parameter is null。 

设置transformRequest: angular.identity：

anjularjs transformRequest 函数将序列化formdata 对象。

withCredentials：

CORS跨域请求时，设置是否附带cookie

预览选中图片：

‍‍上传返回服务器图片url：‍‍

明天计划的事情：

task10表单输入验证

遇到的问题：

angluar中导入UE富文本编辑器，网上找的代码，导入刷新后各种错误，找时间解决；

angluar图片上传测试，图片URL本地预览时数据双向绑定无效，设置了change（）事件，console.log()已经打印出URL，但无法渲染出预览图，但用click事件再执行时函数报错，未定义文件（第二次执行没传入文件），图片会显示，也就是上一次执行的URL生效....

测试时，弹出no login；

查看reques headers信息没有cookie信息，重新在登录页登录后解决；

收获：

如上