當前位置:首頁 » 網頁前端 » 前端導出功能
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

前端導出功能

發布時間: 2022-07-28 23:05:03

1. 關於前端如何導出後台傳來的excel介面

題主所說的導出指的是讓前端去下載後台的Excel還時還要有其他操作呢?

如果單純去下載,可以基於XMLHttpRequest請求,請求一個伺服器或者後端的Excel文件,然後設置responseType為blob二進制流來傳輸。例如:

var excelFilePath = 'resources/Excel/importExcel.xlsx';

var xhr = new XMLHttpRequest();

xhr.open('GET', excelFilePath, true);

xhr.responseType = 'blob';

xhr.onload = function(e) {

var blob = this.response;

}

之後onload裡面的blob就是這個Excel文件的二進制流,接下來只要將blob轉成文件進行下載就可以了,JS中有很多開源的第三方類庫可以做到,例如filesaver。如果是用filesaver的話,調用其中的saveAs方法就可以將該blob轉成對應文件進行下載

例如

var fileName = "test.xlsx"

saveAs(blob, fileName);

把上述方法加到onload 方法中,前端就會下載一個名為test.xlsx的Excel文件,內容就是後端傳過來的Excel

如果還要有其他操作例如展示或者在線的編輯,就需要一些第三方控制項來完成了,比如SpreadJS

上述的方法也是在他們的官方論壇中學到的,參考網址:

網頁鏈接

2. asp.net怎樣利用ajax將前端數據導出為excel

導出Excel,需要Ajax服務端響應的頭為application/x-excel,從而確保瀏覽器能夠以Excel文件進行下載。
你可以把Ajax請求的服務端為httphandler,不要請求Aasp.net頁面,以免你在調試的過程中出現問題。

3. Idea編程前端疑問導出全部excel,是怎麼調用後台服務的

這個倒不一定是後台導出,也可以能是前導出不調後台的,你可以在瀏覽器里F12里,當執行上面這個代碼時,看看是否有向後台發送數據,另外可以搜索一下這個toExcel是在哪個js里定義的。

4. 如何實現SpreadJS的純前端Excel導入導出

  • 導入

導入時使用excelio的open方法,在successCallBack回掉中我們可以獲取到Spread.Sheets的JSON對象。

  • 導出

導出時使用save方法,傳遞json對象,在successCallBack中會獲得一個Excel文件的blob對象。您可以在前段通過使用FileSaver.js直接保存Excel,也可將blob提交伺服器處理。

具體的代碼實現,請參考下面的博客

http://blog.gcpowertools.com.cn/post/spreadsheetsv10-clientside-excelio.aspx

5. 如何連接資料庫開發一個前端一鍵導出報表的工具

ActiveXObject的導出方式
方法一ActiveXObject的導出方式
方法三:支持瀏覽器適配的導出方式(IE+其他瀏覽器)
方法四:以Table格式導為xls文件
方法五:導出為CSV格式[高效推薦]
現在企業的報表開發大部分都使用報表工具完成,成熟的報表工具提供了豐富的顯示設置、圖表類型、導出列印等功能可以簡化報表開發,非常方便。

6. 前端如何實現文件導入、導出、模板下載、錄入等功能,急需大神詳解,謝謝。

簡單的選課系統,功能:選課&保存選課信息。代碼在附件中。

7. 前端怎麼導出後台生成的excel

導出不是前端能搞定的,比如jsp頁面上點擊按鈕,先要在後台生成數據,然後jsp頁面彈出下載窗口,點選路徑就保存到本地計算機了。

8. 製作報告頁面,裡面有各種信息,底部有SHEET頁,如何使用VUE將所有SHEET頁上的內容導出為PDF和PPT

推測你是想用前端VUE框架去做一個類似Excel的電子表格,並且支持導出PDF和PPT的功能。

推薦你一款控制項叫做SpreadJS,SpreadJS本身就是一款純前端(純JS編寫)的類Excel控制項,本身支持目前前端的流行框架VUE,React,Angular,並且控制項本身自帶導出PDF功能,可以直接使用。在系統工程中電子表格這塊的模塊完全可以使用這款控制項來進行開發,並且可以和你系統的其他功能完美兼容。

控制項本身就是電子表格並且支持多個Sheet

希望回答能夠對你有所幫助。