Kako dodati obvestila v svojo aplikacijo: v aplikaciji, e-pošta in potisna obvestila

Da aplikaciji dodate obvestila, začnite z obvestili v aplikaciji: tabelo obvestil v bazi podatkov in ikono zvončka, ki prikazuje neprebrane elemente. Dodajte e-pošto za stvari, ki jih ljudje morajo vedeti, ko jih ni v aplikaciji, z uporabo ponudnika e-pošte, spletna potisna obvestila pa dodajte samo tedaj, ko so takojšnja opozorila res pomembna, saj zahtevajo servisnega delavca, dovoljenje uporabnika in pri iPhonu shranjeno aplikacijo na začetnem zaslonu. Ne glede na uporabljene kanale ustvarjajte vsako obvestilo na enem mestu na strežniku in uporabnikom pustite, da izberejo, kaj želijo prejemati.

Ta vodnik primerja kanale, prikazuje preprosto arhitekturo in ponuja pozive, ki jih lahko uporabite z graditelji aplikacij na UI.

Glavni kanali v primerjavi

Večina aplikacij potrebuje obvestila v aplikaciji in e-pošto. Potisna obvestila in SMS sta vredna truda, kadar je čas res pomemben, na primer opomnik za rezervacijo ali naročilo, ki je pripravljeno.

Kako se sistem obvestil sestavi

Ohranite ga preprostega in centralnega:

1. Nekaj se zgodi. Objavljen je komentar, plačilo ne uspe, termin je jutri.
2. Vaš strežnik pokliče eno funkcijo, na primer notify(user, type, data).
3. Ta funkcija preveri uporabnikove nastavitve in zapiše vrstico v tabelo notifications (za zvonček).
4. Nato pošlje na druge kanale, ki jih je uporabnik vklopil za to vrsto: e-pošto prek vašega ponudnika, potisna obvestila prek Push API-ja.
5. Frontend prikaže neprebrana obvestila in jih označi kot prebrana, ko jih uporabnik odpre.

Zaradi ene vstopne točke lahko dodate kanal, spremenite besedilo ali upoštevate nastavitve, ne da bi iskali po celotni kodi.

Kaj shraniti

Tabela obvestil običajno potrebuje: ID uporabnika, vrsto (na primer comment_reply), kratek naslov in besedilo, povezavo do ustrezne strani, čas ustvarjanja in čas branja. Ločena tabela nastavitev hrani, kateri kanali za vsako vrsto obvestila so uporabniku všeč.

Prikaz novih obvestil

• Nalaganje ob ogledu strani in poizvedovanje vsakih 30–60 sekund. Preprosto in zanesljivo.
• Posodobitve v realnem času z WebSockets ali strežniškimi dogodki delujejo takoj, vendar dodajo premikajoče se dele. Začnite s poizvedovanjem, razen če je takojšnja posodobitev res pomembna.

E-poštna obvestila

E-pošta potrebuje ponudnika za pošiljanje in preverjeno domeno; podrobnosti so v kako pošiljati e-pošto iz aplikacije. Za obvestila posebej:

• Pošiljajte s strežnika, nikoli s ključem ponudnika v brskalniku.
• Združujte pogoste dogodke. „3 novi komentarji“ v eni e-pošti je boljše kot trije e-poštni dopisi.
• Ponudite dnevni ali tedenski povzetek za dejavnost z nizko prioriteto.
• Vključite povezavo za odjavo ali nastavitve v nebistveno e-pošto. Pravila za tržna e-poštna sporočila se po državah razlikujejo; preverite, kaj velja za vas.

Spletna potisna obvestila

Spletna potisna obvestila omogočajo, da vaša stran pošilja opozorila, ki se prikažejo kot obvestila aplikacije. Po dokumentaciji Push API-ja na MDN deluje takole:

1. Vaša stran registrira servisnega delavca, skript, ki ga brskalnik lahko izvaja v ozadju.
2. Ko uporabnik privoli, servisni delavec naroči prek PushManager.subscribe(). Brskalnik vrne naročnino z naslovom (endpoint) in šifrirnimi ključi.
3. Vaš strežnik shrani to naročnino in ko se nekaj zgodi, pošlje sporočilo na naslov, običajno podpisano s ključi VAPID (par ključev, ki identificira vaš strežnik).
4. Brskalnik zažene vašega servisnega delavca, ki prikaže obvestilo, tudi če vaša stran ni odprta.

MDN tudi opozarja, da naj bo naslov skrivnost, saj je za pošiljanje sporočil temu uporabniku dovolj že poznavanje naslova.

iPhone in iPad

WebKit je v iOS in iPadOS 16.4 dodal potisna obvestila za spletne aplikacije, z dvema pogojema iz njegove napovedi: stran mora biti dodana na začetni zaslon, dovoljenje pa je treba zahtevati kot odziv na dejanje uporabnika, na primer dotik gumba Naroči se. Torej na iPhonu potisna obvestila dosežejo samo uporabnike, ki so namestili vašo spletno aplikacijo. Za to, kaj pomeni namestitev spletne aplikacije, glejte nativne aplikacije proti progresivnim spletnim aplikacijam.

Dobro zahtevati dovoljenje

