头像（图片上传）FileReader 方法

图片上传到服务器方法

代码如下：

HTML ：

        

                

                    头像
                
                

                    

                        
                    
                
                

                    

                        ![](images/gwclogo.png)
                    
                    
                
        
    

js 代码：

$("#fileUpload").on('change', function() {

                if(typeof(FileReader) != "undefined") {

                    var image_holder = $("#userImg");
                    image_holder.empty();

                    var reader = new FileReader();  //引入方法名。
                    reader.onload = function(e) {

                        $("", { //创建img 然后追加进去
                            "src": e.target.result, //target中的result属性的值，就是该文件的base64数据
                            "style": "width:45px;height:45px;border-radius: 45px;",
                            "class": "thumb-image",
                            "id": "sc-img"
                        }).appendTo(image_holder);

                        var ar = new Array();
                        var ee = e.target.result;
                        var data = ee.substr(ee.indexOf('base64,') + 7); // 16+7=23

                        ar.InterfaceAddress = "这里接入后台提供的接口代码名";
                        ar.Pic = data; //传入照片流。
                        ar.username = 999;
                        ar.id = localStorage.getItem("UserId");
                        ar.fileName = 'userHead';
                        ar.tm = '1';
                        ar.Handshake_Time = CurentTime('-', true);
                        aes(ar, "endHeadpic");
                        console.log(ar);
                        //以上ar 数组 套用封装好的代码转换成json数组 和 数据，再用 ajax  post到后台返回 rs。
    

                    }

                    image_holder.show();
                    reader.readAsDataURL($(this)[0].files[0]); //将文件读取为本地url 通过readAsDataURL读取数据成功后，就会触发load事件

                } else {
                    alert("你的浏览器不支持FileReader.");
                }

            });
            
            function endHeadpic(rs) { //关于ajax 已经封装成JS文件 我们公司可直接这样套用传入后台数据中。
                
                console.log(rs);
                
            }

以上就是传入我们后台服务器的流程代码。