后端
后端是在使用activiti7时,一个查询了部署了的流程图,对应的一个存在数据库中,数据类型为blob类型的值的这么一个接口
/**
* 根据流程定义id查看流程图(xml或者图片)
**/
@GetMapping(value = "/selectPicture")
public AjaxResult getFlowChart(String processDefinitionId) {
String resType="xml";
HttpHeaders headers = new HttpHeaders();
if ("xml".equals(resType)) {
//xml格式
headers.setContentType(MediaType.APPLICATION_XML);
} else {
//image 图片格式
headers.setContentType(MediaType.IMAGE_PNG);
}
//获取流程定义信息
ProcessDefinition processDefinition = repositoryService
.createProcessDefinitionQuery()
.processDefinitionId(processDefinitionId)
.singleResult();
String resourceName = "";
if ("image".equals(resType)) {
resourceName = processDefinition.getDiagramResourceName();
} else if ("xml".equals(resType)) {
resourceName = processDefinition.getResourceName();
}
InputStream resourceAsStream = repositoryService
.getResourceAsStream(processDefinition.getDeploymentId(), resourceName);
return AjaxResult.success("成功",IoUtil.readBytes(resourceAsStream));
}
前端
如果你想解析后台传来的 Blob 并得到其中的字符串,并且其中的中文不能乱码,你可以使用以下步骤:
1.使用 atob() 函数将 Blob 转换为 base64 字符串。
2.使用 iconv 库将 base64 字符串转换为 UTF-8 字符串。
npm install iconv-lite --save
selectPicture(data) {
let _this=this;
selectPicture(data.id).then(res => {
if (res.code == 200) {
const decodedData = atob(res.data);
const da=iconv.decode(decodedData,'UTF-8')
_this.$router.push({
name: `selectprocces`,
params: {
da: da
}
})
}
})
}