Чтение изображения из базы данных и отображение в поле зрения

Question

Я пытаюсь преобразовать старое приложение ASP.NET в MVC (я только изучаю MVC). и мне нужно отобразить изображение в Gridview. Само изображение хранится в таблице SQL Server как изображение типа данных. Код, который использовался ранее, приведен ниже. Может кто-нибудь предложить подход с использованием MVC? Я думал о создании частичной страницы, которую я мог бы встроить в стандартное представление, но не был уверен, что это правильный дизайн для реализации.

Спасибо заранее!

   `  string sqlText = "SELECT * FROM Images WHERE img_pk = " + id;
        SqlConnection connection = new SqlConnection(ConfigurationManager.ConnectionStrings["LocalSqlServer"].ConnectionString);

        SqlCommand command = new SqlCommand(sqlText, connection);
        connection.Open();
        SqlDataReader dr = command.ExecuteReader();
        if (dr.Read())
        {
            //Response.Write("test");
           Response.BinaryWrite((byte[])dr["img_data"]);
        }
        connection.Close();
    }

Тогда на него можно ссылаться, используя этот тег изображения:

<asp:Image Height="73" Width="80" ID="Image1" ImageAlign="Middle" ImageUrl='<%#"viewimage.aspx?id=" + Eval("ImageId") %>' runat="server"/></a></td>

Answer 1

Прежде всего следует забыть о GridView в приложении ASP.NET MVC.Элементы управления на стороне сервера, постбэки, viewstate, события, ... все это понятия, которых больше не существует.

В ASP.NET MVC вы работаете с моделями, контроллерами и представлениями.

Таким образом, вы можете написать действие контроллера, которое будет извлекать изображение из базы данных и обслуживать его:

public class ImagesController: Controller
{
    public ActionResult Index(int id)
    {
        string sqlText = "SELECT img_data FROM Images WHERE img_pk = @id";
        using (var conn = new SqlConnection(ConfigurationManager.ConnectionStrings["LocalSqlServer"].ConnectionString))
        using (var command = conn.CreateCommand())
        {
            conn.Open();
            command.CommandText = sqlText;
            command.Parameters.AddWithValue("@id", id);
            using (var reader = command.ExecuteReader())
            {
                if (!reader.Read())
                {
                    return HttpNotFound();
                }

                var data = GetBytes(reader, reader.GetOrdinal("img_data"));
                return File(data, "image/jpg");
            }
        }
    }

    private byte[] GetBytes(IDataReader reader, int columnIndex)
    {
        const int CHUNK_SIZE = 2 * 1024;
        byte[] buffer = new byte[CHUNK_SIZE];
        long bytesRead;
        long fieldOffset = 0;
        using (var stream = new MemoryStream())
        {
            while ((bytesRead = reader.GetBytes(columnIndex, fieldOffset, buffer, 0, buffer.Length)) > 0)
            {
                byte[] actualRead = new byte[bytesRead];
                Buffer.BlockCopy(buffer, 0, actualRead, 0, (int)bytesRead);
                stream.Write(actualRead, 0, actualRead.Length);
                fieldOffset += bytesRead;
            }
            return stream.ToArray();
        }
    }
}

, а затем, на ваш взгляд, просто:

<img src="@Url.Action("Index", "Images", new { id = "123" })" alt="" />

Теперь, конечно, все это действие контроллера приятно и изящно, но вы должны действительно абстрагировать весь доступ к данным в репозиторий:

public interface IImagesRepository
{
    byte[] GetImageData(int id);
}

затем реализуйте этот метод для поставщика данных, который вы используете:

public class ImagesRepositorySql: IImagesRepository
{
    public byte[] GetImageData(int id)
    {
        // you already know what to do here.
        throw new NotImplementedException();
    }
}

Наконец, ваш контроллер станет независимым от базы данных.Слои в вашем приложении теперь слабо связаны между собой, что позволяет вам повторно использовать их и тестировать их по отдельности:

public class ImagesController: Controller
{
    private readonly IImagesRepository _repository; 
    public ImagesController(IImagesRepository repository)
    {
        _repository = repository;
    }

    public ActionResult Index(int id)
    {
        var data = _repository.GetImageData(id);
        return File(data, "image/jpg");
    }
}

, а последняя часть будет состоять в том, чтобы настроить вашу любимую структуру DI для внедрения правильной реализациихранилище в контроллер.