js小工具---本地图片转换为base64编码数据

今天用jmeter对图片对比进行性能测试，post请求为json请求，图片为Base64编码后的图片数据。所以需要将一张本地图片生成base64编码，找到一个js小工具，记录在这儿便于以后复用。

效果：

js代码如下：

    <!DOCTYPE> # 这是将代码复制到一个文件后命名为html格式文件后用浏览器打开即可使用小工具转换
    <input type="file" id="img">  
    <br/>  
    <button id="start">开始转换</button>  
    <div>  
        预览：<img id="imgShow" src="" alt="">  
    </div>  
    <b>Base64数据：</b>  
    <textarea rows=15 cols=60 id="conte"></textarea>  
    <button id='cpData'>复制</button><span id="succ"></span>  
    <div id="len">数据长度：</div>  
    <script>  
        var img = document.getElementById('img')  
            , imgShow = document.getElementById('imgShow')  
            , conte = document.getElementById('conte')  
            , len = document.getElementById('len')  
            , start = document.getElementById('start')  
            , cpData = document.getElementById('cpData');  
      
        cpData.addEventListener('click', cpDataF);  
        start.addEventListener('click', startt);  
      
        /*转换函数*/  
        function startt() {  
            var imgFile = new FileReader();  
            imgFile.readAsDataURL(img.files[0]);  
            imgFile.onload = function () {  
                var imgData = this.result; //base64数据    
                imgShow.setAttribute('src', imgData);  
                conte.value = imgData;  
                len.innerHTML += imgData.length;  
            }  
        }  
      
        /*复制数据*/  
        function cpDataF() {  
            conte.select(); // 选择对象    
            var cpd=document.execCommand("Copy"); // 执行浏览器复制命令    
            cpd ? document.getElementById('succ').innerHTML = '复制成功' :　console.warn('复制失败');  
            window.setTimeout(function () {  
                document.getElementById('succ').innerHTML = '';  
            }, 1000)  
        }  
    </script>