Esta guía te acompaña en la solución de problemas de tu configuración del Web SDK de OneSignal. Antes de continuar, revisa la Configuración SDK Web para asegurarte de haber completado todos los pasos.Las razones más comunes por las que el web push parece no funcionar están relacionadas con la configuración de notificaciones de tu navegador y dispositivo:
Los usuarios pueden ver solicitudes de permiso web pero no pueden suscribirse a notificaciones push en los modos de navegación de incógnito, privado o invitado.
Compatibilidad del navegador por sistema operativo
¹ iOS requiere la instalación de una aplicación web (consulte Configuración de push web en iOS)² Los navegadores basados en Chromium aparecen como “Chrome” en los análisis de OneSignal
La configuración de notificaciones del dispositivo es la causa más común por la que las notificaciones web push no aparecen. Revise los siguientes ajustes, incluidos los modos de concentración (No molestar, Batería baja, etc.), antes de buscar otras causas.
Seleccione el sistema operativo correcto en las pestañas de abajo. Debería ver Windows, macOS, Android e iOS.
Windows
macOS
Android
iOS
Configuración de notificaciones en Windows 10
Seleccione Inicio > Configuración > Notificaciones y acciones > Obtener notificaciones de aplicaciones y otros remitentes
Asegúrese de que su sitio y navegador también estén habilitados.
Configuración de notificaciones en Windows 10
Configuración de notificaciones en Windows 11:
Seleccione Inicio > Configuración > Sistema > Notificaciones
Configuración de notificaciones en Windows 11
Active Notificaciones
Desactive No molestar (durante las pruebas, las notificaciones push se mostrarán cuando esto esté desactivado)
Desplácese hacia abajo hasta Notificaciones de aplicaciones y otros remitentes
Windows 11 Notificaciones de aplicaciones y otros remitentes
Asegúrese de que sus navegadores estén Activados.
Lista de navegadores en la configuración de notificaciones de Windows 11
Navegue a Configuración del sistema > Notificaciones
Asegúrese de que las Notificaciones estén habilitadas en el Centro de notificaciones.
Es posible que deba seleccionar Permitir notificaciones al duplicar o compartir la pantalla.
Configuración del Centro de notificaciones de macOS
Desplácese hacia abajo hasta la lista de notificaciones de aplicaciones y asegúrese de que su navegador esté activado.
Algunos navegadores como Chrome y Edge muestran 2 entradas de aplicación diferentes.
Notificaciones push web estándar
Alertas internas, p. ej. Google Calendar
Asegúrese de que ambas estén habilitadas.
Lista de notificaciones de aplicaciones de macOS - El ejemplo muestra que Chrome y Edge tienen 2 entradas y ambas deben estar habilitadas.
Seleccione la aplicación y active la configuración. Seleccione cómo desea que se muestren las notificaciones.
Configuración de notificaciones de aplicaciones de macOS
Algunas versiones antiguas de Safari pueden mostrar el sitio web en su lista de notificaciones de aplicaciones. Asegúrese de comprobar que el sitio web esté activado en este caso.
Navegue a Configuración del sistema > Concentración y asegúrese de que no haya modos de concentración activos durante las pruebas.
Configuración del modo de concentración de macOS
Navegue a Configuración > Notificaciones > su navegador de elección.
Asegúrese de que “Mostrar notificaciones” y su sitio web estén marcados.
Configuración de notificaciones de Android
Android utiliza canales de notificación por aplicación. Si el canal de notificaciones de su navegador está configurado como silencioso o desactivado, las notificaciones push no aparecerán aunque el interruptor principal esté activado. En Configuración, toque la entrada del navegador y compruebe que cada canal de notificaciones esté habilitado y configurado con un estilo de alerta visible.
iOS requiere que agregue su sitio a la Pantalla de inicio antes de que los suscriptores puedan recibir notificaciones push en iPhones y iPads. Complete la configuración de push web para iOS antes de solucionar problemas.
Toque el botón Compartir del navegador y seleccione Agregar a la pantalla de inicio.
Abra su sitio desde la Pantalla de inicio y permita las notificaciones cuando aparezca el aviso de permiso.
Vaya a Configuración > Notificaciones > su sitio en el dispositivo y asegúrese de que Permitir notificaciones esté activado.
Las siguientes son razones comunes por las que la solicitud de notificación push web puede no mostrarse como se esperaba.
1
Confirme que se haya configurado una solicitud
Revise su configuración de Solicitud de permiso web para asegurarse de haber configurado una solicitud y comprender los diferentes comportamientos del navegador.Por ejemplo, algunos navegadores como Safari requieren una acción del usuario (hacer clic en un botón) antes de que pueda aparecer la solicitud nativa. Los detalles de cada navegador se pueden encontrar en nuestra sección Solicitud de permiso web > Solicitud de permiso nativa.
2
Verifique la compatibilidad del navegador, los modos de incógnito, navegador privado o navegador de invitado.
Los navegadores no permiten que los usuarios se suscriban a notificaciones en estos modos. Es por eso que la solicitud deslizante puede mostrarse pero la solicitud de permiso nativa no se mostrará.Asegúrese de estar utilizando un navegador y dispositivo que admita push web.
3
Verifique la configuración de notificaciones de su navegador
Navegue a la configuración de su navegador y verifique la configuración de permisos de “Notificaciones”. Ejemplo de Chrome: chrome://settings/content/notifications
Configuración de notificaciones de Chrome
En este ejemplo:
El usuario ha seleccionado “No permitir que los sitios envíen notificaciones”, lo que impedirá que se muestre la solicitud de permiso nativa. Esto debe mostrar “Los sitios pueden solicitar enviar notificaciones” para permitir que se muestre la solicitud de permiso nativa.
El usuario ha agregado https://yoursite.com a la lista “No se permite enviar notificaciones”, lo que impedirá que se muestre la solicitud de permiso nativa. Esto debe eliminarse de la lista para permitir que se muestre la solicitud de permiso nativa.
Documentación específica del navegador:
Chrome - Esta página explica cómo administrar las notificaciones en Chrome yendo a Configuración > Privacidad y seguridad > Configuración del sitio > Notificaciones, donde puede controlar el comportamiento predeterminado y administrar los permisos de sitios web individuales.
Firefox - Esta guía cubre las notificaciones push web de Firefox, explicando cómo administrar los permisos de notificación a través de Configuración > Privacidad y seguridad > Notificaciones, y cómo controlar los permisos de sitios específicos a través del icono de información del sitio en la barra de direcciones.
Safari - Esta guía de Apple explica cómo personalizar las notificaciones de Safari en Mac a través de Safari > Preferencias > Sitios web > Notificaciones, donde puede administrar qué sitios pueden enviar notificaciones y controlar el comportamiento de las notificaciones a través de Preferencias del Sistema.
Edge - Este artículo detalla cómo administrar las notificaciones de Edge navegando a Configuración > Privacidad, búsqueda y servicios > Permisos del sitio > Notificaciones, o haciendo clic en el icono de información del sitio en la barra de direcciones.
4
No se cumplen los requisitos de iOS/iPadOS.
Para iOS, existen algunos requisitos adicionales para solicitar a los usuarios su suscripción. Se puede ver más información en la guía Push web móvil para iOS/iPadOS.
Después de verificar lo anterior, sigue estos pasos para solucionar problemas de tu configuración del Web SDK de OneSignal.
1
Abrir la consola de herramientas de desarrollador del navegador
Las herramientas de desarrollador del navegador te permiten interactuar con el Web SDK de OneSignal y habilitar el registro para verificar errores.
Desktop
Android
iOS
Chrome: Haz clic derecho en la página, haz clic en Inspeccionar y haz clic en la pestaña Consola de la ventana emergente que se abre.
Firefox: Haz clic derecho en la página, haz clic en Inspeccionar elemento y haz clic en la pestaña Consola de la ventana emergente que se abre.
Safari: Ve a Safari → Preferencias → Avanzado y asegúrate de que Mostrar menú Desarrollar en la barra de menús esté marcado. Luego, en tu página web, haz clic derecho, haz clic en Inspeccionar elemento y haz clic en la pestaña Consola de la ventana emergente que se abre.
Consola de herramientas de desarrollador de escritorio
Chrome en Android: Habilita la depuración USB, conecta tu dispositivo a tu computadora y accede a las herramientas de desarrollador con chrome://inspect#devices en tu navegador Chrome de escritorio.
Firefox en Android: Habilita la depuración USB, conecta tu dispositivo a tu computadora y accede a las herramientas de desarrollador con about:debugging en tu navegador Firefox de escritorio.
Puedes encontrar los siguientes errores después de que OneSignal se inicialice:
Error: SDK already initialized
Error de inicialización duplicada del SDK
Lo que esto significa: El código init del Web SDK de OneSignal se está llamando más de una vez, a menudo causado por combinar la configuración del plugin de WordPress o la integración de Shopify con código manual, o por agregar accidentalmente el código init de OneSignal varias veces.Cómo solucionarlo: Elimina cualquier llamada init duplicada. Si usas el plugin de WordPress o la integración de Shopify, elimina cualquier código manual de OneSignal de tus archivos.
Error: Can only be used on: (URL establecida en el dashboard de OneSignal)
El ejemplo muestra que la URL establecida en el dashboard de OneSignal http://127.0.0.1:5501 no es el origen del sitio actual que estás visitando.
Lo que esto significa: El dominio que estás visitando actualmente no coincide con la URL del sitio configurada en tu dashboard de OneSignal.Cómo solucionarlo: Copia la URL del sitio en tu navegador y pégala en la configuración de Settings > Push & In-app > Web > Site URL de tu dashboard de OneSignal. Asegúrate de que sea el origen del sitio usando el siguiente formato:
Los tres componentes deben coincidir entre la URL real de tu sitio y la configuración de tu dashboard.
Error: OneSignalSDK: The “My site is not fully HTTPS” option is no longer supported starting with version 16 (User Model) of the OneSignal SDK.
Ejemplo del error de sitio HTTP no compatible
Lo que esto significa: Tu dashboard de OneSignal está configurado para usar un sitio HTTP y probablemente actualizaste para usar HTTPS.Los usuarios que se suscribieron mientras usaban HTTP o la opción “My site is not fully HTTPS” en realidad están suscritos a un subdominio en el formato https://your-label.os.tc, no al origen real de tu sitio. El web push no es compatible con sitios HTTP ni con sitios web que no pueden alojar service workers.Cómo solucionarlo: Ambas opciones requieren que tus usuarios se vuelvan a suscribir porque están suscritos al subdominio os.tc, no a tu sitio.
Crea una nueva aplicación de OneSignal y establece el nuevo App ID en tu código de inicialización. Esto te permite seguir enviando push desde la aplicación antigua para notificar a los usuarios.Envía notificaciones informando a los usuarios que el sitio se ha actualizado y que deben volver a suscribirse. Ofrecer un descuento o incentivo ayuda. Establece la “Launch URL” en una página de destino con un prompt de resuscripción (campana, enlace personalizado o slide de categorías). Consulta Prompts de permiso para más detalles.
Mantén el mismo App ID usando la API de Actualizar una aplicación para actualizar chrome_web_origin y safari_site_origin a tu origen HTTPS.Debido a que los usuarios se suscribieron al subdominio os.tc, su navegador no tiene permisos de push para tu dominio real. Se les mostrará el prompt nuevamente y, si se vuelven a suscribir, tendrán dos suscripciones de web push en el mismo navegador — lo que causa notificaciones duplicadas.Para prevenir duplicados, elimina todos los suscriptores actuales de web push antes de actualizar. Envía primero algunas notificaciones informando a los usuarios que deben volver a suscribirse. Consulta Prompts de permiso para opciones de prompts.
Si se te presenta el prompt de permiso nativo y haces clic en “Permitir”, puedes encontrar los siguientes errores de instalación del service worker:
Y: Registration of a Service Worker failed.
[Service Worker Installation] Installing service worker failed TypeError: Failed to register a ServiceWorker for scope (‘https://your-site.com/’) with script (‘https://your-site.com/...’): A bad HTTP response code (404) was received when fetching the script.
[Service Worker Installation] Installing service worker failed TypeError: Failed to register a ServiceWorker for scope (‘https://www.yoursite.com/’) with script (‘https://www.yoursite.com/...’): A bad HTTP response code (403) was received when fetching the script.
Ejemplo de un error de instalación del service worker
The script has an unsupported MIME type (‘current MIME type’).
[Service Worker Installation] Installing service worker failed SecurityError: Failed to register a ServiceWorker for scope (‘https://your-site.com/’) with script (‘https://your-site.com/…’): The script has an unsupported MIME type (‘current MIME type’).
Error de tipo MIME en el service worker
[Service Worker Installation] Installing service worker failed SecurityError: Failed to register a ServiceWorker for scope (‘https://your-site.com/’) with script (‘https://your-site.com/…’): The script resource is behind a redirect, which is disallowed.
Error de redirección en la consola
Lo que esto significa: Tu archivo de service worker está configurado incorrectamente.Cómo solucionarlo:
1
Encuentra la ruta de tu service worker
Sitio típico y Código personalizado: el SDK busca OneSignalSDKWorker.js en la raíz de tu sitio a menos que establezcas una ruta personalizada. Consulta Service worker de OneSignal.WordPress: no subas un worker a la raíz del sitio ni establezcas una ruta personalizada. El plugin aloja el archivo en sdk_files. Abre esa URL en el siguiente paso. Consulta Configuración WordPress.
2
Visita el archivo del service worker directamente en tu navegador
Abre la URL del archivo en tu navegador.
Sitio típico por defecto (raíz): https://yoursite.com/OneSignalSDKWorker.js
Plugin de WordPress (v3): https://yoursite.com/wp-content/plugins/onesignal-free-web-push-notifications/sdk_files/OneSignalSDKWorker.js (nombre de carpeta de WordPress.org; las instalaciones por zip pueden diferir)
Ruta personalizada (solo dashboard de Sitio típico o init de Código personalizado): https://yoursite.com/your-custom-location/OneSignalSDKWorker.js
Los nombres de archivo distinguen entre mayúsculas y minúsculas. Asegúrate de usar OneSignalSDKWorker.js o el nombre de archivo que configuraste.Algunos servidores convertirán automáticamente el nombre del archivo a minúsculas. Ten esto en cuenta si no puedes encontrar el archivo.
Este archivo debe servirse con un content-type de application/javascript.
No puede haber redirecciones a este archivo. Los archivos deben estar alojados en el mismo dominio que tu sitio (sin dominios CDN o proxy).
Sitio típico y Código personalizado: consulta Service worker de OneSignal para la configuración de subida y ruta. Los usuarios del plugin de WordPress no deben seguir esa guía. Consulta Configuración WordPress.
Has revisado la guía Notificaciones no mostradas: Web Push para conocer las razones comunes por las que las notificaciones pueden no estar apareciendo en tu dispositivo.
Si lo anterior es cierto, sigue estos pasos para verificar tu Subscription ID y enviarte una notificación push:
1
Obtener tu Subscription ID
Ejecuta el siguiente código en la consola de herramientas de desarrollador del navegador:
JavaScript
function getUserInfo() { console.log('getUserInfo()'); Promise.all([ OneSignal.Notifications.isPushSupported(), OneSignal.Notifications.permission, OneSignal.User.PushSubscription.optedIn, OneSignal.User.PushSubscription.id ]).then(([ isPushSupported, isSubscribed, isOptedIn, subscriptionId ]) => { console.log('The current URL of this page: ', location.href); console.log('Push is supported on this browser: ', isPushSupported); console.log('You are subscribed to notifications in the browser: ', isSubscribed); console.log('You are opted-in with OneSignal: ' , isOptedIn); console.log('Your OneSignal Subscription ID: ', subscriptionId); }).catch(e => { console.error('Error getting user info:', e); });}getUserInfo();
Esto te dirá:
La URL de la página en la que estás si hay alguna confusión.
Si el navegador actual soporta notificaciones push.
true significa que el navegador soporta notificaciones push.
false significa que el navegador no soporta notificaciones push.
Si estás suscrito a notificaciones en el navegador.
true significa que permitiste permisos push para esta URL.
false significa que no permitiste o denegaste permisos push para esta URL.
Si estás optado (opted-in) con OneSignal.
true significa que tu suscripción está suscrita a notificaciones push en OneSignal.
false significa que tu suscripción no está suscrita a notificaciones push en OneSignal. Verifica si el método optOut() se está llamando en tu sitio.
Tu Subscription ID de OneSignal.
Guarda esto para el siguiente paso. Este es el ID que usarás para enviarte una notificación push.
Ejemplo de la salida de información del usuario en la consola
Guarda estos datos de la consola en un archivo de texto y compártelos con el soporte de OneSignal si necesitas más ayuda.
2
Enviarte una notificación
Si estás suscrito a notificaciones, optado con OneSignal y tienes un Subscription ID, puedes enviarte una notificación.Sigue los pasos en Usuarios de prueba para configurarte como probador y enviarte una notificación.
3
Probar con Chrome
Si no estás recibiendo notificaciones en Chrome, usa estas herramientas de diagnóstico específicas de Chrome para identificar el problema.
En una nueva pestaña, abre chrome://gcm-internals.
Haz clic en el botón “Start Recording” en la parte superior izquierda. Asegúrate de ver “Connection State: CONNECTED”.
Deja esto abierto y envíate otra notificación push a tu suscripción de web push de Chrome.
Deberías ver algo en el “Receive Message Log” si lo recibiste.
Registro de internos de GCM
Si no ves un “Data msg received”, entonces tu navegador Chrome no está recibiendo la notificación en absoluto. Contacta al soporte de OneSignal con los registros de GCM internals.
Si ves “Data msg received” pero aún no recibiste una notificación, continúa con el siguiente paso.
Abre una nueva pestaña en chrome://serviceworker-internals
Busca Scope: https://your-site.com (reemplaza your-site.com con el dominio real de tu sitio).
Haz clic en Inspect, o Start -> Inspect. Aparecerá una ventana emergente de Chrome Developer Tools.
Inspeccionando el service worker
En la ventana emergente de Chrome Developer Tools de nuestro service worker, haz clic en la pestaña Console y ejecuta OneSignalWorker.log.trace();. Debería devolver undefined. Cualquier mensaje de nuestro service worker debería aparecer ahora en esta ventana emergente.
¿Necesita ayuda?Chatee con nuestro equipo de Soporte o envíe un correo electrónico a support@onesignal.comPor favor incluya:
Detalles del problema que está experimentando y pasos para reproducir si están disponibles
Su ID de aplicación de OneSignal
El ID externo o ID de suscripción si corresponde
La URL del mensaje que probó en el panel de OneSignal si corresponde
El código init del Web SDK de OneSignal se está llamando más de una vez en la página. Esto sucede comúnmente al combinar el plugin de WordPress con código manual, o cuando la etiqueta de inicialización se incluye en múltiples plantillas de página. Elimina las llamadas init duplicadas para resolverlo.
No. Web push requiere HTTPS porque los service workers — que gestionan la entrega de push — solo funcionan en orígenes seguros. Si anteriormente usaste la opción “My site is not fully HTTPS”, debes migrar a HTTPS. Consulta Errores de configuración para los pasos de migración.
Puedes probar en localhost durante el desarrollo. Consulta Configuración de localhost para las instrucciones de configuración. Ten en cuenta que las pruebas en localhost solo funcionan en navegadores basados en Chromium.
