none
ayuda MVC 5 subir imagenes RRS feed

  • Pregunta

  • Hola muy buenas a todo vengo a ustedes a pedir una ves mas su ayuda estoy realizando una web en visual estudio 2013 con MVC 5 y tengo que subir imagenes a una base de datos en sql como de echo use entity para manejar los datos y asi poder en usarlos en MVC pero ahora no he podido subir la imgen a la base de datos, dentro de mi base de datos el tipo es imagen dentro de sql (al menos asi lo defini al momento de crear el atributo dentro de sql) hora al momento de usar entity y crear en modelo dentro de MVC, entity me cambio el tipo a binary y ahi es donde ando perdido sera me pueden dar una mano para poder subir imagen desde MVC 5 a mi base de datos sql 2014 y luego mostrarla la imagen dentro de una plantilla de MVC

    (he creado mi solucion con dos proyecto uno q es el MVC y otro que es mi biblioteca de clases donde use entity cabe resaltar q ya estan todas la ferencias dentro de MVC para usar mi biblioteca de clases puedo guardar datos desde mi MVC hace la base de datos pero no logro guardar imagenes)


    hector

    jueves, 7 de septiembre de 2017 15:43

Todas las respuestas

  • Hola:

     Podrias apoyarte en este articulo para cargar la imagen:

     ASP.NET MVC 5 with EF 6 - Working With Files 

     La explicacion es muy buena.


    Saludos desde Monterrey, Nuevo León, México!!!

    jueves, 7 de septiembre de 2017 16:17
  • Hola

    Revisa este enlace donde explican de una manera fácil de como subir imágenes 

    Upload and display image in MVC application.

    Saludos


    Pedro Ávila
    "El hombre sabio querrá estar siempre con quien sea mejor que él."
    Lima - Perú

    jueves, 7 de septiembre de 2017 16:30
  • hola

    >>puedo guardar datos desde mi MVC hace la base de datos pero no logro guardar imagenes

    pero entonces el upload de la imagen al action si puedes hacerlo ?

    porque si es asi, y ademas utilizas entity framework solo es cuestion de asignar el byte array de la imagen a la propiedad de la clase que mapees con la tabla y realizar el SaveChanges()

     Displaying Database-stored Images in ASP.NET MVC with Data URLs

    para desplegar la imagen podrias hacerlo como base64

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    jueves, 7 de septiembre de 2017 18:30
  • buenas amigos la vuelvo con ustedes a seguir pdiendo su ayuda por aun no logro mi cometido ggg ando trancado en algo he leido todo la info q me pasaron gracias por eso pero aun tengo problemas aca les dejo lo que he eccho

    dentro de mi controlador he puesto esto

    using System;
    using System.Collections.Generic;
    using System.Data;
    using System.Data.Entity;
    using System.Linq;
    using System.Net;
    using System.Web;
    using System.Web.Mvc;
    using ModeloDatos;
    using System.IO;
    
    namespace final.Controllers
    {
        public class ActivosFijosController : Controller
        {
            private baseactivofijoEntities db = new baseactivofijoEntities();
    
            // GET: /ActivosFijos/
            public ActionResult Index()
            {
                var activofijo = db.activofijo.Include(a => a.tipoactivofijo);
                return View(activofijo.ToList());
            }
    
    
            // GET: /ActivosFijos/Details/5
            public ActionResult Details(int? id)
            {
                if (id == null)
                {
                    return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
                }
                activofijo activofijo = db.activofijo.Find(id);
                if (activofijo == null)
                {
                    return HttpNotFound();
                }
                return View(activofijo);
            }
    //////////////////////////////////////////////////////////////////////////////////////////////////
            //subir imagen aca esto fue lo que aumente
         public ActionResult FileUpload(HttpPostedFileBase file)
        {
            if (file != null)
            {
                using (MemoryStream ms = new MemoryStream())
                {
                    file.InputStream.CopyTo(ms);
                    byte[] array = ms.GetBuffer();
    
                    var context = new ModeloDatos.baseactivofijoEntities();
                    context.activofijo.Add(new ModeloDatos.activofijo()
                    {
                        FotoAF = array,
                    });
                    context.SaveChanges();
                }
    
            }
            return RedirectToAction("actionname", "controller");
        }
      ////////////////////////////////////////////////////////////////////////////////////////////////  
    
            // GET: /ActivosFijos/Create
            public ActionResult Create()
            {
                ViewBag.IDtipoactivo = new SelectList(db.tipoactivofijo, "IDtipoactivo", "tipoactivo");
                return View();
            }
    
            // POST: /ActivosFijos/Create
            // Para protegerse de ataques de publicación excesiva, habilite las propiedades específicas a las que desea enlazarse. Para obtener 
            // más información vea http://go.microsoft.com/fwlink/?LinkId=317598.
            [HttpPost]
            [ValidateAntiForgeryToken]
            public ActionResult Create([Bind(Include="IDAF,procedenciaAF,aquisicion,precioAF,codiobarraAF,FotoAF,DetalleAF,ValorUFB,IDtipoactivo")] activofijo activofijo)
            {
                if (ModelState.IsValid)
                {
                    db.activofijo.Add(activofijo);
                    db.SaveChanges();
                    return RedirectToAction("Index");
                }
    
                ViewBag.IDtipoactivo = new SelectList(db.tipoactivofijo, "IDtipoactivo", "tipoactivo", activofijo.IDtipoactivo);
                return View(activofijo);
            }
    
            // GET: /ActivosFijos/Edit/5
            public ActionResult Edit(int? id)
            {
                if (id == null)
                {
                    return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
                }
                activofijo activofijo = db.activofijo.Find(id);
                if (activofijo == null)
                {
                    return HttpNotFound();
                }
                ViewBag.IDtipoactivo = new SelectList(db.tipoactivofijo, "IDtipoactivo", "tipoactivo", activofijo.IDtipoactivo);
                return View(activofijo);
            }
    
            // POST: /ActivosFijos/Edit/5
            // Para protegerse de ataques de publicación excesiva, habilite las propiedades específicas a las que desea enlazarse. Para obtener 
            // más información vea http://go.microsoft.com/fwlink/?LinkId=317598.
            [HttpPost]
            [ValidateAntiForgeryToken]
            public ActionResult Edit([Bind(Include="IDAF,procedenciaAF,aquisicion,precioAF,codiobarraAF,FotoAF,DetalleAF,ValorUFB,IDtipoactivo")] activofijo activofijo)
            {
                if (ModelState.IsValid)
                {
                    db.Entry(activofijo).State = EntityState.Modified;
                    db.SaveChanges();
                    return RedirectToAction("Index");
                }
                ViewBag.IDtipoactivo = new SelectList(db.tipoactivofijo, "IDtipoactivo", "tipoactivo", activofijo.IDtipoactivo);
                return View(activofijo);
            }
    
            // GET: /ActivosFijos/Delete/5
            public ActionResult Delete(int? id)
            {
                if (id == null)
                {
                    return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
                }
                activofijo activofijo = db.activofijo.Find(id);
                if (activofijo == null)
                {
                    return HttpNotFound();
                }
                return View(activofijo);
            }
    
            // POST: /ActivosFijos/Delete/5
            [HttpPost, ActionName("Delete")]
            [ValidateAntiForgeryToken]
            public ActionResult DeleteConfirmed(int id)
            {
                activofijo activofijo = db.activofijo.Find(id);
                db.activofijo.Remove(activofijo);
                db.SaveChanges();
                return RedirectToAction("Index");
            }
    
            protected override void Dispose(bool disposing)
            {
                if (disposing)
                {
                    db.Dispose();
                }
                base.Dispose(disposing);
            }
        }
    }
    

    y dentro de mi view create quedo asi

    @model ModeloDatos.activofijo
    
    @{
        ViewBag.Title = "Create";
    }
    
    <h2>Create</h2>
    
    
    @using (Html.BeginForm("FileUpload", "Home", FormMethod.Post, new { enctype = "multipart/form-data" })) // aca aumente esto dentro del using
    {
    
        
        @Html.AntiForgeryToken()
        
        <div class="form-horizontal">
            <h4>activofijo</h4>
            <hr />
            @Html.ValidationSummary(true)
    
            <div class="form-group">
                @Html.LabelFor(model => model.procedenciaAF, new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.procedenciaAF)
                    @Html.ValidationMessageFor(model => model.procedenciaAF)
                </div>
            </div>
    
            <div class="form-group">
                @Html.LabelFor(model => model.aquisicion, new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.aquisicion)
                    @Html.ValidationMessageFor(model => model.aquisicion)
                </div>
            </div>
    
            <div class="form-group">
                @Html.LabelFor(model => model.precioAF, new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.precioAF)
                    @Html.ValidationMessageFor(model => model.precioAF)
                </div>
            </div>
    
            <div class="form-group">
                @Html.LabelFor(model => model.codiobarraAF, new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.codiobarraAF)
                    @Html.ValidationMessageFor(model => model.codiobarraAF)
                </div>
            </div>
    
            <div class="form-group">
                @Html.LabelFor(model => model.FotoAF, new { @class = "control-label col-md-2" })    
                <div class="col-md-10">
                    <input type="file" name="file" id="file" style="width: 100%;" />   /// para subir la imegen desde un directorio           
                    @*@Html.EditorFor(model => model.FotoAF)*@
                    @*@Html.ValidationMessageFor(model => model.FotoAF)*@
                </div>
            </div>
    
            <div class="form-group">
                @Html.LabelFor(model => model.DetalleAF, new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.DetalleAF)
                    @Html.ValidationMessageFor(model => model.DetalleAF)
                </div>
            </div>
    
            <div class="form-group">
                @Html.LabelFor(model => model.ValorUFB, new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.ValorUFB)
                    @Html.ValidationMessageFor(model => model.ValorUFB)
                </div>
            </div>
    
            <div class="form-group">
                @Html.LabelFor(model => model.IDtipoactivo, "IDtipoactivo", new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.DropDownList("IDtipoactivo", String.Empty)
                    @Html.ValidationMessageFor(model => model.IDtipoactivo)
                </div>
            </div>
    
            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <input type="submit" value="Create" class="btn btn-default" />
                </div>
            </div>
        </div>
    }
    
    <div>
        @Html.ActionLink("Back to List", "Index")
    </div>
    
    @section Scripts {
        @Scripts.Render("~/bundles/jqueryval")
    }
    

    y en mi view index

    @model IEnumerable<ModeloDatos.activofijo>
    
    @{
        ViewBag.Title = "Index";
    }
    
    <h2>Index</h2>
    
    <p>
        @Html.ActionLink("Create New", "Create")
    </p>
    <table class="table">
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.procedenciaAF)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.aquisicion)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.precioAF)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.codiobarraAF)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.FotoAF)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.DetalleAF)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.ValorUFB)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.tipoactivofijo.tipoactivo)
            </th>
            <th></th>
        </tr>
    
    @foreach (var item in Model) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.procedenciaAF)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.aquisicion)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.precioAF)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.codiobarraAF)
            </td>
            <td>
                <img src="@Url.Action("Index", "Images", new { id = 1 })" /> //// aumentado para la mostrar la imgen
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.DetalleAF)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ValorUFB)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.tipoactivofijo.tipoactivo)
            </td>
            <td>
                @Html.ActionLink("Edit", "Edit", new { id=item.IDAF }) |
                @Html.ActionLink("Details", "Details", new { id=item.IDAF }) |
                @Html.ActionLink("Delete", "Delete", new { id=item.IDAF })
            </td>
        </tr>
    }
    
    </table>
    

    y tambien cree otro controlador para poder mostrar las imagenes en la vista

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    
    namespace final.Controllers
    {
        public class ImagenController : Controller
        {
            //
            // GET: /Imagen/
           public ActionResult Index(int id)
        {
            var context = new ModeloDatos.baseactivofijoEntities();
            byte[] imageData = context.activofijo.FirstOrDefault(i => i.id == id).FotoAF;
            if (imageData != null)
            {
                return File(imageData, "image/png,jpeg"); // Might need to adjust the content type based on your actual image type
            }
            return null;
        }
    	}
    }

    pero sigo mal me da herror al momento de querer guardar todo los datos bueno espero una ayuda y me puedan decir cual es mi herror gracias de antemano


    hector

    miércoles, 13 de septiembre de 2017 12:57
  • resolviste el error?? 
    tengo el mismo error.. me guarda como binario en la base de datos.. 
    al querer mostar en la vista  en el src llamo al actionresult , el controlador y le paso el id 

    y no me devuelve la imagen..

    • Propuesto como respuesta conocuica domingo, 21 de abril de 2019 15:17
    • Votado como útil conocuica domingo, 21 de abril de 2019 15:17
    jueves, 31 de mayo de 2018 21:18
  • Hola que tal yo lo pude solucionar

     // POST: Producto/Create
            [HttpPost]
            public ActionResult Create(ParProducto ParProducto)
            {
                try
                {
                             // TODO: Add insert logic here
                    if (Session["usuario"] == null)
                    {
                        return RedirectToAction("Login", "Inicio");
                    }
    
                    HttpPostedFileBase imgpro = Request.Files["imgpro"];
    
                    if (imgpro != null && imgpro.ContentLength > 0)
                    {
    
                    }
    
                    ParUsuario u = null;
                    u = (ParUsuario)Session["usuario"];
                    ParProducto.usuariocorto = u.usuariocorto;
    
                    System.Globalization.CultureInfo customCulture = new System.Globalization.CultureInfo("en-US", true);
                    customCulture.DateTimeFormat.ShortDatePattern = "yyyy-MM-dd h:mm tt";
                    System.Threading.Thread.CurrentThread.CurrentCulture = customCulture;
                    System.Threading.Thread.CurrentThread.CurrentUICulture = customCulture;
                    DateTime newDate = System.Convert.ToDateTime(DateTime.Now.ToString("yyyy-MM-dd h:mm tt"));
    
    
                    ParProducto.Fecharegistro = newDate;
                   ParProducto .ParProductoImagen = ConvertToBytes(imgpro);
                    int regreso = ProductoBL.Agregar(ParProducto);
    
                    return View("Confirma");
                }
                catch
                {
                    return View("Error");
                }
            }
    
            public byte[] ConvertToBytes(HttpPostedFileBase image)
            {
                byte[] imageBytes = null;
                BinaryReader reader = new BinaryReader(image.InputStream);
                imageBytes = reader.ReadBytes((int)image.ContentLength);
                return imageBytes;
            }


    Conocuica

    domingo, 21 de abril de 2019 15:19