В месте отображения изображения [объект объекта] при преобразовании байтов в изображение в asp.net

#asp.net #image #gridview #webmethod #tobase64string

Вопрос:

Я конвертирую изображение из байтов методом FromBase64String в asp.net C# и помещен в поле gridview, но в gridview вместо изображения отображаются данные [объект объекта].

Для большей наглядности давайте посмотрим на изображение,

введите описание изображения здесь

Вот модель CustomerMortgageModel,

 public class CustomerMortgageModel
{
    public Image DesignImage;        
}
 

Вот код интерфейса,

 [WebMethod]
public static List<CustomerMortgageModel> GetProductList()
{
    string constr = ConfigurationManager.ConnectionStrings["connection"].ConnectionString;

    List<CustomerMortgageModel> customers = new List<CustomerMortgageModel>();
    Service service = new Service();

    using (SqlConnection con = new SqlConnection(constr))
    {
        string qrySelProductDetail = "select * from tbl_MortageDetail "   System.Environment.NewLine;
        
        using (SqlCommand cmd = new SqlCommand(qrySelProductDetail, con))
        {
            con.Open();
            using (SqlDataReader sdr = cmd.ExecuteReader())
            {
                while (sdr.Read())
                {
                    // Setup image and get data stream together
                    System.Drawing.Image img;
                    System.IO.MemoryStream MS = new System.IO.MemoryStream();

                    if (sdr["DesignImage"].ToString() != "")
                    {
                        string k = "i"   sdr["DesignImage"].ToString();
                        string b64 = k.Replace(" ", " ");
                        byte[] b;

                        // Converts the base64 encoded msg to image data
                        b = Convert.FromBase64String(b64);
                        MS = new System.IO.MemoryStream(b);

                        //creates image
                        img = System.Drawing.Image.FromStream(MS);
                    }
                    else
                    {
                        img = null;
                    }
                    customers.Add(new CustomerMortgageModel
                    {
                             DesignImage = img
                    });
                }
            }
            con.Close();
        }
        
    }
    return customers;
}
 

ВНУТРЕННИЙ код,

 <asp:GridView ID="gv_productdetail" runat="server" CssClass="display compact" AutoGenerateColumns="false">
    <Columns>
        <asp:TemplateField HeaderText="Image">  
            <ItemTemplate>  
                <img src="data:image/jpeg;base64,<%# Eval("DesignImage") %>" />
            </ItemTemplate>  
        </asp:TemplateField>  

    </Columns>
</asp:GridView>
 

Ответ №1:

Ну, вы не отметили формат столбца базы данных, но предполагаете, что у нас есть эта разметка:

      <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
            <Columns>
                <asp:BoundField HeaderText="Animal Name" DataField="Animal" />

                <asp:TemplateField HeaderText="Picture">
                    <ItemTemplate>
                        <asp:Image ID="Image1" runat="server" 
                            Height="128px" Width="128px"
        src ='<%# "Data:Image/png;base64,"   Convert.ToBase64String((byte[])Eval("ImageB")) %>' />
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
 

Обратите внимание, как я вставил выражение прямо в разметку. Итак, теперь код для загрузки сетки будет выглядеть следующим образом:

     protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack) {
            LoadGrid();
        }
    }

    void LoadGrid()
    {
        using (SqlCommand cmdSQL = new SqlCommand("SELECT Animal, ImageB from tblAnimals",
            new SqlConnection(Properties.Settings.Default.TEST4)))
        {
            cmdSQL.Connection.Open();
            GridView1.DataSource = cmdSQL.ExecuteReader();
            GridView1.DataBind();
        }
    }
 

Выход:

введите описание изображения здесь

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

но вы можете засунуть/бросить/использовать объект чтения данных объекта sql — команды. Не нужно зацикливаться здесь.

Это действительно зависит от того, как выглядит ваш дополнительный код. Если вы используете дополнительные строки данных, то я рекомендую вам рассмотреть возможность использования datatable, поскольку событие привязки данных к строке позволяет в полной мере использовать эту строку данных.

Итак, вы могли бы рассмотреть это:

            cmdSQL.Connection.Open();
            DataTable rstData = new DataTable();
            rstData.Load(cmdSQL.ExecuteReader());

            GridView1.DataSource = rstData;
            GridView1.DataBind();
 

Но я бы предложил выше только в том случае, если вам нужна полная строка данных во время события привязки данных к строке (которое я не знаю, используете ли вы).

но для этого вам, конечно, не нужно столько кода, сколько вы публикуете. Я предположил, что выше тип столбца данных sql — «изображение», и выше также должно работать, если он также был/является двоичным типом.