頭像截圖上傳三種方式之一（一個簡單易用的flash外掛程式）（asp.net版本）

標籤：style   blog   http   java   color   os   

flash中有著作權聲明，不適合商業開發。這是官網地址：http://www.hdfu.net/ 

本文參考了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

<embed></embed>標籤之間的代碼是負責連結到avatar.swf和upfile.aspx後台代碼和預設照片，根據個人需要可以進行修改。

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 
關於這兩個外掛程式的介紹，都可以通過以上網址瞭解。