如何在Tauri Rust应用main.rs中捕获事件触发通知？解决两类方案问题

问题1：Rust中监听外部窗口click事件无响应 #

你在Rust代码里调用window.listen("click", ...)监听的是Tauri自定义事件，而非外部网页的DOM click事件。外部窗口的DOM事件无法直接被Rust层捕获，必须先在前端（preload或网页内）捕获后，通过IPC发送给Rust。

修复步骤：

1. 在preload.js中捕获DOM事件，通过window.__TAURI__.event.emit发送事件到Rust：

window.addEventListener('DOMContentLoaded', () => {
  // 捕获click事件
  document.addEventListener('click', () => {
    window.__TAURI__.event.emit('dom-click', { msg: '页面被点击了' });
  });

  // 捕获mouseEnter事件（示例）
  document.addEventListener('mouseenter', () => {
    window.__TAURI__.event.emit('dom-mouseenter', { msg: '鼠标进入页面' });
  });
});

2. 在Rust的窗口创建代码中，监听前端发送的自定义事件：

#[tauri::command]
async fn open_settings_window(app: tauri::AppHandle) -> Result<(), String> {
    let window = tauri::WindowBuilder::new(&app, "label", tauri::WindowUrl::External("https://tauri.app/".parse().unwrap()))
        .fullscreen(false)
        .resizable(true)
        .title("设置窗口")
        .center()
        .build()
        .map_err(|err| {
            eprintln!("创建窗口失败: {}", err);
            "创建窗口失败".into()
        })?;

    // 监听前端发送的dom-click事件
    window.listen("dom-click", move |event| {
        println!("收到点击事件: {:?}", event.payload());
        // 在这里触发你的通知函数
        show_notification(&app);
    });

    println!("窗口创建成功!");
    Ok(())
}

// 示例通知函数
fn show_notification(app: &tauri::AppHandle) {
    let _ = tauri::Notification::new(app.config().tauri.bundle.identifier.as_str())
        .title("通知标题")
        .body("页面被点击了")
        .show();
}

问题2：preload.js中调用Notification报错 #

你遇到的错误是因为外部域名未被授予IPC访问权限，同时Notification的调用方式也不正确。

修复步骤：

1. 在tauri.conf.json的security配置中，添加目标域名的IPC权限：

{
  "tauri": {
    "security": {
      "dangerousRemoteDomainIpcAccess": {
        "https://tauri.app": ["event", "notification"]
      }
    }
  }
}

注意：该配置仅用于开发测试，生产环境需谨慎配置，避免安全风险。

2. 修正preload.js中Notification的正确用法，并确保请求通知权限：

window.addEventListener('DOMContentLoaded', async () => {
  // 请求通知权限
  const permission = await Notification.requestPermission();
  if (permission !== 'granted') {
    console.warn("通知权限未授予");
    return;
  }

  // 定义通知函数
  window.showNotification = () => {
    new Notification("通知标题", {
      body: "这是一条测试通知"
    });
  };

  // 示例：点击页面时触发通知
  document.addEventListener('click', () => {
    window.showNotification();
  });
});

内容的提问来源于stack exchange，提问作者Ronikox