它是一種創(chuàng)建 Office Web Viewer 鏈接的服務。Office Web Viewer 鏈接可在瀏覽器中打開 Word、PowerPoint 或 Excel 文件，否則這些文件將被下載。您可以輕松地將下載鏈接轉換為 Office Web Viewer 鏈接以在您的網(wǎng)站或博客中使用（例如，食譜、照片幻燈片、菜單或預算模板）。

Office Web Viewer 的一些優(yōu)點包括：

您無需為 Web 轉換 Office 文件（例如，PDF、HTML）。
任何人都可以從您的網(wǎng)站或博客查看 Office 文件，即使他們沒有 Office。
它會密切關注您的網(wǎng)站或博客，因為讀者無需下載文件，他們就可以留在瀏覽器中。
一個鏈接適用于計算機、平板電腦和手機。

vue預覽word，excel，pptx，pdf文件

1、做word，excel，pptx的預覽，要先確定文件路徑訪問是通過域名的url來預覽，不可以通過IP的url來訪問

先把文件路徑的url進行url編碼（encodeURIComponent）

let router = 'https://aaaaaa.com/file/download?filename=file.obj_id'  //文件路徑
let url = encodeURIComponent(routeUrl)

然后用Office Web Viewer的路徑接口

http://view.officeapps.live.com/op/view.aspx?src=

把兩個拼接在一起

let officeUrl = 'http://view.officeapps.live.com/op/view.aspx?src='+url
window.open(officeUrl,'_target')

這樣就可以預覽word，excel，pptx文件了

完整的代碼

let routeUrl = 'https://aaaaaa.com/file/download?filename=file.obj_id'
let url = encodeURIComponent(routeUrl)
let officeUrl = 'http://view.officeapps.live.com/op/view.aspx?src='+url
window.open(officeUrl,'_target')

2、pdf文件預覽

下載好pdf.js(下載地址在下面)，放到static的目錄下面

網(wǎng)站鏈接 http://mozilla.github.io/pdf.js/getting_started/#download

然后

<div style="height:800px;">
  <iframe :src="pdfSrc" width="100%" height="100%"></iframe>
</div>

getSeePdf(file){
      this.pdffile=file
      let routeUrl = '文件地址url';
      let pSrc = routeUrl + '?r=' + new Date();
      this.pdfSrc = 'static/pdf/web/viewer.html?file=' + encodeURIComponent(pSrc) + '.pdf';
    },

更多的可以了解下微軟的這個查看器的官網(wǎng)

以上就是vue使用Office Web實現(xiàn)線上文件預覽的詳細內(nèi)容，更多關于vue Office Web文件預覽的資料請關注腳本之家其它相關文章！

您可能感興趣的文章: