【一起学Rust | 框架篇 | Tauri2.0框架】在Tauri应用中设置Http头(Headers)


文章目录
- 前言
- 一、配置准备
- 1. 检查版本
- 2. 使用条件
- 3. 支持的请求头(并不是全部支持)
- 二、使用步骤
- 1. 如何配置header
- 2. 框架集成
- 1. 对于`Vite`系列、`Nuxt`、`Next.js`这种前端框架
- `Vite`系列框架
- `Angular`系列框架
- `Nuxt`系列框架
- `Next.js`系列框架
- 2. 对于`Yew`和`Leptos`这种全栈框架
前言
Tauri是一个基于Rust的跨平台桌面应用框架,允许开发者使用Web技术(如HTML、CSS和JavaScript)创建桌面应用。Tauri2.0是该框架的最新版本,提供了许多新功能和改进。其中一个重要的功能是对Http头(Headers)的支持。在本文中,我们将探讨如何在Tauri应用中设置Http头,包括为什么设置Http头是必要的、如何设置Http头,以及一些常见的Http头设置场景。
在Web开发中,Http头(Headers)是Http请求和响应的一部分,用于传递额外的信息。Http头可以用来指定请求的方法、请求体的格式、认证信息等。设置Http头是必要的,因为它可以帮助开发者控制Http请求的行为,例如指定请求的缓存策略、设置跨域资源共享(CORS)头等。特别是在Tauri应用中,设置Http头可以帮助开发者与后端服务器进行更好的交互。
在应用开发过程中,对于http的headers控制是一个通常的需求,在过去的tauri版本中,如果你想要设置http请求头,就需要ipc调用rust层的方法,然后再设置请求头,就比较麻烦,或者你可以试试用Fetch看看能否得到你想要的效果。但是现在,最近Tauri官方就给出了配置http请求头的方法,尽管并不能尽善尽美,但也足够开发使用了。
一、配置准备
1. 检查版本
首先确认你的tauri版本要大于2.1.0,因为这是后面新增的特性,如果你是刚刚从头创建的Tauri项目,那么可以跳过这步。
2. 使用条件
然后就是要明确知道什么时候会用上这个配置。
配置中定义的标头会随对网页视图的响应一起发送。这并不包括进程间通信(IPC)消息和错误响应。更具体地说,通过crates/tauri/src/protocol/tauri.rs中的get_response函数发送的每个响应都将包含这些标头。
3. 支持的请求头(并不是全部支持)
- Access-Control-Allow-Credentials
- Access-Control-Allow-Headers
- Access-Control-Allow-Methods
- Access-Control-Expose-Headers
- Access-Control-Max-Age
- Cross-Origin-Embedder-Policy
- Cross-Origin-Opener-Policy
- Cross-Origin-Resource-Policy
- Permissions-Policy
- Timing-Allow-Origin
- X-Content-Type-Options
- Tauri-Custom-Header
以上请求头的意义均可在MDN找到
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Credentials
以下是官方建议
Tauri-Custom-Header并非用于生产环境。- 内容安全策略(Content-Security-Policy,CSP)在此处未定义。(暂时先不用管)
二、使用步骤
1. 如何配置header
官方文档写的,tauri的header支持以下值
- 字符串
- 字符串数组
- key-value对象,但是value必须是字符串
- null
标头值始终会针对实际响应转换为字符串。根据配置文件的外观,某些标头值需要进行组合。以下是创建复合标头的规则:
string- 与最终转化的结果保持一致Array- 结果是用,连接起来key-value- 最终打包的格式是key + 空格 + value,然后结尾用;分割null- 最终会被忽略
例如
// src-tauri/tauri.conf.json
{//..."app":{//..."security": {//..."headers": {"Cross-Origin-Opener-Policy": "same-origin","Cross-Origin-Embedder-Policy": "require-corp","Timing-Allow-Origin": ["https://developer.mozilla.org","https://example.com",],"X-Content-Type-Options": null, // 忽略"Access-Control-Expose-Headers": "Tauri-Custom-Header","Tauri-Custom-Header": {"key1": "'value1' 'value2'","key2": "'value3'"}},// 告诉内容安全策略(CSP)手动制定请求头。"csp": "default-src 'self'; connect-src ipc: http://ipc.localhost",}}
}
Tauri-Custom-Header并非用于生产环境。对于测试:请记得相应地设置Access-Control-Expose-Headers。
在这个示例中,Cross-Origin-Opener-Policy和Cross-Origin-Embedder-Policy被设置为允许使用SharedArrayBuffer (文档在MDN)。Timing-Allow-Origin允许从列出的网站加载的脚本通过资源定时 API 访问详细的网络定时数据。
最终的请求头结果会转化为
access-control-allow-origin: http://tauri.localhost
access-control-expose-headers: Tauri-Custom-Header
content-security-policy: default-src 'self'; connect-src ipc: http://ipc.localhost; script-src 'self' 'sha256-Wjjrs6qinmnr+tOry8x8PPwI77eGpUFR3EEGZktjJNs='
content-type: text/html
cross-origin-embedder-policy: require-corp
cross-origin-opener-policy: same-origin
tauri-custom-header: key1 'value1' 'value2'; key2 'value3'
timing-allow-origin: https://developer.mozilla.org, https://example.com
2. 框架集成
一些开发环境需要额外的设置,以模拟生产环境。
1. 对于Vite系列、Nuxt、Next.js这种前端框架
Vite系列框架
对于使用Vite来构建的项目(包括Qwik, React, Solid, Svelte, 和 Vue),只所需的标头添加到vite.config.ts中。
import { defineConfig } from 'vite';export default defineConfig({// ...server: {// ...headers: {'Cross-Origin-Opener-Policy': 'same-origin','Cross-Origin-Embedder-Policy': 'require-corp','Timing-Allow-Origin': 'https://developer.mozilla.org, https://example.com','Access-Control-Expose-Headers': 'Tauri-Custom-Header','Tauri-Custom-Header': "key1 'value1' 'value2'; key2 'value3'"},},
})
Angular系列框架
Angular需要写入angular.json,按照以下方式
{//..."projects":{//..."insert-project-name":{//..."architect":{//..."serve":{//..."options":{//..."headers":{"Cross-Origin-Opener-Policy": "same-origin","Cross-Origin-Embedder-Policy": "require-corp","Timing-Allow-Origin": "https://developer.mozilla.org, https://example.com","Access-Control-Expose-Headers": "Tauri-Custom-Header","Tauri-Custom-Header": "key1 'value1' 'value2'; key2 'value3'"}}}}}}
}
Nuxt系列框架
Nuxt系列框架需要写入的文件是nuxt.config.ts
// nuxt.config.ts
export default defineNuxtConfig({//...vite: {//...server: {//...headers:{'Cross-Origin-Opener-Policy': 'same-origin','Cross-Origin-Embedder-Policy': 'require-corp','Timing-Allow-Origin': 'https://developer.mozilla.org, https://example.com','Access-Control-Expose-Headers': 'Tauri-Custom-Header','Tauri-Custom-Header': "key1 'value1' 'value2'; key2 'value3'"}},},
});
Next.js系列框架
Next.js并不依赖于Vite,但是异曲同工,写入的文件是next.config.js
// next.config.js
module.exports = {//...async headers() {return [{source: '/*',headers: [{key: 'Cross-Origin-Opener-Policy',value: 'same-origin',},{key: 'Cross-Origin-Embedder-Policy',value: 'require-corp',},{key: 'Timing-Allow-Origin',value: 'https://developer.mozilla.org, https://example.com',},{key: 'Access-Control-Expose-Headers',value: 'Tauri-Custom-Header',},{key: 'Tauri-Custom-Header',value: "key1 'value1' 'value2'; key2 'value3'",},],},]},
}
2. 对于Yew和Leptos这种全栈框架
这种全栈框架只需要新建个文件Trunk.toml,然后按照以下内容写入即可
# Trunk.toml
#...
[serve]
#...
headers = {"Cross-Origin-Opener-Policy" = "same-origin","Cross-Origin-Embedder-Policy" = "require-corp","Timing-Allow-Origin" = "https://developer.mozilla.org, https://example.com","Access-Control-Expose-Headers" = "Tauri-Custom-Header","Tauri-Custom-Header" = "key1 'value1' 'value2'; key2 'value3'"
}
相关文章:
【一起学Rust | 框架篇 | Tauri2.0框架】在Tauri应用中设置Http头(Headers)
文章目录 前言一、配置准备1. 检查版本2. 使用条件3. 支持的请求头(并不是全部支持) 二、使用步骤1. 如何配置header2. 框架集成1. 对于Vite系列、Nuxt、Next.js这种前端框架Vite系列框架Angular系列框架Nuxt系列框架Next.js系列框架 2. 对于Yew和Leptos…...
STM32G473VET6 在 Keil MDK 下手动移植 FreeRTOS 指南
下面将详细介绍如何在 Keil MDK 环境下将 FreeRTOS 手动移植到 STM32G473VET6 微控制器上。内容涵盖工程创建、获取源码、文件组织、移植层适配、测试任务编写以及编译调试等步骤。 1. 工程搭建(Keil 项目创建) 创建基础工程:首先准备一个基…...
波导阵列天线 学习笔记11双极化全金属垂直公共馈电平板波导槽阵列天线
摘要: 本communicaition提出了一种双极化全金属垂直公共馈电平板波导槽阵列天线。最初提出了一种公共馈电的单层槽平板波导来实现双极化阵列。此设计消除了传统背腔公共馈电的复杂腔体边缘的必要性,提供了一种更简单的天线结构。在2x2子阵列种发展了宽十…...
DeepSeek-R1自写CUDA内核跑分屠榜:开启GPU编程自动化新时代
引言 在AI领域,深度学习模型的性能优化一直是研究者们关注的核心。最近,斯坦福和普林斯顿的研究团队发现,DeepSeek-R1生成的自定义CUDA内核不仅超越了OpenAI的o1和Claude 3.5 Sonnet,还在KernelBench框架中取得了总排名第一的好成…...
001 Kafka入门及安装
Kafka入门及安装 文章目录 Kafka入门及安装1.介绍Kafka的基本概念和核心组件 2.安装1.docker快速安装zookeeper安装kafka安装 添加topic删除topickafka-ui安装 2.Docker安装(SASL/PLAIN认证配置-用户名密码) 来源参考的deepseek,如有侵权联系…...
2024 年出现的 11 大数据收集趋势
数据收集趋势的出现是对技术进步、企业需求和市场波动的回应,我们对 2025 年的预测涵盖了所有方面。物联网和人工智能等前沿技术将改变组织收集和处理数据的方式,法规将促使它们更加细致地对待数据,而消费者对增强现实和虚拟现实的兴趣将为数…...
动态内容加载的解决方案:Selenium与Playwright对比故障排查实录
方案进程 2024-09-01 09:00 | 接到亚航航班数据采集需求 2024-09-01 11:30 | 首次尝试使用Selenium遭遇Cloudflare验证 2024-09-01 14:00 | 切换Playwright方案仍触发反爬机制 2024-09-01 16:30 | 引入爬虫代理IPUA轮换策略 2024-09-02 10:00 | 双方案完整实现并通过压力测试故…...
OSPF BIT 类型说明
注:本文为 “OSPF BIT 类型 | LSA 类型 ” 相关文章合辑。 机翻,未校。 15 OSPF BIT Types Explained 15 种 OSPF BIT 类型说明 Rashmi Bhardwaj Distribution of routing information within a single autonomous system in larger networks is per…...
java excel xlsx 增加数据验证
隐藏表下拉框 // 创建隐藏工作表存储下拉框数据String hiddenSheetName "HiddenSheet"System.currentTimeMillis();Sheet hiddenSheet workbook.createSheet(hiddenSheetName);//设置隐藏sheetworkbook.setSheetHidden(workbook.getSheetIndex(hiddenSheetName), …...
React + TypeScript 数据血缘分析实战
React TypeScript 数据血缘分析实战 目录 技术选型与架构设计核心概念解析基础场景实现 场景一:visx库基础血缘图实现场景二:React-Lineage-DAG企业级方案场景三:动态数据源与复杂交互 TypeScript类型系统深度优化性能优化与工程化实践开源…...
魔搭 ModelScope 模型下载
wget https://developer.download.nvidia.com/compute/cuda/12.6.0/local_installers/cuda_12.6.0_560.28.03_linux.run sudo sh cuda_12.6.0_560.28.03_linux.run# pip -V pip 24.3.1 # pip3 -V pip 24.3.1设置pip镜像源 # pip config set global.index-url https://mirrors.…...
WorldQuant Brain的专属语言——Fast Expression
使用brain需要的编程语言 在使用BRAIN平台时往往不需要事先有编码背景,因此小白也能很快对其上手,但有经验的程序员来讲,该平台暂时没有禁止API通信低强度进行时的程序化访问(但是非常不好意思😣怎么访问我没找到&…...
在低功耗MCU上实现人工智能和机器学习
作者:Silicon Labs 人工智能(AI)和机器学习(ML)技术不仅正在快速发展,还逐渐被创新性地应用于低功耗的微控制器(MCU)中,从而实现边缘AI/ML解决方案。这些MCU是许多嵌入式…...
MSSQL2022的一个错误:未在本地计算机上注册“Microsoft.ACE.OLEDB.16.0”提供程序
MSSQL2022导入Excel的一个错误:未在本地计算机上注册“Microsoft.ACE.OLEDB.16.0”提供程序 一、导入情况二、问题发现三、问题解决 最近在安装新版SQLServer SSMS 2022后,每次导入Excel都会出现错误提示:未在本地计算机上注册“Microsoft.…...
(2.26 “详细分析示例“ 暴力+位运算 最长优雅子数组)leetcode 2401
a&b0说明a和b的每一位都是一个0和一个1 不存在两个均为1的位次 a|0a 0与任何数|都等于它本身 (mask)的作用: 担心两数的1在用一位导致mask覆盖了? 答:出现这种情况说明mask与nums j后就直接break 由:…...
【洛谷贪心算法题】P1094纪念品分组
该题运用贪心算法,核心思想是在每次分组时,尽可能让价格较小和较大的纪念品组合在一起,以达到最少分组的目的。 【算法思路】 输入处理:首先读取纪念品的数量n和价格上限w,然后依次读取每件纪念品的价格,…...
基于coze+微信小程序的ai对话
界面介绍: 代码:(替换你的coze的配置) <template><view class"container"><!-- 高斯模糊背景 --><view class"animated-bg"><view class"gradient-blob"></view…...
[Linux]项目自动化构建工具-make/Makefile
项目自动化构建工具-make/Makefile make与Makefile单文件Makefile多文件Makefile 缓冲区 首先理清多文件之间的关系: 这里为什么没有包含test.h头文件?因为在当前工作目录下,因此不需要包含test.h,如果把test.h移到上一级目录&…...
Dashboard-frps
通过浏览器查看 frp的状态以及代理统计信息展示。 注:Dashboard 尚未针对大量的 proxy 数据展示做优化,如果出现 Dashboard 访问较慢的情况,请不要启用此功能。 需要在 frps.ini中指定 dashboard服务使用的端口,即可开启此功能&…...
android 新增native binder service 方式(三)
书接上回,继续第三种方式,是手动生成 service binder 的方法,项目结构 1,编译aidl aidl 文件保持不变,如何生成Bn和Bp 文件呢。 aidl -I ./libserviceaidl/aidl -h ./ -o ./ --langcpp libserviceaidl/aidl/com/test/IService.a…...
未来机器人的大脑:如何用神经网络模拟器实现更智能的决策?
编辑:陈萍萍的公主一点人工一点智能 未来机器人的大脑:如何用神经网络模拟器实现更智能的决策?RWM通过双自回归机制有效解决了复合误差、部分可观测性和随机动力学等关键挑战,在不依赖领域特定归纳偏见的条件下实现了卓越的预测准…...
零门槛NAS搭建:WinNAS如何让普通电脑秒变私有云?
一、核心优势:专为Windows用户设计的极简NAS WinNAS由深圳耘想存储科技开发,是一款收费低廉但功能全面的Windows NAS工具,主打“无学习成本部署” 。与其他NAS软件相比,其优势在于: 无需硬件改造:将任意W…...
C++初阶-list的底层
目录 1.std::list实现的所有代码 2.list的简单介绍 2.1实现list的类 2.2_list_iterator的实现 2.2.1_list_iterator实现的原因和好处 2.2.2_list_iterator实现 2.3_list_node的实现 2.3.1. 避免递归的模板依赖 2.3.2. 内存布局一致性 2.3.3. 类型安全的替代方案 2.3.…...
基于距离变化能量开销动态调整的WSN低功耗拓扑控制开销算法matlab仿真
目录 1.程序功能描述 2.测试软件版本以及运行结果展示 3.核心程序 4.算法仿真参数 5.算法理论概述 6.参考文献 7.完整程序 1.程序功能描述 通过动态调整节点通信的能量开销,平衡网络负载,延长WSN生命周期。具体通过建立基于距离的能量消耗模型&am…...
Spring Boot 实现流式响应(兼容 2.7.x)
在实际开发中,我们可能会遇到一些流式数据处理的场景,比如接收来自上游接口的 Server-Sent Events(SSE) 或 流式 JSON 内容,并将其原样中转给前端页面或客户端。这种情况下,传统的 RestTemplate 缓存机制会…...
在rocky linux 9.5上在线安装 docker
前面是指南,后面是日志 sudo dnf config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo sudo dnf install docker-ce docker-ce-cli containerd.io -y docker version sudo systemctl start docker sudo systemctl status docker …...
【位运算】消失的两个数字(hard)
消失的两个数字(hard) 题⽬描述:解法(位运算):Java 算法代码:更简便代码 题⽬链接:⾯试题 17.19. 消失的两个数字 题⽬描述: 给定⼀个数组,包含从 1 到 N 所有…...
Qt Widget类解析与代码注释
#include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this); }Widget::~Widget() {delete ui; }//解释这串代码,写上注释 当然可以!这段代码是 Qt …...
连锁超市冷库节能解决方案:如何实现超市降本增效
在连锁超市冷库运营中,高能耗、设备损耗快、人工管理低效等问题长期困扰企业。御控冷库节能解决方案通过智能控制化霜、按需化霜、实时监控、故障诊断、自动预警、远程控制开关六大核心技术,实现年省电费15%-60%,且不改动原有装备、安装快捷、…...
Cilium动手实验室: 精通之旅---20.Isovalent Enterprise for Cilium: Zero Trust Visibility
Cilium动手实验室: 精通之旅---20.Isovalent Enterprise for Cilium: Zero Trust Visibility 1. 实验室环境1.1 实验室环境1.2 小测试 2. The Endor System2.1 部署应用2.2 检查现有策略 3. Cilium 策略实体3.1 创建 allow-all 网络策略3.2 在 Hubble CLI 中验证网络策略源3.3 …...
