exe-pdf-render 组件

简介

基于 Vue 与 Foxit PDF SDK for Web 的二次封装，目前只支持简单的查看PDF文件。

安装

npm install exe-pdf-render

引入

// main.js中

import exePdfViewer from 'exe-pdf-render'
Vue.use(exePdfViewer)

使用

注意事项：需要把该SDK放入项目的根目录才可以跑起来。

属性

| 名称 | 类型 | 必填 | 描述 | | :---- |:---- |:---- |:---- | | libPath | string| true | foxit库地址 | | license | object| false | foxitSDK密钥 | | resourceUrl| string| true | 远程加密的pdf文件地址 | | options | object| true | 用与解密的密钥 | | i18n | object| false | 多语言配置 | | loadScriptList | Array | false | 远程PDF-SDK路径 |

远程PSF-SDK loadScriptList: Array

默认值： loadScriptList: [ 'http://eftcdn.exexm.com/foxit-lib/preload-jr-worker.js', 'http://eftcdn.exexm.com/foxit-lib/UIExtension.full.js']

foxitSDK license：Object

| 属性 | 描述 | | :---- |:---- | | licenseSN | 你的 licenseSN | | licenseKey | 你的 licenseKey |

解密密钥 options：Object

| 属性 | 描述 | | :---- |:---- | | fileId | 文件id | | subFilter | 你的 subFilter | | initialKey | 你的 initialKey |

i18n：Object

默认值： zh-CN

| 属性 | 描述 | 示例| | :---- |:---- |:---- | | absolutePath | 语言包路径 | './foxit-lib/locales/zh-CN'| | lng | 选择的语种 | 'zh-CN'|

国际化

关于更多语言包详情可以访问： 国际化

Vue中使用示例

<template>
  <div id="app">
    <exe-pdf-viewer 
    :options="options"
    :lib-path="libPath"
    :load-script-list="loadScriptList"
    :resource-url="resourceUrl"/>
  </div>
</template>

<script>
export default {
  name: 'app',
  data() {
    return {
      libPath: 'http://www.cdn.com/foxit-lib/', // 资源库地址
      resourceUrl: 'http://www.cdn.com/public/foxit_drm_encrypt.pdf', // pdf 路径
      i18n: {
        absolutePath: 'http:xxx..', // 语言包路径
        lng: 'zh-CN' // 选择的语言
      },
      loadScriptList: ['http://www.cnd.com/a.js','http://www.cnd.com/b.js',],
      options: {
          fileId: 'cw_159644401293632', // 文件id
          subFilter: 'wDbkPg30',  // filter 参数
          initialKey: 'cQmublbZIy374kJOF' // key 参数
      }
    }
  },
}
</script>

效果