使用插件权限

本练习的目标是更好地理解如何启用或禁用插件权限，在哪里描述它们以及如何使用插件的默认权限。

最后，您将能够查找和使用任意插件的权限，并了解如何自定义现有权限。您将拥有一个示例 Tauri 应用程序，其中使用了插件和插件特定的权限。

1. 创建 Tauri 应用程序

   创建您的 Tauri 应用程序。在我们的示例中，我们将使用 create-tauri-app

   Bash

   sh <(curl https://create.tauri.app/sh)

   PowerShell

   irm https://create.tauri.app/ps | iex

   Fish

   sh (curl -sSL https://create.tauri.app/sh | psub)

   npm

   npm create tauri-app@latest

   Yarn

   yarn create tauri-app

   pnpm

   pnpm create tauri-app

   deno

   deno run -A npm:create-tauri-app

   bun

   bun create tauri-app

   Cargo

   cargo install create-tauri-app --locked
   cargo create-tauri-app

   在此分步说明中，我们将继续使用 pnpm，但您可以选择其他包管理器并在命令中相应地替换它。

   显示解决方案

   pnpm create tauri-app

   ✔ Project name · plugin-permission-demo
   ✔ Choose which language to use for your frontend · TypeScript / JavaScript - (pnpm, yarn, npm, bun)
   ✔ Choose your package manager · pnpm
   ✔ Choose your UI template · Vanilla
   ✔ Choose your UI flavor · TypeScript
   
   Template created! To get started run:
   cd plugin-permission-demo
   pnpm install
   pnpm tauri dev

2. 将 file-system 插件添加到您的应用程序

   要搜索现有插件，您可以使用多种资源。

   最直接的方法是查看您的插件是否已在文档的插件部分中，因此是 Tauri 维护的插件集的一部分。 Filesystem 插件是 Tauri 插件工作区的一部分，您可以按照说明将其添加到您的项目中。

   如果该插件是社区贡献的一部分，您很可能在 crates.io 上找到它，搜索 tauri-plugin-<您的插件名称>。

   显示解决方案

   如果它是我们工作区中现有的插件，您可以使用自动化方式

   pnpm tauri add fs

   如果您在 crates.io 上找到了它，则需要手动将其添加为依赖项并修改 Tauri 构建器以初始化插件

   cargo add tauri-plugin-fs

   修改 lib.rs 以初始化插件

   src-tauri/src/lib.rs

   #[cfg_attr(mobile, tauri::mobile_entry_point)]
   fn run() {
     tauri::Builder::default()
       .plugin(tauri_plugin_fs::init())
       .run(tauri::generate_context!())
       .expect("error while running tauri application");
   }

3. 了解 fs 插件的默认权限

   每个插件都有一个 default 权限集，其中包含所有权限和作用域，以便开箱即用地使用该插件，并具有合理的最小功能集。

   对于官方维护的插件，您可以在文档中找到渲染的描述（例如，fs 默认）。

   如果您要弄清楚社区插件的权限，则需要查看插件的源代码。这应该在 your-plugin/permissions/default.toml 中定义。

   显示解决方案

   "$schema" = "schemas/schema.json"
   
   [default]
   description = """
   # Tauri `fs` default permissions
   
   This configuration file defines the default permissions granted
   to the filesystem.
   
   ### Granted Permissions
   
   This default permission set enables all read-related commands and
   allows access to the `$APP` folder and sub directories created in it.
   The location of the `$APP` folder depends on the operating system,
   where the application is run.
   
   In general the `$APP` folder needs to be manually created
   by the application at runtime, before accessing files or folders
   in it is possible.
   
   ### Denied Permissions
   
   This default permission set prevents access to critical components
   of the Tauri application by default.
   On Windows the webview data folder access is denied.
   
   """
   permissions = ["read-all", "scope-app-recursive", "deny-default"]

4. 查找正确的权限

   此步骤的重点是找到您需要的权限，以便将命令暴露给前端，并以最小的系统访问权限。

   fs 插件具有自动生成的权限，这些权限将禁用或启用单个命令，并允许或禁用全局作用域。

   这些可以在文档或插件的源代码（fs/permissions/autogenerated）中找到。

   假设我们要启用写入位于用户 $HOME 文件夹中的文本文件 test.txt。

   为此，我们将在自动生成的权限中搜索启用写入文本文件的权限，例如 allow-write-text-file，然后搜索允许我们访问 $HOME/test.txt 文件的作用域。

   我们需要将这些添加到 src-tauri/tauri.conf.json 中的 capabilities 部分，或者 src-tauri/capabilities/ 文件夹中的文件中。默认情况下，src-tauri/capabilities/default.json 中已有一个功能，我们可以对其进行修改。

   显示解决方案

   src-tauri/capabilities/default.json

   {
     "$schema": "../gen/schemas/desktop-schema.json",
     "identifier": "default",
     "description": "Capability for the main window",
     "windows": [
       "main"
     ],
     "permissions": [
       "path:default",
       "event:default",
       "window:default",
       "app:default",
       "image:default",
       "resources:default",
       "menu:default",
       "tray:default",
       "shell:allow-open",
       "fs:default",
       "fs:allow-write-text-file",
     ]
   }

   由于 fs 插件中只有自动生成的作用域才能访问完整的 $HOME 文件夹，因此我们需要配置我们自己的作用域。此作用域应仅为 write-text-file 命令启用，并且应仅公开我们的 test.txt 文件。

   显示解决方案

   src-tauri/capabilities/default.json

      {
     "$schema": "../gen/schemas/desktop-schema.json",
     "identifier": "default",
     "description": "Capability for the main window",
     "windows": [
       "main"
     ],
     "permissions": [
       "path:default",
       "event:default",
       "window:default",
       "app:default",
       "image:default",
       "resources:default",
       "menu:default",
       "tray:default",
       "shell:allow-open",
       "fs:allow-write-text-file",
       {
         "identifier": "fs:allow-write-text-file",
         "allow": [{ "path": "$HOME/test.txt" }]
       },
     ]
   }

5. 实践中测试权限

   添加必要的权限后，我们想要确认我们的应用程序可以访问该文件并写入其内容。

   显示解决方案

   我们可以在我们的应用程序中使用此代码片段来写入文件

   src/main.ts

   import { writeTextFile, BaseDirectory } from '@tauri-apps/plugin-fs';
   
   let greetInputEl: HTMLInputElement | null;
   
   async function write(message: string) {
       await writeTextFile('test.txt', message, { baseDir: BaseDirectory.Home });
   }
   
   window.addEventListener("DOMContentLoaded", () => {
     greetInputEl = document.querySelector("#greet-input");
     document.querySelector("#greet-form")?.addEventListener("submit", (e) => {
       e.preventDefault();
       if (!greetInputEl )
         return;
   
       write(greetInputEl.value == "" ? "No input provided": greetInputEl.value);
   
     });
   });

   将 src/main.ts 替换为此代码片段意味着当使用纯 Vanilla+Typescript 应用程序时，我们不需要修改默认的 index.html。在正在运行的应用程序的输入字段中输入任何内容都将在提交时写入文件。

   现在让我们在实践中进行测试

   pnpm run tauri dev

   在输入内容并单击“提交”后，我们可以通过终端模拟器或手动打开主文件夹中的文件来检查。

   cat $HOME/test.txt

   您应该看到您的输入，并完成了关于在 Tauri 应用程序中使用插件权限的学习。🥳

   如果您遇到此错误

   [Error] Unhandled Promise Rejection: fs.write_text_file not allowed. Permissions associated with this command: fs:allow-app-write, fs:allow-app-write-recursive, fs:allow-appcache-write, fs:allow-appcache-write-recursive, fs:allow-appconf...
   (anonymous function) (main.ts:5)

   那么您很可能没有正确遵循之前的说明。