zoukankan      html  css  js  c++  java
  • 图片采用base64压缩,可以以字符串的形式传送base64给服务端转存为图片

    (function () {
        var coverImage = document.querySelector('<div id="coverImage">file</div>');
        //图片压缩
        coverImage.onchange = function () {
            lrz(this.files[0], { 640}, function (results) {
                
                // 你需要的数据都在这里,可以以字符串的形式传送base64给服务端转存为图片。
                var base64 = results.base64;
                function base64UrlToBlob(base64){
                    var bytes=window.atob(base64.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/jpg'});    //return Blob对象
                }
                var formData = new FormData($("#toPic")[1]);
                var blob = base64UrlToBlob(base64);
                console.log(blob);
                formData.append("coverImage",blob);
                $.ajax({
                    url: "xxx",
                    type: "POST",
                    data: formData,
                    dataType: "json",
                    contentType:false,
                    processData: false,         
                    success: function (json) {
                        console.log(json);
                    },
                });
                setTimeout(function () {
                    demo_report('预压的图片', base64, base64.length * 0.5);
                }, 100);
                
            });
        };
    })();
     (function () {
        var coverImage = document.querySelector('<div id="coverImage">file</div>');
        //图片压缩
        coverImage.onchange = function () {
            lrz(this.files[0], { 640}, function (results) {
            
                // 你需要的数据都在这里,可以以字符串的形式传送base64给服务端转存为图片。
                var base64 = results.base64;
                function base64UrlToBlob(base64){
                    var bytes=window.atob(base64.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/jpg'});    //return Blob对象
                }
                var formData = new FormData($("#toPic")[1]);
                var blob = base64UrlToBlob(base64);
                console.log(blob);
                formData.append("coverImage",blob);
                $.ajax({
                    url: "xxx",
                    type: "POST",
                    data: formData,
                    dataType: "json",
                    contentType:false,
                    processData: false,         
                    success: function (json) {
                        console.log(json);
                    },
                });
                setTimeout(function () {
                    demo_report('预压的图片', base64, base64.length * 0.5);
                }, 100);
                
            });
        };
    })();

    作者:freddyhuang
    出处:https://www.cnblogs.com/freddyhuang
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

  • 相关阅读:
    asp.net 中的viewstate用法?
    .net中 过滤 指定 字符串
    js中replace的用法
    restart
    外部函数
    JQuery实现Ajax 根据商品名称自动显示价格
    ListView中命令行按钮应用;
    GridView中获取行数和列数
    全局应用程序类Global
    如何获取gridview中模板列中控件的值?
  • 原文地址:https://www.cnblogs.com/freddyhuang/p/5988781.html
Copyright © 2011-2022 走看看