#HTTP Cors issue

10 messages · Page 1 of 1 (latest)

fervent juniper
#

Hi, I'm migrating from electron to Tauri, everything went smoothly, until i ended up in a CORS issue

[✔] Environment
    - OS: Mac OS 15.3.1 arm64 (X64)
    ✔ Xcode Command Line Tools: installed
    ✔ rustc: 1.85.0 (4d91de4e4 2025-02-17) (Homebrew)
    ✔ cargo: 1.85.0
    ✔ rustup: 1.28.0 (6e19fbec7 2025-03-02)
    ✔ Rust toolchain: stable-aarch64-apple-darwin
    - node: 20.10.0
    - yarn: 1.22.19
    - npm: 10.2.3
    - bun: 1.0.0

[-] Packages
    - tauri 🦀: 2.3.1
    - tauri-build 🦀: 2.0.6
    - wry 🦀: 0.50.5
    - tao 🦀: 0.32.8
    - @tauri-apps/api : 2.4.0
    - @tauri-apps/cli : 2.0.0-rc.18 (outdated, latest: 2.4.0)

[-] Plugins
    - tauri-plugin-log 🦀: 2.3.1
    - @tauri-apps/plugin-log : not installed!
    - tauri-plugin-fs 🦀: 2.2.0
    - @tauri-apps/plugin-fs : not installed!
    - tauri-plugin-http 🦀: 2.4.2
    - @tauri-apps/plugin-http : 2.4.2

[-] App
    - build-type: bundle
    - CSP: unset
    - frontendDist: ../dist
    - devUrl: http://localhost:1420/
    - framework: React
    - bundler: Vite

my api server is receiving the requests, but unable to receieve any response in tauri.

these are console logs that i get

[Error] Origin http://localhost:1420 is not allowed by Access-Control-Allow-Origin. Status code: 200
[Error] Fetch API cannot load http://localhost:4688/api/v1/contexts due to access control checks.
[Error] Failed to load resource: Origin http://localhost:1420 is not allowed by Access-Control-Allow-Origin. Status code: 200 (contexts, line 0)

my tauri.conf.json is:
# 
  "app": {
    "windows": [
      {
        "title": "kube",
        "width": 1400,
        "height": 800,
        "resizable": true,
        "fullscreen": false,
        "hiddenTitle": true
      }
    ],
    "security": {
      "csp": null
    }
  },
# 
{
  "$schema": "../gen/schemas/desktop-schema.json",
  "identifier": "default",
  "description": "enables the default permissions",
  "windows": [
    "main"
  ],
  "permissions": [
    "core:default",
    "http:default",
    "cors-fetch:default",
    "cors-fetch:allow-cors-request",
    {
      "identifier": "http:default",
      "allow": [
        {
          "url": "http://localhost:1420/*"
        },
        {
          "url": "http://localhost:4622/*"
        },
        {
          "url": "http://localhost:6511/*"
        }
      ]
    },
    {
      "identifier": "http:allow-fetch",
      "allow": [
        {
          "url": "http://localhost:1420/*"
        },
        {
          "url": "http://localhost:4622/*"
        },
        {
          "url": "http://localhost:651/*"
        }
      ]
    }
  ]
}
fervent juniper
#

For more context about the problem, i'm not using

import { fetch } from '@tauri-apps/plugin-http';

if i use this i get this as message

"http.fetch not allowed on window \"main\", webview \"main\", URL: local\n\nallowed on: [URL: local]\n\nreferenced by: capability: http:default, permission: allow-fetch"
#

i'm using normal fetch

fervent juniper
#

when i use the plugin it changes the url

curl 'ipc://localhost/plugin%3Ahttp%7Cfetch' \
-X 'POST' \
-H 'Content-Type: application/json' \
-H 'Origin: http://localhost:1420' \
-H 'Referer: http://localhost:1420/' \
-H 'Accept: */*' \
-H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko)' \
-H 'Tauri-Callback: 1471031857' \
-H 'Tauri-Error: 3392520592' \
-H 'Tauri-Invoke-Key: Unl2BMA+=!4jlv6W:bsf' \
--data-raw '{"clientConfig":{"method":"GET","url":"http://localhost:4622/api/contexts","headers":[],"data":null}}'

and the Request becomes the payload

fervent juniper
#

i think i resolved it

#

thanks anyways 😁
tauri.conf.json

  "app": {
    "withGlobalTauri": true,
    "windows": [
      {
        "title": "kube",
        "width": 1400,
        "height": 800,
        "resizable": true,
        "fullscreen": false,
        "hiddenTitle": true
      }
    ],
    "security": {
      "csp": "default-src 'self' http://localhost:4622 http://localhost:65001",
      "assetProtocol": {
        "scope": [
          "**"
        ],
        "enable": true
      },
      "capabilities": [
        {
          "identifier": "http:default",
          "description": "Allows making HTTP requests to specific domains",
          "windows": ["main"],
          "permissions": [
            {
              "identifier": "http:default",
              "allow": [
                "http://localhost:1420/*",
                "http://localhost:4622/*",
                "http://localhost:6511/*"
              ]
            }
          ]
        },
        {
          "identifier": "cors-fetch:default",
          "description": "Allows CORS fetch requests",
          "windows": ["main"],
          "permissions": [
            {
              "identifier": "cors-fetch:default",
              "allow": ["http://localhost:1420/*", "http://localhost:4622/*", "http://localhost:6511/*"]
            }
          ]
        }
      ]
    }
  },
tepid canopy
#

I believe it could work if you set the URL correctly, but not sure.