图片压缩后上传Flash-职坐标

图片压缩后上传Flash

小标 2018-03-08 来源：网络阅读 852 评论 0

摘要：图片压缩后上传！Flash图片极速上传！提供参数控制！

图片压缩后上传！Flash图片极速上传！提供参数控制！

需求

如果用户使用数码相机照的照片一般都会在很大！（2M~5M）

一般网站都会在用户上传照片后对照片进行适当压缩，以提高网页浏览时照片的加载速度。

如果可以在客户端对照片压缩后上传，可以节省带宽，并且也减轻服务器压力。会有很好的用户体验！以前实现这样的功能都需要借助上传组件！

其实使用Flash 10.0就可以实现照片压缩后上传。

原理

首先使用Flash的上传功能让用户选择要上传的照片。

加载选择照片的数据到Flash中。(此功能需要Flash10.0以上版本)

将数据加载到Flash的image组件中。

将image按照合适大小进行缩放。

在对image的显示区域进行Flash截图存入Bitmap。

将Bitmap转换为Jpg格式数据。

使用post方式将Jpg数据发送到服务器端！

调用方法

<!DOCTYPE html>
<html>
<head>
    <title>图片压缩上传</title>
    <script type="text/javascript" src="swfobject.js"></script>
</head>
<body onload="showFlash();">
 
    <div id="divFlash">
        加载中...
    </div>
    <script type="text/javascript">
        function showFlash() {
            var params = {
                serverUrl: "saveImage.aspx",
                jsFunction: "flashReturn",
                imgWidth:500,
                imgHeight:500,
                imgQuality:80,
                btnText:'图 片'
            }
            swfobject.embedSWF("imgZipUpload.swf", "divFlash", "100", "30", "10.0.0", "expressInstall.swf", params);
        }
 
        function flashReturn(type, str) {
            if(type == 'error')
            {
                alert(str);
            }
            else if (type == 'complete')
            {
                var img1 = document.getElementById('img1');
                img1.style.display = "block";
                img1.src = str;
            }
        }
    </script>
    <img id="img1" style="display:none;" />
</body>
</html>

Flash参数说明

图片压缩后上传Flash