Загрузить изображение из двоичного кода

Question

Это моя петля для загрузки изображений из Binary [] (SqlServerCe). Каждое изображение хранится в виде списка, держащего массив байтов:

List<byte[]> imgBinary = new List<byte[]>(); 

Переменная imgMIME содержит значения, как:

image/png 
image/bmp 

и так далее.

Мой текущий код выглядит следующим образом:

@for (int i = 0; i < infos.Count(); i++) 
{ 
    <li>  
     @lat[i], 
     @lon[i], 
     @infos[i], 
     <img src="data:'+'@imgMIME[i]'+';base64{'+'@imgBinary[i]'+'}"/> 
    </li> 
} 

На моей странице я получаю изображение ошибки для каждого из этих загруженных изображений. Может кто-нибудь, пожалуйста, помогите мне решить это?

Спасибо за ваше время.

Answer 1

Ваше форматирование рядный Неправильное изображение - оно должно быть:

data:MIMETYPE;base64,CONTENT_AS_BASE64_STRING 

Там не должно быть никаких фигурных скобок ({ и }) в строке. Вы можете прочитать больше о встроенных изображениях в this article.

Похоже, вы записываете байты в встроенное изображение. Встроенное изображение работает, когда контент указан как Base64 formatted string. Вот почему вам нужно преобразовать свой контент изображения в строку Base64 (ваш текущий контент находится в массиве байтов), используя Convert.ToBase64String.

Я также хотел бы предложить вам использовать String.Format:

<img src=@string.Format("data:{0};base64,{1}", imgMIME[i], Convert.ToBase64String(imgBinary[i]))/> 

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

<img src="data:image\png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwOC8xOC8wOaw6EPwAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzQGstOgAAACEElEQVRYhcWXQY7TMBSGPyM2SEgUiT25wWRO0CCxeV5xA+YGzA2mF0DM7NjRI7B6b5uROECHFTvCBaCVEEvCIjYKaZraBdpfip7y/GJ/ebZfHNe2LafU/Zxg7/0P4AGwAVbBXQe7AtZAo6pNap8uNQPe+xnwDfgOPEx4ZBfkE+CTqn6AvAyUwb5W1UWAKoFZuMpeXPTNg2/OtlwuQBVsfCtUddVrf7/rQe99fLYA3gI/f1PEKRCRyblwzgGQOmVm5kZACuAzcKuqFcC9pN7+nYpg6+jYmoIx8hztyWQVbBMdx85AXKgnAygAVLU+FcAZ8KXvyAYQkdkhI4eaAb30ZwOIyIKJ/b5HEaA+CEBELoArYC4iywMAimD7xSsNIAz+rud6eQBEFWyTBSAil4PB+xB1xpooYat8TwOIyDXwZiJkzmBOxxS+pI+Au2HbTgARKYFX+zoHzkKWpjS6AyYBgBcJg6fGRoDVsGEKYD3iu6MrJJuE2L8GWPLnnN3Q1YA13RtHiA2w2ANQZAOY2drMSuAceGxml8AFXTltzGwGnJvZzMy2Oh5oDjB2Vtx7Ioqdh4X2lO6Nl0CVMHC/BN+OtScfyczsGrhOje+pCLYZazzG13DnFoTM/4JUOefw3i/oFt3z4K6PBhB0Nbj/ejSAtm1xzj0LtxWAqn4ci00+lucq9XB77CPZlpL/Df+XTp6BXyWzqYOyhB+rAAAAAElFTkSuQmCC" /> 

Это выглядит следующим образом:

Посмотрите на свой HTML-код в элементе изображения. Это вы не видите такой текст, а только цифры, тогда контент не записывается как base64.