Black Friday Black Friday
Black Friday výprodej! Až 80 % extra bodů zdarma! Více informací zde

Diskuze: Notifikace - mobilní telefon

JavaScript JavaScript Notifikace - mobilní telefon American English version English version

Aktivity (1)
Avatar
katrincsak
Člen
Avatar
katrincsak:19. září 12:12

Zdravím,

mám velký problém rozeběhnout notifikace na mobilním zařízením. Udělal jsem mobilní webovou aplikaci, která si po určitém čase sahá na server pro data a vrací to nějaká upozornění atp. Potřebuji, aby když se člověk přihlásí a bude mít stránku otevřenou,aby chodili do pozadí upozornění. Podobné tomu jako když máte messenger a někdo Vám napíše zprávu. Také jsem vytvořil APP pro Android Web view, ale tam předpokládám že to fungovat asi ani nebude :/

Zkusil jsem: Zkoušel jsem jak klasické funkce pro notifikaci, tak i různá API a sice se mě telefon optal zda chci dostávat upozornění, ale již mi nic stejně nechodilo. Na víc tyhle upozornění jsou asi trochu jiná než chci, aby to dělalo.

Např. jsem zkoušel jako z mého pohledu kvalitní: https://pushjs.org/
Jako nejjednodušší test jsem udělal toto

<script src='/js/push.min.js'></script>
<script src='/js/serviceWorker.min.js'></script>
<script>
Push.create('Ahoj, to je test!');
</script>

Tohle by teoreticky mělo fungovat i na telefonu, ale to mi nefunguje nikde ..

function notifyMe(msg) {
Notification.requestPermission(function(result) {
  if (result === 'granted') {
    navigator.serviceWorker.ready.then(function(registration) {
      registration.showNotification(msg);
    });
  }
});
}

Tohle funguje na desktopu, ale ne na mobilu :/

function notifyMe(msg) {
  // Let's check if the browser supports notifications
  if (!("Notification" in window)) {
    alert("This browser does not support desktop notification");
  }

  // Let's check whether notification permissions have already been granted
  else if (Notification.permission === "granted") {
    // If it's okay let's create a notification
    var notification = new Notification(msg);
  }

  // Otherwise, we need to ask the user for permission
  else if (Notification.permission !== "denied") {
    Notification.requestPermission(function (permission) {
      // If the user accepts, let's create a notification
      if (permission === "granted") {
        var notification = new Notification(msg);
      }
    });
  }

  // At last, if the user has denied notifications, and you
  // want to be respectful there is no need to bother them any more.
}

Chci docílit: Aby vyskakovali notifikace podobně, nebo stejně jako když přijde zpráva do messengeru. Ideálně jak na Android, tak i IOS, ale zatím se spokojím pro Android.

Děkuji moc za rady a pomoc.

Editováno 19. září 12:14
 
Odpovědět 19. září 12:12
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:19. září 12:38

Co vypisuje js konzola za chyby? Otevres ji, das F5 refresh stranky a pockas, co to vypise.
FF - nastroje - vyvoj webu - webova konzola

ctrl+ shift + k

Do toho sveho kodu pridej aletry nebo nejake zobrazovani, abys vedel, jaka funkce se jeste spustila.

function notifyMe(msg) {
alert(1)
Notification.requestPermission(function(result) {
alert(2)
  if (result === 'granted') {
    navigator.serviceWorker.ready.then(function(registration) {
alert(3)
      registration.showNotification(msg);
    });
  }
});
}

notifyMe funguje jenom, kdyz ji spustis. Jak ji spoustis? Pres nejaky request zjistujes prichozi zpravy?

 
Nahoru Odpovědět 19. září 12:38
Avatar
katrincsak
Člen
Avatar
Odpovídá na Peter Mlich
katrincsak:19. září 12:48

