How to allow http to my web served on http://localhost:5173 with Tauri v2 in development mode?

[bryantamayo1]

I have a web that is served on http://localhost:5173 and tauri v2 en mode development, when I execute npx tauri dev I get this message (view image attached). At that moment, I only work with http.

This is my Cargo.toml:

[package]
name = "app"
version = "0.0.2"
description = "A Tauri App "
authors = ["you"]
license = ""
repository = ""
edition = "2021"
rust-version = "1.77.2"

# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html

[lib]
name = "app_lib"
crate-type = ["staticlib", "cdylib", "rlib"]

[build-dependencies]
tauri-build = { version = "2.1.1", features = [] }

[dependencies]
serde_json = "1.0"
serde = { version = "1.0", features = ["derive"] }
log = "0.4"
tauri = { version = "2.4.1", features = []  }
tauri-plugin-log = "2.0.0-rc"
reqwest = { version = "0.12.8", features = ["blocking", "rustls-tls", "cookies"] }
url = { version = "2"}

Is it compulsory to running the web on http://localhost:5173 with https?

[FabianLars]

https for localhost is not generally required (and tends to cause problems anyway).

do you see the same issue with a fresh create-tauri-app project? If so then i think it's an issue with the webview or your system 🤔

[bryantamayo1]

My web is built with webpack and it serves on http://localhost:3010/, with this configuration:

  // webpack.dev.js
  ...
  devServer: {
    server: 'http',
  ...

And desktop Tauri shows the same error on a white background: Error performing TLS handshake: An unexpected TLS packet was received

Besides, I changed by https://localhost:3010/, with this configuration:

  // webpack.dev.js
  ...
  devServer: {
    server: 'https',
  ...

And desktop Tauri shows other error on a white background: Unacceptable TLS certificate
On web browser works in both cases http://localhost:3010/ and https://localhost:3010/.

Have you ever happened any situation similar to this?

[FabianLars]

The tls certificate error kinda makes sense so i'd ignore that for now.

I've never seen the first error though and i also don't see why it would even try to do a TLS handshake for a http url. Do you maybe have some kind of system proxy set up that somehow interferes?

[bryantamayo1]

I have just tested with npm create tauri-app@latest and move my web to dist folder, development and prod mode it works.

Development mode setup:

# tauri.conf.json
{
  "$schema": "https://schema.tauri.app/config/2",
  "productName": "tauri-app",
  "version": "0.1.0",
  "identifier": "tauri-app-app",
  "build": {
    "frontendDist": "../dist"
  },
  "app": {
    "withGlobalTauri": true,
    "windows": [
      {
        "title": "tauri-app",
        "width": 800,
        "height": 600
      }
    ],
    "security": {
      "csp": null
    }
  },
  "bundle": {
    "active": true,
    "targets": "appimage",
    "icon": [
      "icons/32x32.png",
      "icons/128x128.png",
      "icons/[email protected]",
      "icons/icon.icns",
      "icons/icon.ico"
    ]
  }
}

Nginx is set up on my project, maybe it has some issue about those problems, I am going to check in other machine. Thanks for your help 👍
This issue can be closed.