Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[bug] HTML encoding issue for data-url #8760

Open
huangmingg opened this issue Feb 4, 2024 · 1 comment · May be fixed by #8762
Open

[bug] HTML encoding issue for data-url #8760

huangmingg opened this issue Feb 4, 2024 · 1 comment · May be fixed by #8762
Labels
status: needs triage This issue needs to triage, applied to new issues type: bug

Comments

@huangmingg
Copy link

huangmingg commented Feb 4, 2024 •
edited
Loading

Describe the bug

Html content containing special characters are not properly encoded when creating a new webview window using data url.

Reproduction

let html = r#"
    <html>
      <body>
       special character incoming ###
       thai characters incoming สระ
      </body>
    </html>
  "#;
  let data = format!("data:text/html,{}", html);
  let _docs_window = tauri::WindowBuilder::new(
    &handle,
    "myWindow",
    tauri::WindowUrl::External(data.parse().unwrap())
  )

  .build()
  .unwrap();

does not work, while reading from an external file

  let html = r#"
    <html>
      <body>
       special character incoming ###
       thai characters incoming สระ
      </body>
    </html>
  "#;
  std::fs::write(path.clone(), html).expect("Unable to write file");
  let data = format!("data:text/html,{}", html);
  let _docs_window = tauri::WindowBuilder::new(
    &handle,
    "myWindow",
    tauri::WindowUrl::App("external.html".parse().unwrap())
  )
  .build()
  .unwrap();

works

Expected behavior

No response

Full tauri info output

[✔] Environment
    - OS: Windows 10.0.19045 X64
    ✔ WebView2: 120.0.2210.144
    ✔ MSVC: Visual Studio Build Tools 2022
    ✔ rustc: 1.74.1 (a28077b28 2023-12-04)
    ✔ cargo: 1.74.1 (ecb9851af 2023-10-18)
    ✔ rustup: 1.26.0 (5af9b9484 2023-04-05)
    ✔ Rust toolchain: stable-x86_64-pc-windows-msvc (default)
    - node: 16.16.0
    - pnpm: 6.11.0
    - yarn: 1.22.15
    - npm: 8.11.0

[-] Packages
    - tauri [RUST]: 1.5.3
    - tauri-build [RUST]: 1.5.0
    - wry [RUST]: 0.24.6
    - tao [RUST]: 0.16.5
    - @tauri-apps/api [NPM]: 1.5.1 (outdated, latest: 1.5.3)
    - @tauri-apps/cli [NPM]: 1.5.6 (outdated, latest: 1.5.9)

[-] App
    - build-type: bundle
    - CSP: unset
    - distDir: Set automatically by Vue CLI plugin
    - devPath: Set automatically by Vue CLI plugin
    - framework: Vue.js (Nuxt)
    - bundler: Webpack

Stack trace

No response

Additional context

After some initial investigation, and help from @i-c-b on Discord, I have identified some problems

  1. data-url is not parsing html correctly at https://github.com/tauri-apps/tauri/blob/dev/core/tauri/src/manager/webview.rs#L441.
    let html = r#"
        <html>
        <body>
        special character incoming ###
        thai characters incoming สระ
        </body>
        </html>
    "#;
    let data = format!("data:text/html,{}", html);
    let result = data_url::DataUrl::process(&data).unwrap();
    let (body, _) = result.decode_to_vec().unwrap();
    let res = String::from_utf8(body).unwrap();

Will produce
<html> <body> special character incoming

As a temporary workaround, we can percent encode the HTML on tauri level, before running the process function - that seems to work

    let html = r#"
        <html>
        <body>
        special character incoming ###
        thai characters incoming สระ
        </body>
        </html>
    "#;
    let html = urlencoding::encode(&html);
    let data = format!("data:text/html,{}", html);
    let result = data_url::DataUrl::process(&data).unwrap();
    let (body, _) = result.decode_to_vec().unwrap();
    let res = String::from_utf8(body).unwrap();

Will produce back the same html
<html> <body> special character incoming ### thai characters incoming สระ </body> </html>

  1. url.to_string() / to_path() converts the html into percent encoded ASCII string, which in turn is passed to the unified webview of WRY, that does encoding again on webview layer depending on the OS. As a result, the html is encoded twice on OS like windows,
    https://github.com/tauri-apps/wry/blob/dev/src/webview2/mod.rs#L842

  2. On the tauri-runtime-wry layer, its using .with_url(&url) even for data url with html content. There is another method .with_html(&html) in wry we can make use of, for data url containing html content.
@huangmingg huangmingg added status: needs triage This issue needs to triage, applied to new issues type: bug labels Feb 4, 2024
@huangmingg
Copy link
Author

Screenshot for ref

image

This was referenced Feb 4, 2024
Open
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
status: needs triage This issue needs to triage, applied to new issues type: bug
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(windows): fix data url html encoding issue huangmingg/tauri
1 participant
@huangmingg