本地图片预览+blob使用

说明：做要用到file标签和 html5 Blob对象

方法1：使用file标签

请选择一个文件：
    
    

// 将文件以Data URL形式进行读入页面
    function readAsDataURL(){
        // 检查是否为图像类型
        var simpleFile = document.getElementById("file").files[0];
        if(!/image\/\w+/.test(simpleFile.type)) {
            alert("请确保文件类型为图像类型");
            return false;
        }
        var reader = new FileReader();
        // 将文件以Data URL形式进行读入页面
        reader.readAsDataURL(simpleFile);
        reader.onload = function(e){
            console.log(this.result);
            result.innerHTML = '';
        }
    }

    

        方法2 ：使用Blob对象，把一张图片arrayBuffer缓存保存到Blob对象，然后给对象一个url.  图片arrayBuffer可通过websocket获取。

   

附加内容：针对ArrayBuffer内容进行操作显示