1 MVC中顯示 記憶體流 中的圖片。（不是圖片檔案）

建立一個Index用來顯示

Action:

public ActionResult Index()
        {
            return View();
        }

@{
    ViewBag.Title = "Index";
}

<h2>Index2</h2>
<img src="[email protected]" height="136">

public ActionResult GetImg(string qrCode)
        {
            var q = new MemoryStream();//這裡是你的圖片 記憶體流
            return File(q.ToArray(), "image/jpeg");
        }
 

Action: 我的webapi訪問路徑是  api/common/UploadFile

/// <summary>
        /// 上傳圖片
        /// </summary>
        /// <returns></returns>
        public async Task<HttpResponseMessage> UploadFile()
        {
            // 檢查是否是 multipart/form-data
            if (!Request.Content.IsMimeMultipartContent("form-data"))
                throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
            HttpResponseMessage response = null;


            try
            {   //UploadImgUrl 為絕對路徑
                var provider = new RenamingMultipartFormDataStreamProvider(UploadImgUrl);
                var body = await Request.Content.ReadAsMultipartAsync(provider);

                //獲取改寫後的檔名(會再次呼叫GetLocalFileName)
                //result.data = provider.GetLocalFileName(provider.FileData[0].Headers); 
                //獲取改寫後的檔名(不會再次呼叫GetLocalFileName)
                //result.data = body.FileData[0].LocalFileName.Substring(body.FileData[0].LocalFileName.LastIndexOf('\\'));  

                response = Request.CreateResponse(HttpStatusCode.OK);
            }
            catch
            {
                throw new HttpResponseException(HttpStatusCode.BadRequest);
            }
            return response;
        }

 

         

建立一個 Provider 用於重新命名接收到的檔案
public class RenamingMultipartFormDataStreamProvider : MultipartFormDataStreamProvider
    {
        public RenamingMultipartFormDataStreamProvider(string path)
            : base(path)
        { }

        public override string GetLocalFileName(HttpContentHeaders headers)
        {
            var sb = new StringBuilder((headers.ContentDisposition.FileName ?? DateTime.Now.Ticks.ToString()).Replace("\"", "").Trim().Replace(" ", "_"));
            Array.ForEach(Path.GetInvalidFileNameChars(), invalidChar => sb.Replace(invalidChar, '-'));
            return sb.ToString();
        }

    }
 

<form name="form1" method="post" enctype="multipart/form-data" action="/api/common/UploadFile">
    
    <div>
        <label for="image1">Image File</label>
        <input name="image1" type="file" />
    </div>
    <div>
        <input type="submit" value="Submit" />
    </div>
</form>

3 MVC上傳圖片：

前臺：

@using (Html.BeginForm("Test", "Test", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <input name="up1" type="file" />
    <input type="submit" value="Submit"/>
}

[ValidateInput(false)]
        [HttpPost]
        public ActionResult Test(HttpPostedFileBase up1)
        {
            
            if (up1!=null&&up1.FileName != "")
                {
                    
                    up1.SaveAs(imgFilePath);//檔案儲存，imgFilePath:檔案路徑+檔名
                    
                }
            return View();
        }

4 Ajax上傳圖片：

前臺：

<form id="form1">
    <input type="file" id="file"  name="file"/>
    <input type="button" value="提交" onclick="sub()" />
</form>


<script>
    
    function sub() {
        var formData = new FormData();
        formData.append("file", document.getElementById("file").files[0]);

        $.ajax({
            url: "/Test/UploadFile",
            type: "POST",
            data: formData,
            contentType: false,
            processData: false,
            success: function (data) {
                
            }
        });
    }
    
</script>

[HttpPost]
        public ActionResult UploadFile(HttpPostedFileBase file)
        {

            return RedirectToAction("Index");
        }