關(guān)于上傳頭像并且截圖網(wǎng)上應(yīng)該有很多資料，大多都是JQuery插件，用起來不是很方便

本文所介紹的方法將快速完成一個(gè)“上傳頭像圖片并截圖”，只需要修改少量的代碼

?

我們先來看看完成后的效果：

下面我們?cè)诳焖俅罱ㄒ粋€(gè)頭像上傳的MVC3程序：

前臺(tái)頁面的適當(dāng)位置加入下面的代碼：

<input type="button" value="上傳" οnclick="clll()" /><div id="content" style="width: 630px; height: 360px; padding: 10px; display: block;border: 1px solid #ddd;"></div><div id="info" style="width: 630px; height: auto; line-height: 20px; border: 1px solid #ddd;border-top: 0px; font-size: 12px; padding: 10px;"><p style="color: #666">圖片說明：<br />每次上傳的文件覆蓋前面的文件。上傳后的路徑為: ~/upload/<br />以字母b結(jié)尾的為大圖（130x130 像素），以字母m結(jié)尾的為中圖（55x55像素），以s結(jié)尾的為小圖（35x35像素）</p></div>

<div id="content"></div>

Flash的在content顯示，當(dāng)然，這個(gè)也可以配置，我們可以在js代碼中配置

在頁面的適當(dāng)位置加入下面的代碼：

<script src="@Url.Content("~/Content/themes/avatar/tangram-custom-full-yui.js")" type="text/javascript"></script> <script type="text/javascript">var info = baidu.g("info");var options = {uploadURL: "@Url.Action("UploadAvatar", "Account")", tipHandle: function (tip) {alert(tip);}, uploadCallBack: function () {// 處理完畢后的操作。例如 window.location ='xxxxx/xxxxx';alert("頭像更換成功。");}, createOptions: {id: "flashID", url: "@Url.Content("~/Content/themes/avatar/avatarMaker.swf")", width: "630px", height: "360px", container: "content"}};var up = new baidu.flash.avatarMaker(options);var t = function () {var d = new Date();return [d.getHours(), d.getMinutes(), d.getSeconds()].join(":")};function clll() { up.upload(); } </script>

?

uploadURL為你的上傳處理函數(shù)

createOptions里面可以配置一些flash的信息。

?

在后臺(tái)響應(yīng)函數(shù)中添加適當(dāng)?shù)拇a：

public ActionResult UploadAvatar(){int filecount = Request.Files.Count;//獲得MIME文件流 的文件數(shù)量Stream[] resStreamArray = new Stream[filecount];//建立文件流數(shù)組string[] strFilePathArray = new string[filecount];//建立服務(wù)器文件地址數(shù)組long[] iBufferSizeArray = new long[filecount];//建立文件流字節(jié)長度for (int i = 0; i < filecount; i++){resStreamArray[i] = Request.Files.Get(i).InputStream;//這里設(shè)定保存后的名稱，strFilePathArray[i] = Server.MapPath("~/upload/" + DateTime.Now.ToString("yyMMddhhmmss") + Request.Files.Get(i).FileName.Substring(0, 1) + ".png");if (System.IO.File.Exists(strFilePathArray[i]))//存在同名文件則刪除{System.IO.File.Delete(strFilePathArray[i]);}iBufferSizeArray[i] = Request.Files.Get(i).InputStream.Length;FileStream fileStream = System.IO.File.Create(strFilePathArray[i]);//創(chuàng)建新文件byte[] buffer = new byte[iBufferSizeArray[i]];int iReadLength = 0;//讀取返回流iReadLength = resStreamArray[i].Read(buffer, 0, buffer.Length);while (iReadLength > 0){//寫入文件流中fileStream.Write(buffer, 0, iReadLength);iReadLength = resStreamArray[i].Read(buffer, 0, buffer.Length);}fileStream.Flush();resStreamArray[i].Close();fileStream.Close();}return View();}

?

這樣我們的配置就算完成了，當(dāng)然，必不可少的2個(gè)文件avatarFlash.swf 和 tangram-custom-full-yui.js 我們只需要放在特定的文件夾里面，改下上面的一些參數(shù)就好了。

當(dāng)然，如果你不是用到MVC3，那么將會(huì)更簡單哦。

avatarFlash.swf 和 tangram-custom-full-yui.js 在下面給出的連接下載。

?

案例源碼下載地址：ASP.NET MVC3 上傳頭像圖片并截圖

連接不能點(diǎn)擊，請(qǐng)點(diǎn)擊：http://download.csdn.net/detail/risingsun001/5578393

?

希望這篇文章對(duì)您有用。

?

?

轉(zhuǎn)載于:https://www.cnblogs.com/snake-hand/archive/2013/06/14/3136997.html

總結(jié)

以上是生活随笔為你收集整理的ASP.NET MVC3 上传头像图片并截图的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。