Question

我的表格看起来像这样

CREATE TABLE dbo.t_picures(
  picureId INT IDENTITY(1, 1) NOT NULL,
  name NVARCHAR(50) NOT NULL,
  extension NVARCHAR(10) NOT NULL,
  picture VARBINARY(MAX) NOT NULL,
  CONSTRAINT PK_pictureId PRIMARY KEY (pictureId)
);

我可以使用以下SQL语句将图像保存到我的SQL Server中：

INSERT INTO dbo.t_picture
VALUES (N'Smile.png', N'.png',
    (
        SELECT  *  
        FROM OPENROWSET(BULK N'C:\{Path to my image}\Smile.png',SINGLE_BLOB) AS picture
    )
)

当我SELECT picture FROM dbo.t_pictures WHERE name='Smile.png'时，结果列产生的结果列类似于：0xFFD8FFE000104A46494600010200006400640000FFDB0043...（它会持续更长时间）。我认为这是一个很长的字节数组。

然后我通过我的快速api和console.log(this.state.data.picture)在我的反应应用程序的客户端发送结果。当我在您的反应应用程序中使用console.log时，图片列看起来像这样：{type: "Buffer", data: Array(14598)}

我尝试使用<img src={this.state.data.picture} />创建图像，但图像显示为已损坏。

我已经在一些地方读过你可以通过将缓冲区数组转换为base64字符串来显示它，但我不知道该怎么做。当我第一次检索数据时，我也不确定是否应该在T-SQL中执行此操作，或者当我在客户端收到它时，我是否应该在javscript中将其转换为。

如何使用{type: "Buffer", data: Array(14598)}中的值显示图像？另外，有没有更好的方法来存储/检索来自sql server的图像？

非常感谢任何帮助！谢谢。

Answer 1

通过使用以下查询从db中检索数据时，我能够通过将二进制值转换为base64字符串来显示图像：

cast('' as xml).value(
  'xs:base64Binary(sql:column("table.column"))', 'varchar(max)'
)

表格是您的表格名称，列是您的列名称

然后我使用如下数据URI显示图像：

<img src={`data:image/png;base64,${this.state.data.picture}`} />

希望这可以帮助遇到同样问题的其他人！

从sql server保存/检索图像以表达api到react应用程序

1 个答案: