使用 Tauri 开发桌面应用程序：新一代的轻量解决方案

随着 Web 技术的不断发展，构建跨平台桌面应用程序已成为越来越多开发者的选择。目前，Electron 是最广为人知的解决方案，但它体积较大，运行时占用资源多，往往不适合注重轻量化和高性能的场景。而 Tauri 作为一款新兴框架，凭借其小巧的打包体积和原生交互能力，逐渐获得了开发者的关注。

本文将带您了解 Tauri 的基本概念、如何快速上手，并通过一个简单的实例展示 Tauri 的使用方法。

什么是 Tauri？

Tauri 是一个为构建跨平台桌面应用程序而设计的框架。它允许开发者使用现有的前端技术（如 React、Vue、Svelte 等）构建应用程序的 UI，然后通过 Rust 编写后端逻辑，从而实现高效的桌面应用。

核心特点

轻量化
- 打包后的应用程序体积通常仅为几兆。
- 相比 Electron，Tauri 的内存占用显著降低。
安全性
- 默认配置具有强大的安全策略，例如内容安全策略（CSP）。
- 使用 Rust 的安全特性，减少常见的内存漏洞问题。
跨平台支持
- 支持 Windows、macOS 和 Linux。
前后端分离
- UI 使用 Web 技术，逻辑层使用 Rust，从而提升应用性能。

快速开始

接下来，我们将通过一个简单的 Tauri 项目来体验其强大之处。

环境准备

在开始之前，请确保已安装以下工具：

Node.js：用于前端开发。
Rust 工具链：通过 Rust 官网安装。
Tauri CLI：Tauri 提供的命令行工具。

安装 Tauri CLI：

cargo install tauri-cli

创建 Tauri 项目

初始化前端项目：您可以选择使用任何前端框架，这里以 Vite + Vue 为例：
```
npm create vite@latest tauri-demo --template vue
cd tauri-demo
npm install
```
添加 Tauri 模块：在项目目录下运行以下命令：
```
npm install --save-dev @tauri-apps/cli @tauri-apps/api
```
初始化 Tauri 项目：
```
npx tauri init
```
此命令会自动在项目中生成 src-tauri 目录，其中包含 Tauri 的配置文件和后端代码。

配置 Tauri

src-tauri/tauri.conf.json 是 Tauri 的主要配置文件，您可以在其中调整应用程序名称、窗口大小等参数。例如：

{"package": {"productName": "Tauri Demo","version": "0.1.0"},"tauri": {"windows": [{"title": "Tauri 应用","width": 800,"height": 600}]}
}

构建简单的 Tauri 应用

修改前端代码

在 src/App.vue 中添加一个按钮和事件绑定：

<template><div><h1>欢迎使用 Tauri</h1><button @click="greet">向后端发送请求</button></div>
</template><script>
import { invoke } from '@tauri-apps/api';export default {methods: {async greet() {const response = await invoke('greet', { name: 'Tauri 用户' });alert(response);}}
};
</script>

添加 Rust 后端代码

在 src-tauri/src/main.rs 中，定义一个简单的后端接口：

#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]use tauri::command;#[command]
fn greet(name: &str) -> String {format!("你好, {}! 这是来自 Rust 后端的消息。", name)
}fn main() {tauri::Builder::default().invoke_handler(tauri::generate_handler![greet]).run(tauri::generate_context!()).expect("failed to run app");
}

运行应用程序

开发模式下启动应用：

npm run tauri dev

此时，您会看到一个桌面应用程序窗口，并且点击按钮时能够弹出由 Rust 后端返回的消息。

打包应用程序

准备将应用程序发布到生产环境时，可以运行以下命令：

npm run tauri build

打包后生成的安装文件位于 src-tauri/target/release/bundle 中。

更高级的功能

Tauri 还支持许多高级功能，包括但不限于：

文件系统访问：读写本地文件。
多窗口管理：在应用中创建多个窗口。
自定义菜单和托盘图标。
与操作系统交互，如剪贴板操作和通知。

以下是一个访问文件系统的示例：

#[command]
fn read_file(path: &str) -> Result<String, String> {std::fs::read_to_string(path).map_err(|err| err.to_string())
}

您可以通过前端的 invoke 方法调用此接口，并将结果显示在应用中。

对比 Electron

特性	Tauri	Electron
应用体积	几 MB	数十到几百 MB
内存占用	较低	较高
安全性	Rust 提供内存安全保障	无内置保障，依赖开发者
开发语言	前端（任意） + Rust	前端（任意） + Node.js