Notificaciones

GitHub npm crates.io

API Reference

Envía notificaciones nativas al usuario utilizando el plugin de notificaciones.

Plataformas soportadas

This plugin requires a Rust version of at least 1.77.2

Platform	Level	Notes
windows		Only works for installed apps. Shows powershell name & icon in development.
linux
macos
android
ios

Configuración

Instala el plugin de notificaciones para comenzar.

Automatic

Utiliza el gestor de paquetes de tu proyecto para añadir la dependencia:

npm

npm run tauri add notification

yarn

yarn run tauri add notification

pnpm

pnpm tauri add notification

deno

deno task tauri add notification

bun

bun tauri add notification

cargo

cargo tauri add notification

Manual

1. Ejecuta el siguiente comando en el directorio src-tauri para añadir el plugin a las dependencias del proyecto en Cargo.toml:

   cargo add tauri-plugin-notification

2. Modifica lib.rs para inicializar el plugin:

   src-tauri/src/lib.rs

   #[cfg_attr(mobile, tauri::mobile_entry_point)]
   pub fn run() {
       tauri::Builder::default()
           .plugin(tauri_plugin_notification::init())
           .run(tauri::generate_context!())
           .expect("error while running tauri application");
   }

3. Si deseas utilizar notificaciones desde JavaScript, instala también el paquete npm:

   npm

   npm install @tauri-apps/plugin-notification

   yarn

   yarn add @tauri-apps/plugin-notification

   pnpm

   pnpm add @tauri-apps/plugin-notification

   deno

   bun add npm:@tauri-apps/plugin-notification

   bun

   bun add @tauri-apps/plugin-notification

Uso

Aquí hay algunos ejemplos de cómo usar el plugin de notificaciones:

• Enviar notificaciones a los usuarios
• Añadir una acción a una notificación
• Añadir un adjunto a una notificación
• Enviar una notificación a un canal específico

El plugin de notificaciones está disponible tanto en JavaScript como en Rust.

Enviar notificación

Sigue estos pasos para enviar una notificación:

1. Comprueba si se ha concedido el permiso

2. Solicita permiso si no se ha concedido

3. Envía la notificación

JavaScript

import {
  isPermissionGranted,
  requestPermission,
  sendNotification,
} from '@tauri-apps/plugin-notification';
// si se usa `"withGlobalTauri": true`, puedes hacer
// const { isPermissionGranted, requestPermission, sendNotification, } = window.__TAURI__.notification;

// Tienes permiso para enviar una notificación?
let permissionGranted = await isPermissionGranted();

// Si no es así, necesitamos solicitarlo
if (!permissionGranted) {
  const permission = await requestPermission();
  permissionGranted = permission === 'granted';
}

// Una vez que se concede el permiso, envía la notificación
if (permissionGranted) {
  sendNotification({ title: 'Tauri', body: 'Tauri is awesome!' });
}

Rust

tauri::Builder::default()
    .plugin(tauri_plugin_notification::init())
    .setup(|app| {
        use tauri_plugin_notification::NotificationExt;
        app.notification()
            .builder()
            .title("Tauri")
            .body("Tauri es genial")
            .show()
            .unwrap();

        Ok(())
    })
    .run(tauri::generate_context!())
    .expect("error mientras se ejecutaba la aplicación tauri");

Actions

Mobile Only

La API de Actions solo está disponible en plataformas móviles.

Las acciones añaden botones e inputs interactivos a las notificaciones. Úsalas para crear una experiencia interactiva para tus usuarios.

Registrar tipos de acciones

Registra tipos de acciones para definir elementos interactivos:

import { registerActionTypes } from '@tauri-apps/plugin-notification';

await registerActionTypes([
  {
    id: 'messages',
    actions: [
      {
        id: 'reply',
        title: 'Responder',
        input: true,
        inputButtonTitle: 'Enviar',
        inputPlaceholder: 'Escribe tu respuesta...',
      },
      {
        id: 'mark-read',
        title: 'Marcar como leído',
        foreground: false,
      },
    ],
  },
]);

Propiedades de las acciones

Propiedad	Descripción
id	Identificador único de la acción
title	Texto a mostrar en la acción del botón
requiresAuthentication	Requiere autenticación en el dispositivo
foreground	Pone la aplicación en primer plano cuando es accionada
destructive	Muestra la acción en rojo en iOS
input	Habilita el campo de texto
inputButtonTitle	Texto para el botón para enviar el input
inputPlaceholder	Texto de ejemplo en el campo de texto

Suscribirse a acciones

Suscribirse a notificaciones con acciones:

import { onAction } from '@tauri-apps/plugin-notification';

await onAction((notification) => {
  console.log('Acción realizada:', notification);
});

Adjuntos

Los adjuntos añaden contenido multimedia a las notificaciones. El soporte varía según la plataforma.

import { sendNotification } from '@tauri-apps/plugin-notification';

sendNotification({
  title: 'Nueva imagen',
  body: 'Mira esta imagen',
  attachments: [
    {
      id: 'image-1',
      url: 'asset:///notification-image.jpg',
    },
  ],
});

Propiedades de los adjuntos

Propiedad	Descripción
id	Identificador único
url	URL del contenido usando los protocolos asset:// o file://

Nota: Prueba los adjuntos en tus plataformas que quieras soportar para asegurarte de su compatibilidad.

Canales

Los canales organizan las notificaciones en categorías con diferentes comportamientos. Aunque se usan principalmente en Android, proporcionan una API consistente en todas las plataformas.

Crear un canal

import {
  createChannel,
  Importance,
  Visibility,
} from '@tauri-apps/plugin-notification';

await createChannel({
  id: 'messages',
  name: 'Mensajes',
  description: 'Notificaciones para nuevos mensajes',
  importance: Importance.High,
  visibility: Visibility.Private,
  lights: true,
  lightColor: '#ff0000',
  vibration: true,
  sound: 'notification_sound',
});

Propiedades de los canales

Propiedad	Descripción
id	Identificador único
name	Nombre a mostrar
description	Propósito del canal
importance	Nivel de prioridad (None, Min, Low, Default, High)
visibility	Nivel de privacidad (Secret, Private, Public)
lights	Habilitar indicador LED (Android)
lightColor	Color del indicador LED (Android)
vibration	Habilitar vibraciones
sound	Nombre del fichero para sonido personalizado

Gestionar canales

Listar canales existentes:

import { channels } from '@tauri-apps/plugin-notification';

const existingChannels = await channels();

Eliminar un canal:

import { removeChannel } from '@tauri-apps/plugin-notification';

await removeChannel('messages');

Usando canales

Enviar una notificación usando un canal:

import { sendNotification } from '@tauri-apps/plugin-notification';

sendNotification({
  title: 'Nuevo mensaje',
  body: 'Tienes un nuevo mensaje',
  channelId: 'messages',
});

Nota: Crea canales antes de enviar notificaciones que los referencien. Los identificadores de canal inválidos impiden que las notificaciones se muestren.

Consideraciones de seguridad

Aparte de los procedimientos normales de sanitización de la entrada del usuario, actualmente no hay consideraciones de seguridad conocidas.

Default Permission

This permission set configures which notification features are by default exposed.

Granted Permissions

It allows all notification related features.

• allow-is-permission-granted
• allow-request-permission
• allow-notify
• allow-register-action-types
• allow-register-listener
• allow-cancel
• allow-get-pending
• allow-remove-active
• allow-get-active
• allow-check-permissions
• allow-show
• allow-batch
• allow-list-channels
• allow-delete-channel
• allow-create-channel
• allow-permission-state

Permission Table

Identifier	Description
notification:allow-batch	Enables the batch command without any pre-configured scope.
notification:deny-batch	Denies the batch command without any pre-configured scope.
notification:allow-cancel	Enables the cancel command without any pre-configured scope.
notification:deny-cancel	Denies the cancel command without any pre-configured scope.
notification:allow-check-permissions	Enables the check_permissions command without any pre-configured scope.
notification:deny-check-permissions	Denies the check_permissions command without any pre-configured scope.
notification:allow-create-channel	Enables the create_channel command without any pre-configured scope.
notification:deny-create-channel	Denies the create_channel command without any pre-configured scope.
notification:allow-delete-channel	Enables the delete_channel command without any pre-configured scope.
notification:deny-delete-channel	Denies the delete_channel command without any pre-configured scope.
notification:allow-get-active	Enables the get_active command without any pre-configured scope.
notification:deny-get-active	Denies the get_active command without any pre-configured scope.
notification:allow-get-pending	Enables the get_pending command without any pre-configured scope.
notification:deny-get-pending	Denies the get_pending command without any pre-configured scope.
notification:allow-is-permission-granted	Enables the is_permission_granted command without any pre-configured scope.
notification:deny-is-permission-granted	Denies the is_permission_granted command without any pre-configured scope.
notification:allow-list-channels	Enables the list_channels command without any pre-configured scope.
notification:deny-list-channels	Denies the list_channels command without any pre-configured scope.
notification:allow-notify	Enables the notify command without any pre-configured scope.
notification:deny-notify	Denies the notify command without any pre-configured scope.
notification:allow-permission-state	Enables the permission_state command without any pre-configured scope.
notification:deny-permission-state	Denies the permission_state command without any pre-configured scope.
notification:allow-register-action-types	Enables the register_action_types command without any pre-configured scope.
notification:deny-register-action-types	Denies the register_action_types command without any pre-configured scope.
notification:allow-register-listener	Enables the register_listener command without any pre-configured scope.
notification:deny-register-listener	Denies the register_listener command without any pre-configured scope.
notification:allow-remove-active	Enables the remove_active command without any pre-configured scope.
notification:deny-remove-active	Denies the remove_active command without any pre-configured scope.
notification:allow-request-permission	Enables the request_permission command without any pre-configured scope.
notification:deny-request-permission	Denies the request_permission command without any pre-configured scope.
notification:allow-show	Enables the show command without any pre-configured scope.
notification:deny-show	Denies the show command without any pre-configured scope.