ASP.NET誤人子弟教程:在MVC下如何返回圖片
阿新 • • 發佈:2019-02-16
這幾天忙著一些小事,也沒有寫什麼了,今天,我們來玩一個比較簡單的東東。就是在MVC下如何返回圖片,相信,在傳統WebForm下,大家都曉得怎麼弄,方也不限於一種,但是,在架構較為嚴格的MVC裡面,剛開始接觸的朋友,可能不太清楚如何實現。
首先,我們應當從控制器入手,昨天有位朋友問我,控制器一般不都是return View的嗎?那怎麼返回圖片? 當然,Controller類也沒有return Image 的,上次我們的例子是返回JSON,其實我們可以讓其返回一個檔案流,一開始我也想過使用ViewData,但這個在檢視頁面上只能通過伺服器端程式碼來操作,如果希望用JS,就不那麼好辦了。
Controller類有一個File方法,當然,它有N個過載,而且返回的物件不一樣,這裡我們要找到返回FileContentResult型別的File方法,因為,我測試過,在<img>元素中,src屬性不能讀取到FileStreamResult物件的內容,是空白的,所以,不能返回FileStreamResult來獲取。
請參考下面程式碼,不復雜,我先畫一個矩形,然後在矩形上畫一些文字,然後返回。
public ActionResult GetImg() { Bitmap bmp = new Bitmap(100, 35); Graphics g = Graphics.FromImage(bmp); g.Clear(Color.White); g.FillRectangle(Brushes.Red, 2, 2, 65, 31); g.DrawString("學習MVC", new Font("黑體", 15f), Brushes.Yellow, new PointF(5f, 5f)); MemoryStream ms = new MemoryStream(); bmp.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg); g.Dispose(); bmp.Dispose(); return File(ms.ToArray(), "image/jpeg"); }
注意,這個方法定義在你的控制器中,屬於一個Action。
在前臺頁面,我們這樣處理。
<div>
<img src="/Home/GetImg" width="100" alt="" />
</div>
這樣,我們就可以在需要的時候通過JS來操作了,比如,返回隨機圖片,或者驗證碼什麼的。