HTML 5 剪貼簿與檔案 API
我收到關於 TableTools 最常見的問題之一，是是否有可能移除 Flash 的依賴。直到最近，答案一直是否，但現在由於 W3C 提出的新 API，可能在隧道盡頭出現了一絲曙光。
TableTools 使用 Flash 的兩個目的
- 複製到剪貼簿
- 將資料儲存到本機檔案
目前，在各種瀏覽器中沒有實作任何 API，能夠在不使用 Flash 的情況下，為 TableTools 提供這兩種基本功能。然而，W3C 正在開發可以執行這些任務的 API，並且希望很快就能在瀏覽器中實現。
在我們繼續之前，請注意，這篇文章是根據規格文件中編輯草案和工作草案狀態的資訊撰寫的，如 W3C 所定義。規格未來可能會有所變更。
剪貼簿 API
我們感興趣的第一個 API 是 剪貼簿 API。目前的規格主要關注於 copy、cut 和 paste 事件，並能夠透過明確定義的 API（ClipboardEvent 物件）來監聽這些事件。
最新的編輯草案增加了建立這些事件的能力 - 稱為合成事件，這要歸功於 James Greene 提交的錯誤報告，他是 ZeroClipboard 專案的成員，TableTools 目前正在使用 ZeroClipboard。
有了這些合成事件，我們能夠建立新的 ClipboardEvent 物件，並像任何其他 DOM 事件一樣觸發它。這些剪貼簿事件被稱為半信任，因此您的瀏覽器會詢問您是否允許該網域使用剪貼簿操作，就像網頁目前可能會詢問您是否允許他們使用您的位置來進行地理位置 API 操作一樣。
作為所提出 API 的範例，TableTools 將能夠使用以下程式碼將表格資訊以 CSV 格式複製到剪貼簿
$(button).on( 'click', function (e) {
var data = table
.data()
.map( function (row) {
return row.join(',');
} )
.join( '\n' );
var clip = new ClipboardEvent( 'copy' );
clip.clipboardData.setData( 'text/plain', data );
clip.preventDefault();
e.target.dispatchEvent( clip );
} );
這當然是一個簡化的案例，因為它沒有提供 TableTools 提供的許多配置選項，但它顯示我們如何簡單地使用這個優秀的新 API。
檔案 API
能夠在 Javascript 中按需建立檔案，是我們對 TableTools 感興趣的第二個新 API 的基礎，即 檔案寫入器 API。
已經有一些方法可以在 HTML 中建立和儲存檔案，包括使用 data:// 偽協定，但這些方法存在一些限制，例如在舊版瀏覽器中無法運作、不總是能夠命名檔案，並且沒有像 Flash FileReference API 那樣簡潔易用的語法。然而，新的檔案寫入器 API 將在 Javascript 中為我們提供完全相同的功能。
在撰寫本文時，檔案寫入器 API 定義了一個 saveAs 全域函式（我認為這很可能在規格最終確定之前會發生變更，因為很可能會引入名稱衝突），它只需要一個 Blob 和檔案名稱，即可將 Blob 中的資料儲存為檔案。
回到我們儲存表格中 CSV 資料的範例，要儲存到本機檔案，程式碼現在是
$(button).on( 'click', function (e) {
var data = table
.data()
.map( function (row) {
return row.join(',');
} )
.join( '\n' );
saveAs(
new Blob( [data], {type : 'text/csv'},
'My file.csv'
);
} );
雖然檔案寫入器 API 仍然是工作草案，但它比剪貼簿 API 進展更多，而且 Microsoft 已經在 IE10+ 中實作了該 API。其他瀏覽器尚未具備此功能，但是像 Eli Grey 的 FileSaver 這樣的 shim 層在許多瀏覽器中提供了此功能。
結論
在一個已經完全拋棄 Flash 的網路開發世界中，必須依賴 Flash 來完成諸如在 TableTools 中複製到剪貼簿和儲存到檔案之類的簡單任務，這長期以來一直令人感到沮喪。然而，隨著這兩項規格在 W3C 中不斷推進，並且希望瀏覽器開發人員能夠盡快實作它們，TableTools 不再需要 Flash 的日子可能不遠了。