Tauri知識概覽

最近在折騰 WA+ 項目，因為要實現(xiàn)一些隨心所欲（想到哪是哪）的功能。就被 Tauri 摧殘的不輕。查過很多相關(guān)資料，對 Tauri 也有了一些新的體會（認知有限，不保證完全正確，請自行判斷）。

關(guān)于 WA+

WA+ = W(eb) + A(pp) + more...

哇，無限可能！

WA+[1] - Making a web page more like a desktop application is just the beginning, the possibilities are unlimited, up to your imagination!

Tauri 概覽

利用操作系統(tǒng)提供的 WebView 來呈現(xiàn)界面，來避免打包體積過大。一般套殼空應(yīng)用打包后的體積控制在 3M 左右。而 Electron[2] 會將整個 Chromium[3] 打包進應(yīng)用（安裝包體積幾十兆起步）。

因為系統(tǒng)差異，所以使用自帶 Webview 會存在兼容性問題，但是應(yīng)該朝前看，IE 瀏覽器都被微軟自家宣布死亡了。

相比 Electron 有更低的內(nèi)存占用，更小的體積，更少的線程，系統(tǒng)調(diào)用等。了解更多 Tauri 基準測試[4]。

安裝包是跨平臺的，目前支持 Mac，Windows，Linux 等，未來也會支持 iOS/iPadOS 和 Android 等，跨平臺打包可以使用官方提供的 Tauri GitHub Action[5]，雖然是跨端，但是一些特定于平臺的代碼還是需要借助于插件或者自行實現(xiàn)，并在真機上進行功能驗證，否則可能出現(xiàn)行為和預(yù)期不一致。

提供內(nèi)置簽名以確保應(yīng)用自動更新時可以安全安裝，相關(guān)配置請查看 Tauri Updater[6]。

使用 tauri icons[7] 命令生成自定義應(yīng)用圖標（要求：格式為 PNG 的正方形圖片）。

應(yīng)用更安全，Tauri 在架構(gòu)層做了很多安全處理（比如：通過配置來約束 Tauri 訪問系統(tǒng)文件，網(wǎng)絡(luò)請求，剪貼板等）。

源代碼更安全，Tauri 只提供二進制文件。而不是像 Electron 的 ASAR[8] 文件。

數(shù)據(jù)更安全，隔離模式會對前后端（Webview 和 Tauri Core）通信數(shù)據(jù)進行加密傳輸。

前端使用 HTML、CSS、JavaScript 來構(gòu)建界面（也可以使用前端主流技術(shù)，如：vite[9]，react[10]，vue[11]，svelte[12] 等）。后端目前使用 Rust，未來也可能會支持其他類型語言（如：Go、Nim、Python、Csharp 等）。

強大的系統(tǒng)交互能力，支持配置全局快捷鍵，系統(tǒng)菜單，系統(tǒng)托盤，文件讀寫，命令行，系統(tǒng)信息，剪貼板等。Rust 給 Tauri 帶來了無限的想象力，Rust 可以做的事情，Tauri 理論上也可以做（歡迎自行嘗試，可能也有做不了的）。

Tauri Window[13] 支持多種配置。磨砂透明背景，無邊框功能則需要借助的兩個插件（支持 Windows 和 macOS，Linux 暫不支持）：

window-shadows[14] - 為窗口添加陰影。

window-vibrancy[15] - 為窗口配置磨砂效果。

支持創(chuàng)建多個窗口以及為新窗口腳本注入，但是腳本注入需要在 rust 端創(chuàng)建窗口，使用 WindowBuilder::new 中的 initialization_script 來加載腳本。

通過提供的 Tauri Command[16]，可以從 Web 應(yīng)用程序調(diào)用 Rust 函數(shù)。通過 Tauri Events[17]（emit 和 listen）可以在前后端之間傳遞消息，它與 Tauri Command 有類似性。

...

綜合來看，Tauri JS API[18] 確實提供了很多便捷 API 供前端使用，但是有些底層方法并未暴露，而 Tauri Rust API[19] 則要強大很多。

開發(fā)問題

資源 & 文檔

Tauri doc[20] - 官方文檔，第一參考資料，建議熟讀，源碼及 issues 可以作為補充。

Awesome Tauri[21] - 精選的 Tauri 生態(tài)系統(tǒng)和社區(qū)中最好的東西，包含插件和應(yīng)用，可以借鑒和學(xué)習(xí)。

