在網(wǎng)頁中預(yù)覽excel表格文件

defcon 發(fā)布于2019-07-30 14:41 / 797人閱讀

摘要：項(xiàng)目需求在前端頁面中實(shí)現(xiàn)預(yù)覽表格的功能，上網(wǎng)了解之后大致總結(jié)為一下幾種方法。第四種方法把表格打開后，另存為格式的文件。在網(wǎng)頁上預(yù)覽效果和表格一致。

項(xiàng)目需求在前端頁面中實(shí)現(xiàn)預(yù)覽excel表格的功能，上網(wǎng)了解之后大致總結(jié)為一下幾種方法。

1.office文檔轉(zhuǎn)換為pdf，再轉(zhuǎn)swf，然后通過網(wǎng)頁加載flash進(jìn)行預(yù)覽

2.通過 xlsx.js，jszip.js插件

3.django xlrd讀取excel內(nèi)容，循環(huán)寫入到前端頁面table中

4.office轉(zhuǎn)html，網(wǎng)頁加載html文件進(jìn)行預(yù)覽

第一種方法：首先你的電腦上需要安裝office軟件，其次轉(zhuǎn)換過程較為繁瑣，同時(shí)消耗系統(tǒng)資源。

第二種方法：個(gè)人對js不是很熟悉，看了別人寫的js代碼，感覺可行性還是挺高的

第三種方法：通過django的xlrd插件按照行和列進(jìn)行數(shù)據(jù)讀取，然后寫入到變量中存儲(chǔ)，最后返回給前端模板頁面。可以實(shí)現(xiàn)預(yù)覽的效果，但后臺(tái)操作較為繁瑣，程序運(yùn)行效率較低。

第四種方法：把excel表格打開后，另存為html格式的文件。在網(wǎng)頁上預(yù)覽效果和excel表格一致。

綜上第四種方法是比較不錯(cuò)的選擇
需要安裝libreoffice軟件，ubuntu下直接通過軟件庫安裝，其他可通過官網(wǎng)下載，下載地址如下：
https://zh-cn.libreoffice.org...
ps：注意系統(tǒng)版本的選取

執(zhí)行代碼如下，后面跟的是文件地址。

libreoffice --invisible --convert-to html " + my_file.name

在我的項(xiàng)目中，我把該代碼集成到了文件上傳的方法中，在文件上傳完成后，生成該文件的html后綴的文件，最后在前端頁面中通過a標(biāo)簽訪問到對應(yīng)的路徑地址，實(shí)現(xiàn)在頁面中預(yù)覽的效果。

GPU云服務(wù)器云服務(wù)器 js在表格中添加數(shù)據(jù)類型 js導(dǎo)入excel數(shù)據(jù) 預(yù)覽在云服務(wù)器中添加網(wǎng)頁 Excel表格

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/40860.html

相關(guān)文章

在網(wǎng)頁中預(yù)覽excel表格文件

摘要：項(xiàng)目需求在前端頁面中實(shí)現(xiàn)預(yù)覽表格的功能，上網(wǎng)了解之后大致總結(jié)為一下幾種方法。第四種方法把表格打開后，另存為格式的文件。在網(wǎng)頁上預(yù)覽效果和表格一致。項(xiàng)目需求在前端頁面中實(shí)現(xiàn)預(yù)覽excel表格的功能，上網(wǎng)了解之后大致總結(jié)為一下幾種方法。 1.office文檔轉(zhuǎn)換為pdf，再轉(zhuǎn)swf，然后通過網(wǎng)頁加載flash進(jìn)行預(yù)覽 2.通過 xlsx.js，jszip.js插件 3.django xl...

Honwhy 2019-08-01 17:36 評(píng)論0 收藏0
Java導(dǎo)出excel文件

摘要：效果預(yù)覽導(dǎo)出文件效果點(diǎn)擊下載彈出框效果代碼總覽為公司業(yè)務(wù)代碼，大多為從緩存或者數(shù)據(jù)庫中獲取導(dǎo)出數(shù)據(jù)，不影響導(dǎo)出功能。導(dǎo)出導(dǎo)出導(dǎo)出所有在線離線用戶成功導(dǎo)出所有在線離線用戶失敗引用導(dǎo)出表格需求將每個(gè)xmpp機(jī)房的在線/離線用戶信息導(dǎo)出到Excel表格中（定時(shí)任務(wù)+網(wǎng)頁按鈕），并在網(wǎng)頁上提供下載按鈕進(jìn)行下載。效果預(yù)覽 showImg(https://segmentfault.com/i...

import. 2019-08-16 13:58 評(píng)論0 收藏0
SpreadJS 純前端表格控件 V12.2 發(fā)布更新

摘要：用不到行代碼，在前端實(shí)現(xiàn)的全部功能千萬前端開發(fā)者翹首企盼，終發(fā)布更新六大功能特性，帶來更多便利，用不到行代碼，在前端實(shí)現(xiàn)的全部功能是一款基于的純前端電子表格控件，以高速低耗高度類似可無限擴(kuò)展為產(chǎn)品特色，提供移動(dòng)跨平臺(tái)和瀏覽器支持，同時(shí)滿足等用不到100行代碼，在前端實(shí)現(xiàn)Excel的全部功能千萬前端開發(fā)者翹首企盼，SpreadJS V12.2 終發(fā)布更新：六大功能特性，帶來更多便利，...

FrozenMap 2019-08-26 10:45 評(píng)論0 收藏0
網(wǎng)頁版模仿Excel

摘要：鼠標(biāo)按下拖拽多選單元格這個(gè)是本唯一的亮點(diǎn)了個(gè)人認(rèn)為。這樣做的結(jié)果是頁面非常卡，因?yàn)槭髽?biāo)移動(dòng)過程會(huì)多次觸發(fā)鼠標(biāo)移動(dòng)事件，會(huì)多次進(jìn)行單元格元素循環(huán)遍歷。網(wǎng)頁版模仿Excel 最近公司閑的dan疼，非要模仿Excel做一個(gè)網(wǎng)頁版的Excel，剛開始聽說要做這么一個(gè)東西的時(shí)候瞬間覺得公司領(lǐng)導(dǎo)高(sang)瞻(xin)遠(yuǎn)(bing)矚(kuang)，只能頭鐵的接下了，那就開始干。其實(shí)主要目的是...

james 2019-08-26 11:49 評(píng)論0 收藏0
網(wǎng)頁版模仿Excel

摘要：鼠標(biāo)按下拖拽多選單元格這個(gè)是本唯一的亮點(diǎn)了個(gè)人認(rèn)為。這樣做的結(jié)果是頁面非常卡，因?yàn)槭髽?biāo)移動(dòng)過程會(huì)多次觸發(fā)鼠標(biāo)移動(dòng)事件，會(huì)多次進(jìn)行單元格元素循環(huán)遍歷。網(wǎng)頁版模仿Excel 最近公司閑的dan疼，非要模仿Excel做一個(gè)網(wǎng)頁版的Excel，剛開始聽說要做這么一個(gè)東西的時(shí)候瞬間覺得公司領(lǐng)導(dǎo)高(sang)瞻(xin)遠(yuǎn)(bing)矚(kuang)，只能頭鐵的接下了，那就開始干。其實(shí)主要目的是...

Carl 2019-08-01 18:42 評(píng)論0 收藏0