Как открыть новую вкладку браузера через клик по push-уведомлению, если сайт уже открыт?
всем привет
подскажите, пожалуйста, как открыть новую вкладку браузера через клик по push-уведомлению, если сайт уже открыт в браузере? Сейчас поведение такое, что браузер просто делает уже открытую вкладку активной
например, в пуш ссылка стоит site.com/home, а в браузере уже открыта вкладка с ссылкой site.com/about. в таком случае, браузер просто перекидывает на вкладку site.com/about при клике на пуш
как добиться такого поведения, чтобы даже если уже открыта в браузере вкладка с доменом, который указан в ссылке пуш, всё равно открылась новая вкладка при клике на пуш?
в обработчике firebase-messaging-sw.js код такой:
importScripts('https://www.gstatic.com/firebasejs/9.6.0/firebase-app-compat.js'); importScripts('https://www.gstatic.com/firebasejs/9.6.0/firebase-messaging-compat.js'); const firebaseConfig = { ... прописан конфиг ... }; firebase.initializeApp(firebaseConfig); const messaging = firebase.messaging(); messaging.onMessage(function(payload) { const notificationTitle = payload.notification.title; const notificationOptions = { body: payload.notification.body, icon: payload.notification.icon, data: { url: payload.notification.click_action } // добавляем ссылку в data }; self.registration.showNotification(notificationTitle, notificationOptions); }); self.addEventListener('notificationclick', function(event) { event.notification.close(); // закрываем уведомление const url = event.notification.data.url; // получаем ссылку из data // Переход по ссылке if (url) { clients.openWindow(url); } }, false); |
importScripts('https://www.gstatic.com/firebasejs/9.6.0/firebase-app-compat.js'); importScripts('https://www.gstatic.com/firebasejs/9.6.0/firebase-messaging-compat.js'); const firebaseConfig = { ... прописан конфиг ... }; firebase.initializeApp(firebaseConfig); const messaging = firebase.messaging(); messaging.onMessage(function(payload) { const notificationTitle = payload.notification.title; const notificationOptions = { body: payload.notification.body, icon: payload.notification.icon, data: { url: payload.notification.click_action } // добавляем ссылку в data }; self.registration.showNotification(notificationTitle, notificationOptions); }); self.addEventListener('notificationclick', function(event) { event.notification.close(); // закрываем уведомление const url = event.notification.data.url; // получаем ссылку из data // Переход по ссылке if (url) { clients.openWindow(url); } }, false);
спасибо заранее
Дополнительно:
Ответы:
Проблема заключается в том, что clients.openWindow(url); не открывает новую вкладку, если вкладка с таким URL уже открыта. Вместо этого он просто переходит на существующую вкладку с этим URL.
Для открытия новой вкладки даже в случае, если сайт уже открыт в браузере, вам нужно использовать window.open(url, '_blank');. Вот как это можно сделать в вашем коде:
self.addEventListener('notificationclick', function(event) { event.notification.close() const url = event.notification.data.url if (url) { window.open(url, '_blank'); } }, false); |
self.addEventListener('notificationclick', function(event) { event.notification.close() const url = event.notification.data.url if (url) { window.open(url, '_blank'); } }, false);
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для того чтобы открыть новую вкладку браузера через клик по push-уведомлению, если сайт уже открыт, можно воспользоваться следующим подходом:
1. Необходимо добавить обработчик события клика по push-уведомлению, который будет открывать новую вкладку браузера. Для этого можно воспользоваться JavaScript.
2. Для начала, у вас должен быть сервис-воркер, который будет обрабатывать push-уведомления. В коде сервис-воркера вы можете добавить обработчик события "notificationclick", который будет вызываться при клике по уведомлению.
3. В этом обработчике вы можете использовать метод clients.openWindow(url), где url - ссылка на страницу, которую вы хотите открыть в новой вкладке.
Пример кода для обработчика события "notificationclick":
self.addEventListener('notificationclick', function(event) { event.notification.close(); // Закрываем уведомление // Открываем новую вкладку event.waitUntil( clients.openWindow('https://www.example.com/new-page') ); });
4. После того как вы добавите этот код в свой сервис-воркер, при клике по push-уведомлению, новая вкладка с указанной ссылкой будет открыта в браузере.
Этот подход позволит пользователям вашего сайта быстро переходить на нужные страницы, даже если сайт уже открыт в одной из вкладок браузера.