Tauri issues[22] - 質(zhì)量很高的問題回答，可以解決開發(fā)中遇到的大量困惑或報錯。如果未搜到，還可以自己上報，執(zhí)行 cargo tauri info 或 npm run tauri info 可以查看平臺和版本信息。

Tauri discussions[23] - 討論社區(qū)

MDN doc[24] - 很權(quán)威的 Web 技術(shù)文檔，包含 CSS，HTML，JavaScript。

Rust doc[25] - Rust 編程語言基本語法學(xué)習(xí)

npmjs[26] - 前端生態(tài)的包管理網(wǎng)站

crates.io[27] - Rust 生態(tài)的包管理網(wǎng)站

開發(fā)準備

編輯器推薦使用 Visual Studio Code[28]，需要安裝的插件：

Tauri[29] - 對 Tauri 命令和 tauri.conf.json JSON 驗證提供支持。

rust-analyzer[30] - 插件提供了對 Rust 編程語言的支持。包含代碼提示，類型定義，代碼跳轉(zhuǎn)等等。

crates[31] - 是 crates.io 依賴項的插件。旨在幫助開發(fā)人員在使用 Cargo.toml 時管理依賴項（鼠標懸停 crate 名稱可以顯示可用版本列表）。

常見問題

子窗口不能使用 __TAURI__ API

新創(chuàng)建的遠程 URL 子窗口無法使用 Tauri API，因為這與 Tauri 架構(gòu)安全是違背的，以下有兩條相關(guān) issues：

[bug] cant use window.TAURI with remote url[32]

[feat] Inject window.TAURI in allowed remote URLs[33]

簡單概括為：任何與 IPC 相關(guān)的問題都觸及到了 Tauri 核心，并不能快速解決此類問題，但在 v2，v3 或未來更高的版本會有所改進。

Tauri 不會在外部 URL 開的窗口上注入 Tauri API，如果項目沒有本地資源，可以通過將 distDir 設(shè)置為遠程 URL 來解決這個問題，或者在使用的運行時更改它。

但這種情況下只有一個外部 URL 能夠訪問 Tauri API，其實就是修改 tauri.conf.json 中配置的 build.devPath（開發(fā)環(huán)境） 和 build.distDir （生產(chǎn)環(huán)境）字段。

Brownfield vs Isolation 模式

Brownfield 模式[34]是使用 Tauri 的最簡單、最直接的模式，因為它盡可能地與現(xiàn)有的前端項目兼容。但也并非完全兼容（API 未被瀏覽器廣泛支持，Tauri 正在實現(xiàn)中的），請參閱 不兼容部分[35]。

Isolation 模式[36]下前端發(fā)送到 Tauri Core 之前會被注入的一個安全的應(yīng)用程序攔截和修改傳入的 IPC 消息（使用 iframe[37] 沙盒隔離，使用瀏覽器的 SubtleCrypto[38] 來對數(shù)據(jù)進行加密。

為了確保安全，每次運行應(yīng)用時都會生成新的密鑰），來避免被前端惡意調(diào)用。

總結(jié)：所以老項目想使用 Tauri 進行套殼，想快速上線，可以考慮 Brownfield 模式。使用 Isolation 模式則更加安全，通信時消息加解密相比于 Brownfield 模式會存在額外的開銷成本，除非高性能要求，否則 AES-GCM 身份驗證算法的成本幾乎可以忽略不計。

評價 Tauri

在技術(shù)群，文章評論區(qū)也有一些朋友問過我：”如何看待 Tauri？“，我也只是業(yè)余折騰，寫過幾篇淺顯的文章而已。

以我目前的了解來看，覺得它很可能成為下一代跨端（桌面，移動端）方案，但前提是它真的實現(xiàn)了比較易用的移動端綁定（目前還在計劃中）。Web 的生態(tài)奠定了今天的互聯(lián)網(wǎng)基礎(chǔ)，前端技術(shù)又是層出不窮，快速迭代。而 Tauri 想做的事情就是實現(xiàn) Webview 和系統(tǒng)之間的橋接層（站在巨人的肩膀）。

所以跨多少個端，提供什么樣的能力是 Tauri 需要考慮的事情，開發(fā)應(yīng)用功能是我們需要考慮的事情。Tauri 未提供的支持，我們也可以通過它的插件機制去擴展。

審核編輯：劉清