11 stable releases
3.1.0 | Dec 22, 2024 |
---|---|
3.0.0 |
|
2.1.1 | Mar 25, 2024 |
1.3.1 | Mar 25, 2024 |
#419 in Web programming
256 downloads per month
41KB
381 lines
An unofficial Tauri plugin that enables seamless cross-origin resource sharing (CORS) for web fetch requests within Tauri applications.
Platform | Supported |
---|---|
Linux | ✓ |
Windows | ✓ |
macOS | ✓ |
Android | ✓ |
iOS | ✓ |
Overview
When building cross-platform desktop applications with Tauri, we often need to access services like OpenAI that are restricted by Cross-Origin Resource Sharing (CORS) policies in web environments.
However, on the desktop, we can bypass CORS and access these services directly. While the official tauri-plugin-http can bypass CORS, it requires modifying your network requests and might not be compatible with third-party dependencies that rely on the standard fetch
API.
How it Works
This plugin extends the official tauri-plugin-http by hooking into the browser's native fetch
method during webpage initialization. It transparently redirects requests to the tauri-plugin-http, allowing you to use the standard fetch
API without additional code changes or workarounds.
Installation
- Add the plugin to your Tauri project's dependencies:
# src-tauri
cargo add tauri-plugin-cors-fetch
- Initialize the plugin in your Tauri application setup:
// src-tauri/main.rs
fn main() {
tauri::Builder::default()
.plugin(tauri_plugin_cors_fetch::init())
.run(tauri::generate_context!())
.expect("failed to run app");
}
- Add permissions in your
capabilities
configuration:
// src-tauri/capabilities/default.json
{
"permissions": ["cors-fetch:default"]
}
- Enable
withGlobalTauri
in your Tauri configuration:
// src-tauri/tauri.conf.json
{
"app": {
"withGlobalTauri": true
}
}
Usage
After installing and initializing the plugin, you can start making fetch
requests from your Tauri application without encountering CORS-related errors.
// Enable CORS for the hooked fetch globally (default is true on app start)
window.enableCORSFetch(true);
// Use the hooked fetch with CORS support
fetch("https://example.com/api")
.then((response) => response.json())
.then((data) => console.log(data))
.catch((error) => console.error(error));
// Use the hooked fetch directly
window.fetchCORS("https://example.com/api");
// Use the original, unhooked fetch
window.fetchNative("https://example.com/api");
Limitation
- No Custom CSP Policy Support: By default, all HTTP/HTTPS requests will be redirected to local native requests.
- No XMLHttpRequest Support: The plugin is designed specifically to work with the modern
fetch
API and does not supportXMLHttpRequest
(XHR) requests.
License
This project is licensed under the MIT License.
Dependencies
~18–63MB
~1M SLoC