Ne sprašujte ob prvem obisku. Najprej razložite korist („Prejmite opomnik uro pred vašim predavanjem“), nato pa pokažite pozivnik brskalnika, ko uporabnik klikne gumb. Če nekdo zavrne, vam lahko brskalnik ne dovoli spraševati ponovno, zato lahko preuranjen poziv uporabnika izgubi za vedno.

Načrtovana obvestila potrebujejo sprožilec

„Opomnik 24 ur prej“ ali „tedenski povzetek vsak ponedeljek“ potrebujeta nekaj, kar teče po urniku. To je težava z ozadjskimi opravili, ki jo obravnava kako zagnati ozadjska opravila. Pogost vzorec: zunanji načrtovalec vsakih nekaj minut pokliče zaščitenu končno točko, ta pa pošlje vse, kar je na vrsti.

Pozivi za vašega graditelja z UI

Začnite z obvestili v aplikaciji:

Dodaj obvestila v aplikaciji. Ustvari tabelo notifications (user, type, title, body, link, created_at, read_at). Dodaj strežniško funkcijo notify(userId, type, data), ki jo kliče vsaka funkcija. V glavi prikaži ikono zvončka z številom neprebranih, spustni seznam zadnjih 20 in gumb „označi vse kot prebrano“. Vsakih 60 sekund preverjaj nova.

Nato nastavitve in e-pošta:

Dodaj nastavitve obvestil: za vsako vrsto (odgovori na komentarje, omembe, zaračunavanje) naj uporabnik izbere v aplikaciji, e-pošto, oboje ali nič. notify() mora to upoštevati. Pošiljaj e-pošto prek [PONUDNIK] s skrivnostjo [IME_SPREMENLJIVKE] samo na strežniku. Združi e-poštna obvestila o komentarjih, da en uporabnik prejme največ eno e-pošto na 15 minut.

Nato potisna obvestila, če jih potrebujete:

Dodaj izbirna potisna obvestila. Registriraj servisnega delavca, ustvari ključe VAPID in zasebni ključ shrani kot skrivnost. V nastavitvah dodaj gumb „Omogoči obvestila“, ki zahteva dovoljenje šele, ko je kliknjen. Shrani vsako naročnino za uporabnika in napravo, pošiljaj potisna obvestila iz notify(), ko je uporabnik privolil, in izbriši naročnine, ki jih potisna storitev javi kot potekle.

Pogoste napake

• Obvestila raztresena po kodi. Vsaka funkcija pošilja svojo e-pošto na svoj način, nastavitve pa se ignorirajo. Uporabite eno funkcijo notify().
• Zahtevanje dovoljenja za potisna obvestila ob nalaganju strani. Večina ljudi zavrne, druge priložnosti pa morda ne dobite.
• Brez nastavitev. Uporabniki, ki ne morejo izklopiti moteče opozorila, izklopijo vsa ali odidejo.
• Pošiljanje iz brskalnika. Ključi za e-pošto in potisna obvestila sodijo na strežnik.
• Nečiščenje mrtvih potisnih naročnin. Potekle naročnine se kopičijo in zapravljajo pošiljanja.
• Občutljive podrobnosti v besedilu obvestila. Zaklenjeni zasloni jih prikažejo. „Imate novo sporočilo“ je varnejše kot samo sporočilo.
• Brez zapisa, kaj je bilo poslano. Ko uporabnik reče „nisem dobil e-pošte“, vam dnevniki z ID-ji sporočil ponudnika pomagajo ugotoviti, zakaj.

Kontrolni seznam

• Ena strežniška funkcija notify(), uporabljena povsod
• Tabela obvestil s stanjem branja in zvonček s številom neprebranih
• Nastavitve kanalov za vsako vrsto, ki jih upošteva notify()
• E-pošta poslana s strežnika s preverjeno domeno; povzetek ali združevanje za pogoste dogodke
• Dovoljenje za potisna obvestila zahtevano šele po dejanju uporabnika, s pojasnilom
• Potisna obvestila preizkušena na namizju in na iPhonu z aplikacijo na začetnem zaslonu
• Potekle potisne naročnine odstranjene
• Brez občutljive vsebine v predogledih potisnih obvestil ali e-pošte
• Načrtovani opomniki imajo zanesljiv sprožilec

Obvestila na Mythexu

Mythex za aplikacije, ki jih gradite, ne vključuje vgrajene storitve za e-pošto ali potisna obvestila, zato prinesete lastnega ponudnika e-pošte in ustvarite lastne potisne ključe, shranjene kot skrivnosti projekta. Del z obvestili v aplikaciji potrebuje samo bazo podatkov projekta, ki jo Mythex doda, ko jo zahtevate. Gradite s pozivi, kot so zgoraj, zvonček in e-pošto preizkusite v predogledu, potisna obvestila pa na objavljenem naslovu URL, saj servisni delavci in potisna obvestila potrebujejo pravi naslov HTTPS. Recept v dokumentaciji pošiljanje e-pošte iz aplikacije vsebuje začetni poziv. Mythex načrtovanih opravil ne dokumentira, zato načrtujte časovne opomnike z zunanjim sprožilcem, kot je opisano v kako zagnati ozadjska opravila.

Vprašanja