前台html页面的img标签图片想动态从数据库获取，如何获取

1、这个在数据库中存储img的地址，前台放置img服务器标签，后台读取数据库中的img地址赋值。

2、可以在后台进行html拼接，拼接出img标签，然后输出前台，使用Ajax，在后台写好获取数据库中img地址的方法。

3、前台，在页面加载时，base64码字符串传到前台转换即可展示：<img src="data:image/jpg;base64,<%=base64Path %>" width="50%" height="50%"/>。

4、之后会再发一个带预览的用ajax存储的Demo。

5、读取时就是从数据库读取对应数据再转化成显示出来。

扩展资料

img 元素向网页中嵌入一幅图像。

请注意，从技术上讲，<img> 标签并不会在网页中插入图像，而是从网页上链接图像。<img> 标签创建的是被引用图像的占位空间。

<img> 标签有两个必需的属性：src 属性 和 alt 属性。

<img> 标签的 src 属性是必需的。它的值是图像文件的 URL，也就是引用该图像的文件的的绝对路径或相对路径。

为了整理文档的存储，创作者通常会把图像文件存放在一个单独的文件夹中，而且通常会将这些目录命名为 "pics" 或者 "images" 之类的名称。

在 W3School 在线教程中，我们的工程师把大部分常用的图像都存放到一个名为 "i" 的文件夹中，"i"是 "images" 的缩写，这样做的好处是可以最大程度地简化路径。

在 HTML 中，<img> 标签没有结束标签。在 XHTML 中，<img> 标签必须被正确地关闭。

在 HTML 401 中，不推荐使用 image 元素的 "align"、"border"、"hspace" 以及 "vspace" 属性。

在 XHTML 10 Strict DTD 中，不支持 image 元素的 "align"、"border"、"hspace" 以及 "vspace" 属性。

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

while(sqldrRead)

{

if(sqldr[0]ToString()Length>0)

lstByteAdd((byte[])sqldr[0]);//得到所有列表，列表中的每个byte[]元素代表一个。

}

要显示多个你需要生成多个picbox或者使用列表控件。使用前者的例子

foreach(byte[] bt in lstByte)

{

MemoryStream ms=new MemoryStream(bt);

Bitmap bmpt=new Bitmap(ms);

Picbox pic=new Picbox();

picHeight=50;

picWidth=50;

picImage=bmpt;

imgPanelControlsAdd(pic);//imgPanel为界面显示列表的容器控件

}

用delphi可以这样

procedure TFrm_Ls_cxTBut_RefreshClick(Sender: TObject);

var Picms:TMemoryStream;

Picjpg:TJPEGImage;

begin

if ADOQ_ListFieldByName('pct')AsVariant <>'' then

Begin

Picms:=TMemoryStreamCreate ;

Picjpg:=TJPEGImageCreate ;

TBlobField(ADOQ_ListFieldByName('pct'))SaveToStream(Picms);

PicmsPosition :=0;

PicjpgLoadFromStream(Picms);

img_picPictureAssign(Picjpg);

PicJpgFree;

PicmsFree;

End;

End;

网站上不能这样存路径，这种路径是没用的，对于网站来说，我不清楚你这个是后台上传的还是自己手填到数据库的，原理都一样，比如是用后台上传的，那应该把上传后保存到网站的一个固定的目录，比如存在网站根目录下的upload目录（假定名为123jpg），那你数据库中的保存的路径就应该是比如/upload/123jpg

然后下面的页面代码就可以不用改了。

这里介绍两种种方法。

1，SqlDataReader的GetSqlBytes方法用于检索varbinary(max)列的内容。

reader = commandExecuteReader(CommandBehaviorSequentialAccess);

while (readerRead())

SqlBytes bytes = readerGetSqlBytes(0);

例1从NorthWind数据库的Employees表读取雇员图像并显示。SqlDataReader的GetSqlBytes方法返回一个SqlBytes对象，该对象公开Stream属性。使用该属性创建新的Bitmap对象，然后以Gif ImageFormat格式保存到Stream。

private void ReadPhoto(string lastName)     //读取雇员图像并显示