Konzole nevypisuje za chyby nic :(

  1. Alert 1 se spustí po každé i na na mobilu.
  2. Alert 2 se ukáže až po potvrzení/souhlasu odběru (Pouze desktop) na mobilu i bez souhlasu (Možná na mobilu již souhlas mám)
  3. To je vše.. Alert 3 se nespustí ani na desktopu.
 
Nahoru Odpovědět 19. září 12:48
Avatar
katrincsak
Člen
Avatar
Odpovídá na Peter Mlich
katrincsak:19. září 12:51

Teď pro nejjednodušší testování při načtení stránky, ale jinak by to měla zavolat jiná funkce která se stará o ten celkový proces, který funguje. Šáhá si ajaxově opakovaně na server a když zjistí že je něco nového dojde k aktualizaci dat a v tento moment by měla vyběhnout notifikace. Samozřejmě ve spuštění nějaké akce není problém, problém je že potřebuji tuto funkcionalitu, nebo něco podobného co uživatele upozorní.

 
Nahoru Odpovědět 19. září 12:51
Avatar
Odpovídá na Peter Mlich
Vladislav Ladicky:19. září 13:16

Peter na toto výpis z konzoly nestačí.

 
Nahoru Odpovědět 19. září 13:16
Avatar
katrincsak
Člen
Avatar
Odpovídá na Peter Mlich
katrincsak:19. září 13:30

A result vrací "granted", problém je tedy v

navigator.serviceWorker.ready.then(function(registration) {
console.log(4)
      registration.showNotification(msg);
    });
 
Nahoru Odpovědět 19. září 13:30
Avatar
katrincsak
Člen
Avatar
Odpovídá na Peter Mlich
katrincsak:19. září 13:46

Peter moc ti děkuji i když si mě jen popostrčil, ale pomohl jsi. Tvé odpovědi mi podstrčili některé myšlenky, které jsem opomenul a nebyl si vůbec jistý zda je to správný směr. Nechal jsem se inspirovat i tím co jsem dříve našel a teď to složil.

Soubor sw.js neobsahuje vůbec nic, nerad bych psal nějakou kravinu kdybych to špatně pochopil, protože jsem to zas tak moc nestudoval. Každopádně, když to tam je tak to funguje (Mělo by si to sáhnout na server a ověřit protokol jen, ale nemusí to být úplně správné sdělení)

Nemám tam využití proměnné msg, místo toho jsem vložil ručně text a jen to při volání definoval (To jen pro vysvětlení)

function notifyMe(msg) {
        Notification.requestPermission(function(result) {
          if (result === 'granted') {
                  navigator.serviceWorker.register('/js/sw.js').then(function(registration) {
                          // Registration was successful
                          registration.showNotification("tohle je notifikace");
                        }, function(err) {
                          // registration failed :(
                          console.log('ServiceWorker registration failed: ', err);
                        });
          }
        });
}
 
Nahoru Odpovědět 19. září 13:46
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:19. září 14:04

Njn, takze uz ti to funguje?

Ja tyhle kaskady funkci moc nemusim. Neni to prehledne a zanasi to zmatek pri editaci.

function notifyMe(msg) {
        Notification.requestPermission(function(result) {
          if (result === 'granted') {
                  navigator.serviceWorker.register('/js/sw.js').then(function(registration) {
                          // Registration was successful
                          registration.showNotification("tohle je notifikace");
                        }, function(err) {
                          // registration failed :(
                          console.log('ServiceWorker registration failed: ', err);
                        });
          }
        });
}
--- takhle zapsane by to mohlo taky fungovat ---
var xxx = {};
xxx.cbRegisterSuccess = function (fn_registration)
        {
        fn_registration.showNotification("tohle je notifikace");
        }
xxx.cbRegisterError = function (err)
        {
        console.log('ServiceWorker registration failed: ', err);
        }
xxx.cbPermission = function (result)
        {
        if (result === 'granted')
                {
                navigator.serviceWorker
                  .register('/js/sw.js')
                  .then(xxx.cbRegisterSuccess, xxx.cbRegisterError);
                }
        }

function notifyMe(msg)
        {
        Notification.requestPermission(xxx.cbPermission);
        }

Tusim jsem resil RTC komunikaci a tam byl stejny problem. Funkce mela preddefinovane, ze musi dostat 2 (nebo 3, nevzpomenu si) parametry, kde ten posledni byl prave error funkce. Pokud se zadala jen success funkce, tak to nevypsalo ani error a ani to nefungovalo. Uzasne, fakt :) Proto je lepsi si zplacat ten kod sam a osetrit existenci pres typeof.

Editováno 19. září 14:07
Akceptované řešení
+20 Zkušeností
+1 bodů
Řešení problému
 
Nahoru Odpovědět  +1 19. září 14:04
Avatar
katrincsak
Člen
Avatar
Odpovídá na Peter Mlich
katrincsak:20. září 21:08

Ten můj kod již funguje a mám to již vložené do celé aplikace, takže super. Ale mně se rozhodně více líbí ten můj příklad :D Ale určitě děkuji.

 
Nahoru Odpovědět 20. září 21:08
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:21. září 7:49

Njn, ja ti ho neberu. Jen pouzivam radeji jiny zpusob, kde pak vim, kolik funkci je vlastne do sebe zanorenych a na co ktera reaguje..

 
Nahoru Odpovědět 21. září 7:49
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 10.