tauri中从前端ts调用rust函数,并异步收到响应结果

2024-06-22 18:36

本文主要是介绍tauri中从前端ts调用rust函数,并异步收到响应结果,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在前端是可以异步调用rust代码的,而且还是挺简单的逻辑,一共就三步:定义rust函数,注入到invoke_handler中,在前端调用。有英文能力的可以看官方文档:Calling Rust from the frontend | Tauri Apps

没有英文阅读能力可以看中文文档:Tauri Rust基本示例_w3cschool

定义Rust命令

命令是在 src-tauri/src/main.rs 文件中定义的。 要创建一个命令,只需添加一个函数,并使用 #[tauri::command] 注释:

#[tauri::command]
fn my_custom_command() {println!("I was invoked from JS!");
}

必须向构建器函数提供一个命令列表,如下所示:

// Also in main.rs
fn main() {tauri::Builder::default()// This is where you pass in your commands.invoke_handler(tauri::generate_handler![my_custom_command]).run(tauri::generate_context!()).expect("failed to run app");
}

现在,可以从 JS 代码中调用这个命令:

// When using the Tauri API npm package:
import { invoke } from '@tauri-apps/api/tauri'
// When using the Tauri global script (if not using the npm package)
// Be sure to set `build.withGlobalTauri` in `tauri.conf.json` to true
const invoke = window.__TAURI__.invoke// Invoke the command
invoke('my_custom_command')

 

创建多个命令

tauri::generate_handler!宏接受一个命令数组。要注册多个命令,不能多次调用 invoke_handler。仅使用最后一次调用。必须将每个命令传递给 单个调用。tauri::generate_handler!

#[tauri::command]
fn cmd_a() -> String {"Command a"
}
#[tauri::command]
fn cmd_b() -> String {"Command b"
}fn main() {tauri::Builder::default().invoke_handler(tauri::generate_handler![cmd_a, cmd_b]).run(tauri::generate_context!()).expect("error while running tauri application");
}

优化命令统一管理

可以将这些命令进行统一管理,比如单独报道一个mod里面,然后再从mod里面引入这些命令,这个代码结构更清晰。比如我定义了一个command的mod,然后对外设置为pub:

这样就可以在main.rs里面引入这个mod,并将这个mod里面的函数注册到invoke_handler里面:

在js中调用的时候,依然是调用函数名称即可:

 

这篇关于tauri中从前端ts调用rust函数,并异步收到响应结果的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1085086

相关文章

前端bug调试的方法技巧及常见错误

《前端bug调试的方法技巧及常见错误》:本文主要介绍编程中常见的报错和Bug,以及调试的重要性,调试的基本流程是通过缩小范围来定位问题,并给出了推测法、删除代码法、console调试和debugg... 目录调试基本流程调试方法排查bug的两大技巧如何看控制台报错前端常见错误取值调用报错资源引入错误解析错误

Vue中动态权限到按钮的完整实现方案详解

《Vue中动态权限到按钮的完整实现方案详解》这篇文章主要为大家详细介绍了Vue如何在现有方案的基础上加入对路由的增、删、改、查权限控制,感兴趣的小伙伴可以跟随小编一起学习一下... 目录一、数据库设计扩展1.1 修改路由表(routes)1.2 修改角色与路由权限表(role_routes)二、后端接口设计

MySQL 日期时间格式化函数 DATE_FORMAT() 的使用示例详解

《MySQL日期时间格式化函数DATE_FORMAT()的使用示例详解》`DATE_FORMAT()`是MySQL中用于格式化日期时间的函数,本文详细介绍了其语法、格式化字符串的含义以及常见日期... 目录一、DATE_FORMAT()语法二、格式化字符串详解三、常见日期时间格式组合四、业务场景五、总结一、

C#集成DeepSeek模型实现AI私有化的流程步骤(本地部署与API调用教程)

《C#集成DeepSeek模型实现AI私有化的流程步骤(本地部署与API调用教程)》本文主要介绍了C#集成DeepSeek模型实现AI私有化的方法,包括搭建基础环境,如安装Ollama和下载DeepS... 目录前言搭建基础环境1、安装 Ollama2、下载 DeepSeek R1 模型客户端 ChatBo

springMVC返回Http响应的实现

《springMVC返回Http响应的实现》本文主要介绍了在SpringBoot中使用@Controller、@ResponseBody和@RestController注解进行HTTP响应返回的方法,... 目录一、返回页面二、@Controller和@ResponseBody与RestController

Spring Boot 中正确地在异步线程中使用 HttpServletRequest的方法

《SpringBoot中正确地在异步线程中使用HttpServletRequest的方法》文章讨论了在SpringBoot中如何在异步线程中正确使用HttpServletRequest的问题,... 目录前言一、问题的来源:为什么异步线程中无法访问 HttpServletRequest?1. 请求上下文与线

golang panic 函数用法示例详解

《golangpanic函数用法示例详解》在Go语言中,panic用于触发不可恢复的错误,终止函数执行并逐层向上触发defer,最终若未被recover捕获,程序会崩溃,recover用于在def... 目录1. panic 的作用2. 基本用法3. recover 的使用规则4. 错误处理建议5. 常见错

在 Spring Boot 中使用异步线程时的 HttpServletRequest 复用问题记录

《在SpringBoot中使用异步线程时的HttpServletRequest复用问题记录》文章讨论了在SpringBoot中使用异步线程时,由于HttpServletRequest复用导致... 目录一、问题描述:异步线程操作导致请求复用时 Cookie 解析失败1. 场景背景2. 问题根源二、问题详细分

Vue项目的甘特图组件之dhtmlx-gantt使用教程和实现效果展示(推荐)

《Vue项目的甘特图组件之dhtmlx-gantt使用教程和实现效果展示(推荐)》文章介绍了如何使用dhtmlx-gantt组件来实现公司的甘特图需求,并提供了一个简单的Vue组件示例,文章还分享了一... 目录一、首先 npm 安装插件二、创建一个vue组件三、业务页面内 引用自定义组件:四、dhtmlx

Vue ElementUI中Upload组件批量上传的实现代码

《VueElementUI中Upload组件批量上传的实现代码》ElementUI中Upload组件批量上传通过获取upload组件的DOM、文件、上传地址和数据,封装uploadFiles方法,使... ElementUI中Upload组件如何批量上传首先就是upload组件 <el-upl