{

using (SqlConnection connection = new SqlConnection(ConnectionString))

{

Stream s = new MemoryStream();      //创建一个以内存为后备存储的流

SqlCommand command = connectionCreateCommand();

SqlDataReader reader = null;

try

{

commandCommandText = "SELECT LastName,Photo FROM dboEmployees " +

" WHERE LastName=@LastName";

commandCommandType = CommandTypeText;

//声明参数并赋值

SqlParameter parameter = new SqlParameter("@LastName", SqlDbTypeNVarChar, 20);

parameterValue = lastName;

commandParametersAdd(parameter);

connectionOpen();

//修改DataReader的默认行为，SequentialAccess按顺序接收数据并立即加载

//CloseConnection指明关闭DataReader时，对数据库的连接也关闭

reader = commandExecuteReader(

CommandBehaviorSequentialAccess|CommandBehaviorCloseConnection);

if (readerHasRows)

{

while (readerRead())

{

//SequentialAccess要求按顺序接收数据，先接受reader[0]

thislabel1Text = reader[0]ToString();

if (readerIsDBNull(1))          //若列值为空返回

return;

else

{

//使用readerGetSqlBytes获取图像数据

SqlBytes bytes = readerGetSqlBytes(1);

using (Bitmap productImage = new Bitmap(bytesStream))

{

//以gif格式保存在Stream流并显示

productImageSave(s, SystemDrawingImagingImageFormatGif);

thispictureBox1Image = SystemDrawingImageFromStream(s);

} } }

}

else

MessageBoxShow("No records returned");

}

catch (Exception ex)

{

MessageBoxShow(exMessage);

}

Finally

{

if (reader != null)

readerDispose();               //关闭DataReader，同时关闭对数据库连接

}

sClose();                         //关闭流

}

}

本程序将DataReader设置为SequentialAccess，要求顺序访问字段，所以先读取LastName小数据，再读取图像大数据。程序运行后从组合框选取雇员的LastName，将在图形框出现雇员的图像，

2，SqlDataReader的GetSqlBinary方法可用于检索varbinary(max)列的内容。

reader = commandExecuteReader(CommandBehaviorCloseConnection);

while (readerRead())

SqlBinary binaryStream = readerGetSqlBinary(0);

例2 AdventureWorks2008数据库中的ProductionProductPhoto表含有图形列LargePhoto，数据类型是varbinary(max)，可空。用GetSqlBinary方法检索图形数据的代码如下：

private void ReadPhoto(int documentID)    //输入参数documentID是产品ID

{

using (SqlConnection connection = new SqlConnection(GetConnectionString()))

{

thislabel1Text = documentIDToString();

try

{

string queryString = "SELECT LargePhoto FROM ProductionProductPhoto " +

"WHERE ProductPhotoID=@ProductPhotoID";

SqlCommand command = new SqlCommand(queryString, connection);

SqlParameter paramID = new SqlParameter("@ProductPhotoID", SqlDbTypeInt);

paramIDValue = documentID;

commandParametersAdd(paramID);

connectionOpen();

//修改DataReader的默认行为

SqlDataReader reader = commandExecuteReader(

CommandBehaviorSequentialAccess|CommandBehaviorCloseConnection);

if (readerHasRows)

{

while (readerRead())

{

if (readerIsDBNull(0))

return;

else

{

Stream s = new MemoryStream();

SqlBinary binaryStream = readerGetSqlBinary(0);

//根据SqlBinary值初始化SqlBytes类的新实例

SqlBytes bytes = new SqlBytes(binaryStream);

using (Bitmap productImage = new Bitmap(bytesStream))

{

//用gif格式保存图形

productImageSave(s, SystemDrawingImagingImageFormatGif);

thispictureBox1Image = SystemDrawingImageFromStream(s);

}

sClose();

} }

}

else

MessageBoxShow("No records returned");

}

catch (Exception ex)

{

MessageBoxShow(exMessage);

} }

}

下图为documentID=100的自行车类型

以上示例取自C#编程指南但尧编著清华大学出版社2011年1月

以上就是关于前台html页面的img标签图片想动态从数据库获取，如何获取全部的内容，包括:前台html页面的img标签图片想动态从数据库获取，如何获取、C#读取数据库的多张图片、delphi中，怎么从access数据库中读取图片等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！