通过数据库显示图像

问题描述

Hi everybody,

I want to show the image after uploaded the image. I can upload the image and it is saving in the database. But after uploading the image is broken. the image is broken, because if I look in the browser I see that it returns every time the userdId. But how to change that it returs the path?

this is how I try to retrive the image:

<pre lang="c#"><th><img width="200" height="150" src="@Url.Action("GetImage", "Account", new {id = Model.Id })"></th></pre>

Thank you

I have these methods:

<pre lang="c#"> [HttpPost]
        public ActionResult EditPhotos(ImageUploadModel ImageUpload)
        {

            if (ImageUpload.file == null || ImageUpload.file.ContentLength == 0)
            {
                ModelState.AddModelError("file", "This field is requird");
            }

            if (ModelState.IsValid)
            {

                var DirSeparator = Path.DirectorySeparatorChar;

                var fileName = Path.GetFileName(ImageUpload.file.FileName);
                var path = Path.Combine(Server.MapPath(@"\\Images\\profile" + @"\" + fileName.Replace('+', '_')));

                ImageUpload.file.SaveAs(path);
                //Session["Path"] = String.Format("/Images/profile/{0}", fileName.Replace('+', '_'));
                //ViewBag.Message = "File has been uploaded successfully";
                //ModelState.Clear();


                string username = User.Identity.Name;
                // Get the userprofile
                UserProfile user = db.userProfiles.FirstOrDefault(u => u.UserName.Equals(username));

                if (user != null)
                {
                    var lolaphoto = new LolaBikePhoto
                    {
                        UserProfileID = user.Id
                    };

                    db.lolabikerPhotos.Add(lolaphoto);
                    lolaphoto.ImagePath = fileName;
                }

                // Update fields

                byte[] uploadedFile = new byte[ImageUpload.file.ContentLength];
                ImageUpload.file.InputStream.Read(uploadedFile, 0, ImageUpload.file.ContentLength);
                user.file = uploadedFile;
                user.ImageMimeType = ImageUpload.file.ContentType;

                db.Entry(user).State = EntityState.Modified;


                db.SaveChanges();



            }

            //return View();

            return RedirectToAction("Edit", routeValues: new { controller = "Account", activetab = "tabs-2" });
        } 

和获取图片方法：

and the get image method:

public FileContentResult GetImage(int id)
       {
           UserProfile user = db.userProfiles.FirstOrDefault(u => u.Id.Equals(id));
           if (user != null)
               return File(user.file, user.ImageMimeType);
           else return null;



       }

和视图：

and the view:

@using (Html.BeginForm("EditPhotos", "Account", FormMethod.Post, new { enctype = "multipart/form-data", id = "form", }))
      {
           @Html.AntiForgeryToken()

           <div class="form-horizontal">
               <h4>Photos</h4>
               <hr />

               @Html.HiddenFor(model => model.Id)




               <div id="upload-choices">
                   <div class="editor-label">

                       @*<div class="lifile">
                           @Html.ValidationMessageFor(m => m.file)
                           @Html.ValidationSummary(true)

                       </div>*@

                   </div>
               </div>

               <br />


               <div class="table-responsive">
                   <table class="table">

                       <tr>
                           <th><img width="200" height="150" src="@Url.Action("GetImage", "Account", new {id = Model.Id })"></th>


                       </tr>
                   </table>
               </div>


               &lt;input type="file" name="file" class="filestyle" data-buttontext="Find file">



               <br />
               @*<div class="progress progress-striped">
                       <div class="progress-bar progress-bar-success">0%</div>
                   </div>*@

               <div id="status"></div>


               <br />

               @*@Html.ActionLink("Upload photos", "Upload")*@

               <div class="pull-left">
                   <div class="col-md-offset-0">
                       &lt;input type="submit" value="Save" accept="image/x-png, image/gif, image/jpeg" class="btn btn-default pull-left" />

                   </div>
               </div>

           </div>
       }

       <br /><br />
       <div>
           @Html.ActionLink("Back to List", "Index")
       </div>
   </div></pre>

推荐答案

这篇关于通过数据库显示图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！