ವೆಬ್ ಪುಶ್ ನೋಟಿಫಿಕೇಶನ್‌ಗಳು ಆಂತರಿಕವಾಗಿ ಹೇಗೆ ಕೆಲಸ ಮಾಡುತ್ತವೆ

ನೀವು ಹೊಸ ಸಂದೇಶಗಳು, ಆರ್ಡರ್ ಅಪ್‌ಡೇಟ್‌ಗಳು ಅಥವಾ ಪಾವತಿ ನೆನಪಿಸುವಿಕೆಗಳಿಗಾಗಿ ನೋಟಿಫಿಕೇಶನ್‌ಗಳನ್ನು ನೋಡುತ್ತೀರಿ.

ಇದು ಸರಳವಾಗಿ ಕಾಣಿಸುತ್ತದೆ. ನಿಮ್ಮ backend ಒಂದು ಸಂದೇಶವನ್ನು ಕಳುಹಿಸುತ್ತದೆ ಮತ್ತು ಬಳಕೆದಾರ ಅದನ್ನು ಪಡೆಯುತ್ತಾರೆ.

ವಾಸ್ತವದಲ್ಲಿ, ಈ ಪ್ರಕ್ರಿಯೆಯು ಅನೇಕ ಚಾಲನಾ ಭಾಗಗಳನ್ನು ಒಳಗೊಂಡಿದೆ. ನಿಮ್ಮ backend ಎಂದಿಗೂ ಬ್ರೌಸರ್ ಜೊತೆಗೆ ನೇರವಾಗಿ ಮಾತನಾಡುವುದಿಲ್ಲ. ಬದಲಾಗಿ, ಅದು Push Service ಅನ್ನು ಬಳಸುತ್ತದೆ.

Google Chrome, Firebase Cloud Messaging ಅನ್ನು ಬಳಸುತ್ತದೆ. Firefox, Mozilla Push Service ಅನ್ನು ಬಳಸುತ್ತದೆ.

ಈ ಕೆಲಸದ ಕ್ರಮ ಹೀಗಿದೆ:

Backend → Push Service → Browser → Service Worker → User

React ಮತ್ತು Golang ಬಳಸಿ ಈ ವ್ಯವಸ್ಥೆಯನ್ನು ನೀವು ಹೇಗೆ ನಿರ್ಮಿಸಬಹುದು ಎಂಬುದು ಇಲ್ಲಿದೆ.

ಘಟಕಗಳು (The Components)

  1. Frontend (React): ಅನುಮತಿಯನ್ನು ವಿನಂತಿಸುತ್ತದೆ ಮತ್ತು Service Worker ಅನ್ನು ನೋಂದಾಯಿಸುತ್ತದೆ.
  2. Service Worker: ಬ್ರೌಸರ್‌ನಲ್ಲಿ ಕಾರ್ಯನಿರ್ವಹಿಸುವ ಒಂದು background script. ನಿಮ್ಮ ವೆಬ್‌ಸೈಟ್ ಮುಚ್ಚಿದಾಗಲೂ ಇದು ಇವೆಂಟ್‌ಗಳನ್ನು ನಿರ್ವಹಿಸುತ್ತದೆ.
  3. Backend (Golang): subscriptions ಅನ್ನು ಸಂಗ್ರಹಿಸುತ್ತದೆ ಮತ್ತು ಎನ್‌ಕ್ರಿಪ್ಟ್ ಮಾಡಿದ ಸಂದೇಶಗಳನ್ನು ಕಳುಹಿಸುತ್ತದೆ.
  4. Push Service: ಬ್ರೌಸರ್ಸ್‌ಗೆ ಸಂದೇಶವನ್ನು ತಲುಪಿಸುವ ಮಧ್ಯವರ್ತಿ.

Subscription ಪ್ರಕ್ರಿಯೆ (The Subscription Flow)

ಸಂದೇಶವನ್ನು ಕಳುಹಿಸಲು, ನಿಮಗೆ subscription ಅಗತ್ಯವಿದೆ.

  • ಬಳಕೆದಾರ ಅನುಮತಿಯನ್ನು ನೀಡುತ್ತಾರೆ.
  • ಬ್ರೌಸರ್ ಒಂದು endpoint ಮತ್ತು security keys ಒಳಗೊಂಡಿರುವ subscription object ಅನ್ನು ಸೃಷ್ಟಿಸುತ್ತದೆ.
  • ನಿಮ್ಮ React ಆಪ್ ಈ object ಅನ್ನು ನಿಮ್ಮ Golang backend ಗೆ ಕಳುಹಿಸುತ್ತದೆ.
  • ನಿಮ್ಮ backend ಅದನ್ನು ಡೇಟಾಬೇಸ್‌ನಲ್ಲಿ ಉಳಿಸುತ್ತದೆ.

ನಿಮ್ಮ ಸರ್ವರ್ ಅನ್ನು ಗುರುತಿಸಲು ನೀವು VAPID keys ಬಳಸಲೇಬೇಕು. Frontend ಗಾಗಿ public key ಮತ್ತು backend ಗಾಗಿ private key ಬಳಸಿ. ನಿಮ್ಮ private key ಅನ್ನು ಎಂದಿಗೂ ಹಂಚಿಕೊಳ್ಳಬೇಡಿ.

