Maison > interface Web > js tutoriel > le corps du texte

Implémentation de notifications push à l'aide de JavaScript : une approche de niveau production

WBOY
Libérer: 2024-08-17 13:05:02
original
467 Les gens l'ont consulté

Implementing Push Notifications Using JavaScript: A Production-Grade Approach

Dans cet article, vous apprendrez comment implémenter des notifications push à l'aide de JavaScript en suivant les meilleures pratiques de production. L'une des meilleures choses est que je fournirai également une structure de dossiers, afin que vous puissiez configurer facilement votre projet.

La configuration des notifications push dans une application réelle nécessite une planification minutieuse. Je vais vous montrer comment créer cette fonctionnalité dans une application Node.js professionnelle. Nous aborderons des parties importantes telles que la façon d'organiser votre code, de sécuriser les choses et de nous assurer qu'il fonctionne bien même à mesure que votre application se développe.

Pour commencer, vous avez besoin d'une bibliothèque pour vous aider à envoyer des notifications push depuis votre serveur Node.js. La bibliothèque web-push fournit des outils pour envoyer des notifications et gérer les clés nécessaires.

1. Notification push : structure du projet

Tout d'abord, configurons la structure du projet pour maintenir une base de code propre et évolutive :

/notification-service
├── /config
│   ├── default.js
│   └── production.js
├── /controllers
│   └── notificationController.js
├── /models
│   └── user.js
├── /routes
│   └── notificationRoutes.js
├── /services
│   ├── notificationService.js
│   ├── subscriptionService.js
│   └── webPushService.js
├── /utils
│   └── errorHandler.js
├── /tests
│   └── notification.test.js
├── app.js
├── package.json
├── .env
└── README.md
Copier après la connexion

Packages NPM requis

Avant de vous lancer dans la mise en œuvre, assurez-vous d'avoir installé les packages NPM suivants :

  • express : un framework d'application Web Node.js minimal et flexible.
  • mongoose : Une bibliothèque ODM (Object Data Modeling) pour MongoDB et Node.js.
  • web-push : une bibliothèque pour envoyer des notifications push à l'aide du protocole Web Push.
  • dotenv : un module sans dépendance qui charge les variables d'environnement à partir d'un fichier .env.
  • supertest : Une bibliothèque pour tester les assertions HTTP dans Node.js.

Installez ces packages à l'aide de npm :

bash

npm install express mongoose web-push dotenv supertest
Copier après la connexion

2. Notification push : configuration du projet

Créez des fichiers de configuration pour différents environnements (par exemple, développement, production). Ces fichiers stockent les paramètres spécifiques à l'environnement.

// /config/default.js
module.exports = {
    server: {
        port: 3000,
        env: 'development'
    },
    pushNotifications: {
        publicVapidKey: process.env.VAPID_PUBLIC_KEY,
        privateVapidKey: process.env.VAPID_PRIVATE_KEY,
        gcmApiKey: process.env.GCM_API_KEY
    },
    db: {
        uri: process.env.MONGO_URI
    }
};
Copier après la connexion
// /config/production.js
module.exports = {
    server: {
        port: process.env.PORT || 3000,
        env: 'production'
    },
    // Same structure as default, with production-specific values
};
Copier après la connexion

3. Modélisation de la base de données

Utilisez Mongoose pour définir votre schéma utilisateur et vos abonnements aux notifications.

// /models/user.js
const mongoose = require('mongoose');

const subscriptionSchema = new mongoose.Schema({
    endpoint: String,
    keys: {
        p256dh: String,
        auth: String
    }
});

const userSchema = new mongoose.Schema({
    email: { type: String, required: true, unique: true },
    subscriptions: [subscriptionSchema],
    preferences: {
        pushNotifications: { type: Boolean, default: true }
    }
});

module.exports = mongoose.model('User', userSchema);
Copier après la connexion

4. Services de notifications

Modularisez la logique de gestion des notifications en services.

// /services/webPushService.js
const webPush = require('web-push');
const config = require('config');

webPush.setVapidDetails(
    'mailto:example@yourdomain.org',
    config.get('pushNotifications.publicVapidKey'),
    config.get('pushNotifications.privateVapidKey')
);

module.exports = {
    sendNotification: async (subscription, payload) => {
        try {
            await webPush.sendNotification(subscription, JSON.stringify(payload));
        } catch (error) {
            console.error('Error sending notification', error);
        }
    }
};
Copier après la connexion
// /services/notificationService.js
const User = require('../models/user');
const webPushService = require('./webPushService');

