「貼上即下載」的技術實現解析

「貼上即下載」由一個負責輸出頁面的小型伺服器,和一組把檔案處理全部放在你瀏覽器裡完成的工具組成。

工作原理

每個工具都遵循同樣的四步模式:

  1. 貼上或選擇本機檔案。
  2. 瀏覽器 API 解碼並檢查檔案。
  3. 根據工具不同,由 Canvas、WebAssembly、ONNX Runtime Web 或 PDF 函式庫在你的裝置上處理。
  4. 瀏覽器產生結果並儲存到本機。

整個流程中,檔案內容始終留在瀏覽器裡,不會為了處理而上傳到我們的伺服器。

我們的技術棧包括:

  • 介面使用原生 JavaScript + Alpine.js
  • 圖片處理使用 Canvas API 和 WebAssembly 編解碼器
  • AI 工具(去背、放大、修復)使用 ONNX Runtime Web 模型
  • PDF 和打包工具使用 pdf-lib 和 JSZip
  • 樣式使用 Tailwind CSS;部分函式庫和模型在首次使用時從 CDN 載入

安全性與隱私保護

我們高度重視用戶的安全與隱私。專案設計嚴格遵循以下原則:

  • 檔案本機處理 - 你選擇的檔案在瀏覽器內處理,不會為了處理而上傳
  • 站點儲存與你的檔案是兩回事 - 網站在你的瀏覽器裡儲存少量偏好(如主題和語言);你的圖片和 PDF 內容不會寫入我們的伺服器
  • 相依套件按需載入 - 第三方函式庫和 AI 模型在工具需要時從 CDN 載入;它們在你的瀏覽器裡執行,你的檔案不會上傳給它們

技術局限性

由於我們採用純前端技術實現,專案存在一些技術上的限制:

  • 在現代瀏覽器中執行;部分工具需要較新的 API(WebAssembly,可用時使用 WebGPU)
  • 大檔案和大批次處理受你裝置記憶體的限制
  • 每個工具都有明確的檔案大小或像素上限;不常見的格式變種可能解碼失敗
  • 若干函式庫和 AI 模型在首次使用時透過網路下載(最大約 40 MB)
  • AI 結果是盡力而為——邊緣、細微紋理和複雜場景不一定每次都完美

工具目前能做什麼

14 個工具全部已上線、免費、瀏覽器本機執行:

最初版本的核心貼上工具已在 GitHub 開源。 工具的所有處理都在你的瀏覽器裡執行,你隨時可以檢查網路活動和送達的 JavaScript。 如果您對本專案的技術實現有任何疑問或建議,請透過以下方式與我們聯繫: [email protected]