Как вывести строку из Rust в HTML элемент с помощью JS?

Question

[GR么ND]

Делаю приложение на Rust Tauri при первом запуске нужно чтобы выводились сообщение на подобии "Привет, {имя учетки пк юзера}" имя я могу получить но вывести это в HTML элемент не могу, облазил всю документацию и стек оферфлоу вдоль и поперек ничего не нашел, можете дать код и объяснить его.

P.S: я чайник в rust и особенно в Tauri. Я пробовал много способов и ошибок не было но и результата таже не было

Comments

[Василий Банников]

Показывай свой код, в котором не получается

Answer 1

[Загир Меджидов]

Для того чтобы вывести строку из Rust в HTML элемент с помощью JS, можно использовать JavaScript API, предоставляемый Tauri. Вот пример кода:

Rust:

#[tauri::command]
fn get_username() -> String {
    let username = whoami::username();
    format!("Привет, {}!", username)
}

JavaScript:

async function getUsername() {
  const response = await window.tauri.promisified({
    cmd: 'get_username'
  });
  const username = response.result;
  const element = document.getElementById('greeting');
  element.innerHTML = username;
}

В этом примере мы создаем функцию getUsername, которая вызывает Rust функцию get_username с помощью Tauri API и получает строку с приветствием. Затем мы находим элемент HTML с идентификатором greeting и устанавливаем его содержимое равным полученной строке.

Для того чтобы вызвать функцию getUsername, можно использовать обработчик события DOMContentLoaded:

document.addEventListener('DOMContentLoaded', getUsername);

Этот код вызовет функцию getUsername при загрузке страницы.

Обратите внимание, что для использования Tauri API необходимо добавить соответствующие зависимости в Cargo.toml и настроить конфигурацию проекта. Более подробную информацию можно найти в документации Tauri.

Comments

[Василий Банников]

ChatGPT?

[Загир Меджидов]

Василий Банников, Нет)

[Василий Банников]

Загир Меджидов, сам такую манеру ответов перенял? Или просто другая lm-ка?

[Загир Меджидов]

Василий Банников, пытаюсь быть грамотнвм

[Загир Меджидов]

Загир Меджидов, и сразу ошибка

[GR么ND]

Василий Банников, про ChatGPT поделюсь, как раз таки пишу прогу где будет неограниченое число запросов для ChatGPT там будут добровольные пожертвования на развитие проекта, сделаю что то такое же для Android, по поводу айос не скажу точно. Я практикуюсь с Rust и Tauri и хочу помочь школьникам и студентам, знаю что они там списывают, а вообще код на получения юзернейма учетки я взял с ChatGPT мой метод тут не подходил и я решил не париться.

P.S извеняюсь за долгий и длинный комент, само напрашивалось расскать :)

[GR么ND]

Загир Меджидов, Я сейчас подключу все зависимости и попробуй ваш код, у меня точь в точь такой же код на Rust знал что проблема в JS а не в нем т.к в компиляторе ошибок не было, спасибо сейчас проверю

[GR么ND]

Загир Меджидов, и кстасти можно было бы реализовать с помощью .onload мне так привычнее, не знаю кому как

[GR么ND]

Неа, все не очень хорошо такая ошибка:
expected `String`, found `()` может попробовать Result<String, String> попозже проверю

[GR么ND]

я исправил ошибку из-за которой возникал ошибка с типом но теперь нету опять ошибок и результата

[Загир Меджидов]

Mercury Effirium, ошибка expected `String`, found `()`, говорит, что он ожидал String, а получил array. Попробуйте использовать мой код и вывести в консоль переменную username. Код:

JavaScript

async function getUsername() {
  const response = await window.tauri.promisified({
    cmd: 'get_username'
  });
  const username = response.result;
  console.log(username); # Проверим содержимое username.
  const element = document.getElementById('greeting');
  element.innerHTML = username;
}

[GR么ND]

Загир Меджидов, вот такая ошибка

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'promisified')
    at getUsername (app.js:23:41)

я так понимаю проблема в API

Answer 2

[domanskiy]

Я новичок в Tauri, но разве не требуется зарегистрировать в Rust в tauri::Builder в invoke_handler функцию раста, что бы затем её из js дёргать?
Например через window.__TAURI__.invoke("имя_функции_раста")
или
await invoke("имя_функции_раста", {
/////
})