module.exports = {
    sendPushNotifications: async (userId, payload) => {
        const user = await User.findById(userId);
        if (user && user.preferences.pushNotifications) {
            user.subscriptions.forEach(subscription => {
                webPushService.sendNotification(subscription, payload);
            });
        }
    }
};
Copier après la connexion

5. Logique du contrôleur

Gérer les routes API et intégrer les services.

// /controllers/notificationController.js
const notificationService = require('../services/notificationService');

exports.sendNotification = async (req, res, next) => {
    try {
        const { userId, title, body } = req.body;
        const payload = { title, body };
        await notificationService.sendPushNotifications(userId, payload);
        res.status(200).json({ message: 'Notification sent successfully' });
    } catch (error) {
        next(error);
    }
};
Copier après la connexion

6. Routage

Configurez des itinéraires pour votre API.

// /routes/notificationRoutes.js
const express = require('express');
const router = express.Router();
const notificationController = require('../controllers/notificationController');

router.post('/send', notificationController.sendNotification);

module.exports = router;
Copier après la connexion

7. Gestion des erreurs

Centralisez la gestion des erreurs pour garantir que l'application ne plante pas.

// /utils/errorHandler.js
module.exports = (err, req, res, next) => {
    console.error(err.stack);
    res.status(500).send({ error: 'Something went wrong!' });
};
Copier après la connexion

8. Point d'entrée de la candidature

Initialisez l'application et connectez-vous à la base de données.

// app.js
const express = require('express');
const mongoose = require('mongoose');
const config = require('config');
const notificationRoutes = require('./routes/notificationRoutes');
const errorHandler = require('./utils/errorHandler');

const app = express();

app.use(express.json());
app.use('/api/notifications', notificationRoutes);
app.use(errorHandler);

mongoose.connect(config.get('db.uri'), {
    useNewUrlParser: true,
    useUnifiedTopology: true
})
    .then(() => console.log('MongoDB connected...'))
    .catch(err => console.error('MongoDB connection error:', err));

const PORT = config.get('server.port');
app.listen(PORT, () => console.log(`Server running in ${config.get('server.env')} mode on port ${PORT}`));
Copier après la connexion

9. Pratiques de sécurité

  • Variables d'environnement : stockez des informations sensibles telles que les clés API et les URI de base de données dans des variables d'environnement.
  • HTTPS : servez votre application via HTTPS pour sécuriser la communication entre les clients et le serveur.
  • Politique de sécurité du contenu (CSP) : implémentez les en-têtes CSP pour empêcher les attaques de scripts intersites (XSS).
  • Rate Limiting : utilisez un middleware comme express-rate-limit pour protéger votre API contre les attaques par force brute.

10. Tests

Écrivez des tests pour vous assurer que votre service fonctionne comme prévu dans diverses conditions.

// /tests/notification.test.js
const request = require('supertest');
const app = require('../app');

describe('Notification API', () => {
    it('should send a notification', async () => {
        const res = await request(app)
            .post('/api/notifications/send')
            .send({ userId: 'someUserId', title: 'Test', body: 'This is a test' });
        expect(res.statusCode).toEqual(200);
        expect(res.body.message).toBe('Notification sent successfully');
    });
});
Copier après la connexion

11. Déploiement en production

  • Pipeline CI/CD : configurez un pipeline CI/CD à l'aide d'outils tels que Jenkins, GitHub Actions ou GitLab CI pour automatiser les tests, la création et le déploiement de votre application.
  • Conteneurisation : Dockerisez votre application pour garantir la cohérence dans différents environnements.
  • Surveillance : utilisez des outils de surveillance tels que Prometheus et Grafana pour suivre la santé et les performances de votre application.

12. Mise à l'échelle

  • Mise à l'échelle horizontale : déployez plusieurs instances de votre service derrière un équilibreur de charge pour gérer un trafic élevé.
  • Mise à l'échelle de la base de données : implémentez le partitionnement ou les jeux de réplicas dans MongoDB pour la mise à l'échelle horizontale de votre base de données.

Cette configuration de niveau production garantit que votre système de notification push est évolutif, sécurisé et maintenable. Le code est organisé pour prendre en charge des tests, un déploiement et une surveillance faciles, conformément aux meilleures pratiques du secteur. Si vous avez d’autres questions ou avez besoin de détails spécifiques sur la mise en œuvre, n’hésitez pas à les demander !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:dev.to
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!