如果你是想直接把后端返回的ofd流渲染在页面预览,先引入ofd.js的依赖,npm install ofd.js(这个命令我当时依赖出来的版本号是^1.4.1),如果你的ofd文件是有电子签章的,这个版本可能会电子签章不显示,在csdn大佬的帮助下依赖了0.2.5,这个版本电子签章会正常显示。
依赖完之后要在使用的页面引入两个方法
import { parseOfdDocument, renderOfd } from "ofd.js";
<div id='divId' class="xxx">
getViewOfd(){
parseOfdDocument({
// ofd写入文件地址
// ofd: 数据流,(上传流数据或者接口地址)
// ofd写入文件地址
ofd: process.env.VUE_APP_BASE_API + `/xxxx/xxxx/xxxxx?xxxx=${xxx}&certType=${xxxx}`,//或者在parseOfdDocument上面先调用接口把返回的值传在这里
success(res) {
if (res) {
let screenWidth = 1000 //容器大小
const divs = renderOfd(screenWidth, res[0])
let contentDiv = document.getElementById('divId')
contentDiv.innerHTML = ''
for (const div of divs) {
contentDiv.appendChild(div)
}
}
},
fail(error) {
console.log(error, 'errror')
}
})
}
//接口这么写也可以
import axios from 'axios'
const request = axios.create()
let url = 'xx//xxxxx/xxxx'
let res = new request({url, method: 'get', params: {key: xxxx, key1: xxxx}, responseType: 'blob', headers: { uiticket: getToken(), sid: getSid() }})
如果有熟练使用ofd各种前端功能的同志可以发消息教教我。