<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    posts - 1,  comments - 3,  trackbacks - 0
    直接提交base64編碼圖片數據,過大的話后臺會出現轉發錯誤問題。
    一個不錯的解決方式就是將base64編碼的圖片數據轉換為Blob(與File相似)并添加到form中提交。下面是代碼:

    /**
     * @param base64Codes
     *            圖片的base64編碼
     
    */
    function sumitImageFile(base64Codes){
        var form=document.forms[0];
        
        var formData = new FormData(form);   //這里連帶form里的其他參數也一起提交了,如果不需要提交其他參數可以直接FormData無參數的構造函數
        
        //convertBase64UrlToBlob函數是將base64編碼轉換為Blob
        formData.append("imageName",convertBase64UrlToBlob(base64Codes));  //append函數的第一個參數是后臺獲取數據的參數名,和html標簽的input的name屬性功能相同
        
        //ajax 提交form
        $.ajax({
            url : form.action,
            type : "POST",
            data : formData,
            dataType:"text",
            processData : false,         // 告訴jQuery不要去處理發送的數據
            contentType : false,        // 告訴jQuery不要去設置Content-Type請求頭
            
            success:function(data){
                window.location.href="${ctx}"+data;
            },
            xhr:function(){            //在jquery函數中直接使用ajax的XMLHttpRequest對象
                var xhr = new XMLHttpRequest();
                
                xhr.upload.addEventListener("progress", function(evt){
                    if (evt.lengthComputable) {
                        var percentComplete = Math.round(evt.loaded * 100 / evt.total);  
                        console.log("正在提交."+percentComplete.toString() + '%');        //在控制臺打印上傳進度
                    }
                }, false);
                
                return xhr;
            }
            
        });
    }

    /**
     * 將以base64的圖片url數據轉換為Blob
     * @param urlData
     *            用url方式表示的base64圖片數據
     
    */
    function convertBase64UrlToBlob(urlData){
        
        var bytes=window.atob(urlData.split(',')[1]);        //去掉url的頭,并轉換為byte
        
        //處理異常,將ascii碼小于0的轉換為大于0
        var ab = new ArrayBuffer(bytes.length);
        var ia = new Uint8Array(ab);
        for (var i = 0; i < bytes.length; i++) {
            ia[i] = bytes.charCodeAt(i);
        }

        return new Blob( [ab] , {type : 'image/png'});
    }

    上面的代碼在chrome中測試通過,其他瀏覽器未測試。
    @Author :zlong


    @Source:
    @Author:zlong
    posted on 2013-11-10 01:29 jidebingfeng 閱讀(24492) 評論(3)  編輯  收藏


    FeedBack:
    # re: javascript將base64編碼的圖片數據轉換為file并提交[未登錄]
    2016-02-23 16:05 | aa
    轉blob 不兼容怎么做?  回復  更多評論
      
    # re: javascript將base64編碼的圖片數據轉換為file并提交
    2016-04-22 14:26 | Rhine
    太棒了,試了好多方法,終于看到這個了!感謝  回復  更多評論
      
    # re: javascript將base64編碼的圖片數據轉換為file并提交
    2016-08-16 15:23 | njbble
    感謝  回復  更多評論
      

    只有注冊用戶登錄后才能發表評論。


    網站導航:
     
    <2016年8月>
    31123456
    78910111213
    14151617181920
    21222324252627
    28293031123
    45678910

    常用鏈接

    留言簿

    隨筆分類

    隨筆檔案

    文章檔案

    搜索

    •  

    最新評論

    主站蜘蛛池模板: 亚洲成a人片在线看| 亚洲综合一区二区精品久久| 亚洲风情亚Aⅴ在线发布| 久草免费在线观看视频| 亚洲精品日韩专区silk| 57pao一国产成视频永久免费| 久久精品国产亚洲AV麻豆网站 | 亚洲成在人线aⅴ免费毛片| 无码国产精品一区二区免费虚拟VR| 久久精品国产亚洲AV麻豆不卡| 男人进去女人爽免费视频国产| 亚洲ⅴ国产v天堂a无码二区| 久久国产免费一区二区三区| 91天堂素人精品系列全集亚洲| 永久免费在线观看视频| 亚洲精品第一综合99久久| 成年大片免费视频| 美女视频黄.免费网址| 免费中文字幕在线观看| 成人妇女免费播放久久久| 亚洲人成网77777色在线播放 | 国产在线观看麻豆91精品免费| 亚洲成a人不卡在线观看| 亚洲精品动漫免费二区| 国产精品成人亚洲| 亚洲人成电影在线播放| 国产免费一区二区三区在线观看 | 国产国产人免费人成免费视频| 免费又黄又爽又猛大片午夜| 国产亚洲精品自在久久| 黄色免费网站网址| 无套内射无矿码免费看黄| 亚洲AV乱码久久精品蜜桃| 免费三级毛片电影片| 粉色视频免费入口| 亚洲日本精品一区二区| 在线免费观看色片| 两个人看的www视频免费完整版| 亚洲综合久久久久久中文字幕| 免费一级毛片在播放视频| 久久久久成人片免费观看蜜芽|