头像截图上传三种方式之一（一个简单易用的flash插件）（asp.net版本）

2022-10-18 14:20:05

本文参考了http://blog.csdn.net/yafei450225664/article/details/12855915 并且加入了自己的解析，以供之后的参考。

官网提供的demo包，包含了php，jsp，asp，aspx的demo。

1、Demo中，avatar.swf是执行上传的flash文件；default.jpg是默认显示的图片；demo.html是demo，可以直接复制里面的代码；index.html 是下载地址，对程序不起作用。upfile.aspx是执行上传的后台文件，其实我们可以用一般处理程序代替，没必要写aspx，xml的实际作用不了解无需修改。

2.demo.html中，有两个层，altContent存放flash，里面的东西最好不要修改，我们只需修改里面引用flash的路径及默认图片，avatar_priview用于显示上传成功后的图片，可以删除。JS中uploadevent上传成功后执行，status表示响应报文值，返回1则表示成功，执行

<script type="text/javascript">
     function uploadevent(status, picUrl, callbackdata) {
         //alert(picUrl); //后端存储图片
         //    alert(callbackdata);
         status += ‘‘;
         switch (status) {
             case ‘1‘:
                 var time = new Date().getTime();
                 var filename162 = picUrl + ‘_162.jpg‘;
                 var filename48 = picUrl + ‘_48.jpg‘;
                 var filename20 = picUrl + "_20.jpg";

                 document.getElementById(‘avatar_priview‘).innerHTML = "头像1 : <img src=‘" + filename162 + "?" + time + "‘/> <br/> 头像2: <img src=‘" + filename48 + "?" + time + "‘/><br/> 头像3: <img src=‘" + filename20 + "?" + time + "‘/>";

                 break;
             case ‘-1‘:
                 window.location.reload();
                 break;
             default:
                 window.location.reload();
         }
     }
  

 </script>

View Code

这段代码只是用于显示上传成功后的图片，可以根据个人需要进行修改。

3.html中的代码如下

<div id="altContent">
    <object id="myMovieName" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
        codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" 
        height="450" width="650">
        <param name="movie" value="avatar.swf" />
        <param name="quality" value="high" />
        <param name="bgcolor" value="#FFFFFF" />
        <param name="flashvars" 
            value="imgUrl=./default.jpg&amp;uploadUrl=./upfile.aspx&amp;uploadSrc=false" />
        <embed align="" allowscriptaccess="always" bgcolor="#FFFFFF" 
            flashvars="imgUrl=./default.jpg&amp;uploadUrl=./upfile.aspx&amp;uploadSrc=false" 
            height="450" name="myMovieName" 
            pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" 
            src="./avatar.swf" type="application/x-shockwave-flash" width="650" 
            wmode="transparent"></embed>
</EMBED>
</object>
</div>
<div id="avatar_priview">
</div>

View Code

4.后台代码

<%@Import NameSpace="System.IO"%>
<%@Import NameSpace="System"%>
<% @ Page Language="C#" %>
<%

DateTime dtStart = TimeZone.CurrentTimeZone.ToLocalTime(new DateTime(1970,1,1));
DateTime dtNow = DateTime.Parse(DateTime.Now.ToString());
TimeSpan toNow = dtNow.Subtract(dtStart);
string timeStamp = toNow.Ticks.ToString();
timeStamp = timeStamp.Substring(0,timeStamp.Length - 7);

String savePath = "./";
String savePicName = timeStamp;

String file_src = savePath + savePicName + "_src.jpg";
String filename162 = savePath + savePicName + "_162.jpg";
String filename48 = savePath + savePicName + "_48.jpg";
String filename20 = savePath + savePicName + "_20.jpg";

//获取原图和修改大小后的三张图片：
String pic = Request.Form["pic"];
String pic1 = Request.Form["pic1"];
String pic2 = Request.Form["pic2"];
String pic3 = Request.Form["pic3"];

/*并通过File保存，当然，我们如果只需要一张图片，可以删除多余代码，也可以修改保存图片的地址。有了图片的地址，我们可以直接在这里将图片地址保存到数据库中。

这里要注意的是，返回响应报文

Response.Write("{\"status\":1}");是不能修改的，如果改为其他值，比如图片路径，那么后台执行上传是可以成功的，但前台无法响应上传成功，不能弹出上传成功的框。

如果我们需要把后台处理后的路径返回前台，可以用Session或静态变量在后台保存值。*/

//原图
if (pic.Length == 0) {
}else {
byte[] bytes = Convert.FromBase64String(pic); //将2进制编码转换为8位无符号整数数组

FileStream fs =new FileStream(Server.MapPath(file_src),System.IO.FileMode.Create);
fs.Write(bytes, 0, bytes.Length);
fs.Close();
}

byte[] bytes1 = Convert.FromBase64String(pic1); //将2进制编码转换为8位无符号整数数组.
byte[] bytes2 = Convert.FromBase64String(pic2); //将2进制编码转换为8位无符号整数数组.
byte[] bytes3 = Convert.FromBase64String(pic3); //将2进制编码转换为8位无符号整数数组.

//图1
FileStream fs1 =new FileStream(Server.MapPath(filename162),System.IO.FileMode.Create);
fs1.Write(bytes1, 0, bytes1.Length);
fs1.Close();

//图2
FileStream fs2 =new FileStream(Server.MapPath(filename48),System.IO.FileMode.Create);
fs2.Write(bytes2, 0, bytes2.Length);
fs2.Close();

//图3
FileStream fs3 =new FileStream(Server.MapPath(filename20),System.IO.FileMode.Create);
fs3.Write(bytes3, 0, bytes3.Length);
fs3.Close();

String picUrl = savePath + savePicName;

Response.Write("{\"status\":1,");
Response.Write("\"picUrl\":\""+picUrl+"\"}");

接下来推出头像截图上传三种方式之二（SWFUpload）（asp.net版本）和三（jquery插件）

SWFUpload是一个客户端文件上传工具，最初由Vinterwebb.se开发，它通过整合Flash与JavaScript技术为WEB开发者提供了一个具有丰富功能继而超越传统<input type="file" />标签的文件上传模式。另一个Flash插件用起来比较简单，支持截图、本地摄像头拍照上传，
关于SWFUpload的介绍，可以查看百度百科，博客园中也有SWFUpload2.5的中文翻译文档。
http://www.cnblogs.com/youring2/archive/2012/07/13/2590010.html
SWFUpload .Net安装包和官方Demo：
http://download.csdn.net/detail/qq14039056961/5246596
关于这两个插件的介绍，都可以通过以上网址了解。

头像截图上传三种方式之一（一个简单易用的flash插件）（asp.net版本）,布布扣,bubuko.com

头像截图上传三种方式之一（一个简单易用的flash插件）（asp.net版本）

码农公寓

相关文章