最近在折騰 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 未提供的支持,我們也可以通過它的插件機制去擴展。
審核編輯:劉清
-
HTML
+關(guān)注
關(guān)注
0文章
277瀏覽量
33540 -
CSS
+關(guān)注
關(guān)注
0文章
108瀏覽量
14326 -
LINUX內(nèi)核
+關(guān)注
關(guān)注
1文章
315瀏覽量
21580 -
png
+關(guān)注
關(guān)注
0文章
14瀏覽量
4387
原文標題:一文讀懂 Tauri
文章出處:【微信號:Rust語言中文社區(qū),微信公眾號:Rust語言中文社區(qū)】歡迎添加關(guān)注!文章轉(zhuǎn)載請注明出處。
發(fā)布評論請先 登錄
相關(guān)推薦
評論