OFD文件纯前端查看解决方案

使用前请查看免责声明

ofd.js原有bug修复

1、ofd格式文档打开报错

原因分析：

文档打开时会解析所用到的字体信息，如果字体不在ofd.js预设字体时，会触发报错

问题解决：

如果没有字体，默认使用“宋体”字体显示

export const getFontFamily = function (font) {
  if (!font) {
    return FONT_FAMILY["宋体"];
  }
  if (FONT_FAMILY[font.toLowerCase()]) {
    font = FONT_FAMILY[font.toLowerCase()];
  }
  for (let key of Object.keys(FONT_FAMILY)) {
    if (font.toLowerCase().indexOf(key.toLowerCase()) != -1) {
      return FONT_FAMILY[key];
    }
  }
  return font;
};

主要是添加这一段：

  if (!font) {
    return FONT_FAMILY["宋体"];
  }

2、签章信息不显示

原因分析：

签章之后的OFD文档会在Annots目录下直接生成Annotation*.xml文件，但是原来ofd.js对于签章信息处理时fileLoc与现有文件对不上，所以渲染失败

问题解决：

根据当前OFD版式文件的文件目录，调整签章显示代码逻辑

const getAnnotations = async function (annoBase, annotations, doc, zip) {
    let annotationObjs = {};
    for (let anno of annotations) {
        if (!anno) {
            continue
        }
        const pageId = anno['@_PageID'];
        let fileLoc = anno['ofd:FileLoc'];
        fileLoc = replaceFirstSlash(fileLoc);
        if (annoBase && fileLoc.indexOf(annoBase + "/") === -1) {
            fileLoc = `${annoBase}/${fileLoc}`;
        }
        if (fileLoc.indexOf(doc) === -1) {
            fileLoc = `${doc}/${fileLoc}`;
        }

        if (zip.files[fileLoc]) {
            const data = await getJsonFromXmlContent(zip, fileLoc);

            let array = [];
            array = array.concat(data['json']['ofd:PageAnnot']['ofd:Annot']);
            if (!annotationObjs[pageId]) {
                annotationObjs[pageId] = [];
            }
            for (let annot of array) {
                if (!annot) {
                    continue
                }
                const type = annot['@_Type'];
                const visible = annot['@_Visible'] ? annot['@_Visible']:true;
                const appearance = annot['ofd:Appearance'];
                let appearanceObj = {type, appearance, visible};
                annotationObjs[pageId].push(appearanceObj);
            }
        }
    }
    return annotationObjs;
}

主要是修改这一段：

if (annoBase && fileLoc.indexOf(annoBase + "/") === -1) {
    fileLoc = `${annoBase}/${fileLoc}`;
}

效果展示

源码下载

本文基于 ofd.js 源码进行调整，原仓库地址：https://github.com/DLTech21/ofd.js
如需要源码可以访问代码仓库 https://github.com/WednesdayCAT/ofd.js
如果本文有用，请给原仓库和本仓库都点颗小星星，谢谢！！！