ಅಳವಡಿಕೆ (The Implementation)

React ನಲ್ಲಿ, push ಇವೆಂಟ್‌ಗಳನ್ನು ಕೇಳಲು ನೀವು Service Worker ಅನ್ನು ನೋಂದಾಯಿಸುತ್ತೀರಿ. ಈ worker ಹಿನ್ನೆಲೆಯಲ್ಲಿ (background) ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ. ಇದು ಡೇಟಾವನ್ನು ಸ್ವೀಕರಿಸುತ್ತದೆ ಮತ್ತು ಬಳಕೆದಾರರಿಗೆ ನೋಟಿಫಿಕೇಶನ್ ತೋರಿಸುತ್ತದೆ.

Golang ನಲ್ಲಿ, ಎನ್‌ಕ್ರಿಪ್ಶನ್ ಮತ್ತು VAPID ಅಥೆಂಟಿಕೇಶನ್ ಅನ್ನು ನಿರ್ವಹಿಸಲು ನೀವು ಒಂದು ಲೈಬ್ರರಿಯನ್ನು ಬಳಸುತ್ತೀರಿ. ನಿಮ್ಮ ಸರ್ವರ್ ಡೇಟಾಬೇಸ್‌ನಿಂದ subscription ಅನ್ನು ಓದುತ್ತದೆ, payload ಅನ್ನು ಎನ್‌ಕ್ರಿಪ್ಟ್ ಮಾಡುತ್ತದೆ ಮತ್ತು ಅದನ್ನು ಬ್ರೌಸರ್ push service ಗೆ ಕಳುಹಿಸುತ್ತದೆ.

Production ಗಾಗಿ ಸ್ಕೇಲಿಂಗ್ (Scaling for Production)

ಸಣ್ಣ ಪ್ರಾಜೆಕ್ಟ್‌ಗಳಿಗೆ ಸರಳವಾದ ಸೆಟಪ್ ಸಾಕು. ದೊಡ್ಡ ವ್ಯವಸ್ಥೆಗೆ ಹೆಚ್ಚಿನದರ ಅಗತ್ಯವಿದೆ.

  • ಬಹು ಸಾಧನಗಳನ್ನು ನಿರ್ವಹಿಸಿ (Handle multiple devices): ಒಬ್ಬ ಬಳಕೆದಾರರಿಗೆ ಫೋನ್ ಮತ್ತು ಲ್ಯಾಪ್‌ಟಾಪ್ ಇರಬಹುದು. ಪ್ರತಿ ಬಳಕೆದಾರರಿಗೆ ಹಲವಾರು subscriptions ಅನ್ನು ಸಂಗ್ರಹಿಸಿ.
  • ಡೇಟಾವನ್ನು ಕ್ಲೀನ್ ಮಾಡಿ (Clean up data): Subscriptions ಅವಧಿ ಮುಗಿಯುತ್ತವೆ. ನೀವು 404 ಅಥವಾ 410 error ಪಡೆದರೆ, ಆ subscription ಅನ್ನು ನಿಮ್ಮ ಡೇಟಾಬೇಸ್‌ನಿಂದ ಅಳಿಸಿಹಾಕಿ.
  • Queues ಬಳಸಿ: ಲಕ್ಷಾಂತರ ಬಳಕೆದಾರರಿಗಾಗಿ, Kafka ಅಥವಾ ಅಂತಹದ್ದೇ ಒಂದು ಸಾಧನವನ್ನು ಬಳಸಿ. ಇದು ನಿಮ್ಮ ವ್ಯವಸ್ಥೆಯು ನೋಟಿಫಿಕೇಶನ್‌ಗಳನ್ನು ಅಸಿಂಕ್ರೋನಸ್ ಆಗಿ (asynchronously) ಪ್ರಕ್ರಿಯೆಗೊಳಿಸಲು ಅನುವು ಮಾಡಿಕೊಡುತ್ತದೆ.
  • Retries ಅನ್ನು ಅಳವಡಿಸಿ: ನೆಟ್‌ವರ್ಕ್ ವೈಫಲ್ಯಗಳನ್ನು ನಿರ್ವಹಿಸಲು exponential backoff ಬಳಸಿ.

ಬಳಕೆದಾರರು ಸಕ್ರಿಯರಾಗಿದ್ದಾಗ ಲೈವ್ ಚಾಟ್‌ಗಳಿಗಾಗಿ WebSockets ಉತ್ತಮವಾಗಿವೆ. ಟ್ಯಾಬ್ ಮುಚ್ಚಿದಾಗ ಬಳಕೆದಾರರನ್ನು ತಲುಪಲು Web Push ಉತ್ತಮವಾಗಿದೆ.

ಮೂಲ: https://dev.to/chandu_bobbili_06/how-web-push-notifications-work-internally-implementing-with-react-golang-6m