我正在尝试将从 Java 服务获取的图像渲染为 InputStream
,通过 NodeJS Express 服务器重新发送,最后在 Angular4 中渲染
这就是我所做的:
Java Jersey 服务:
@GET
@Path("thumbnail")
@ApiOperation(
value = "Gets document preview",
notes = "Gets document preview"
)
@ApiResponses(value = {
@ApiResponse(code = 200, message = "Preview of the document")
})
@Consumes(MediaType.MULTIPART_FORM_DATA)
@Produces("image/png")
public Response getDocThumbnail(
@ApiParam(value = "Entity UUID", required = true) @FormDataParam("uuid") String uuid
) throws RepositoryException, UnknowException, WebserviceException, PathNotFoundException, DatabaseException, AutomationException, AccessDeniedException, ConversionException, IOException {
RawDocument rawDocument = docCtrl.getDocThumbnail(uuid);
return Response
.ok(rawDocument.getInputStream(), "image/png")
.header("Content-Disposition", "attachment; filename=\" " + rawDocument.getName() + "\"")
.build();
}
Controller 看起来像:
public RawDocument getDocThumbnail(String uuid) throws IOException, AccessDeniedException, PathNotFoundException, WebserviceException, RepositoryException, DatabaseException, ConversionException, AutomationException, UnknowException {
return new RawDocument(
okmWebSrv.getOkmService().getThumbnail(uuid, ThumbnailType.THUMBNAIL_LIGHTBOX),
"whatever"
);
}
基本上是调用OpenKM SDK to retreive document's thumbnail
此 Java 端点是从 NodeJS Express 4.15 调用的,它正在预处理对此 Java 后端的一些请求。 这就是我所做的:
...compose request options...
const vedica_res = await rp(options);
let buffered = new Buffer(vedica_res, 'binary');
res.writeHead(200, {
'Content-Type': 'image/png',
'Content-disposition': 'attachment;filename=' + 'thumb.png',
'Content-Length': buffered.length
});
return res.end(buffered, 'binary');
最后,Angular4 作为此往返的发起者,我尝试像这样渲染图像:
this.rest.send('http://localhost:4200/vedica/api/document/thumbnail', RequestMethod.Get,
{uuid: '19516ea1-657e-4b21-8564-0cb87f29b064'}, true).subscribe(img => {
// this.preview = img
var urlCreator = window.URL;
var url = urlCreator.createObjectURL(img);
this.thumb.nativeElement.src = url;
})
收到的“img”是 Blob {size: 81515, type: "image/png"}
。控制台没有显示任何错误,但在 <img #thumb/>
中不渲染任何图像。标签。但我可以看到它设置了 src=blob:http%3A//localhost%3A3000/4cf847d5-5af3-4c5a-acbc-0201e60efdb7
为了它。图像只有一个损坏的图像图标。
当我尝试在新选项卡中读取缓存的响应时,它可以访问,但不会再次呈现任何内容。
你能指出我做错了什么吗?尝试了很多,但没有成功。
最佳答案
我认为问题不在于流被提前关闭,我认为问题在于下载方式,请看这里: https://docs.openkm.com/kcenter/view/sdk4j-1.1/document-samples.html#getContent
从服务器端(在 OpenKM 和用户界面之间),问题通常是:
//response.setContentLength(is.available()); // Cause a bug, because at this point InputStream still has not its real size.
你应该使用
response.setContentLength(new Long(doc.getActualVersion().getSize()).intValue());
关于java - 在 Angular4 中渲染缩略图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44565183/