Passer au contenu du pied de page
AIDE NODE

sockjs NPM (Comment ça marche pour les développeurs)

SockJS et IronPDF jouent des rôles différents mais complémentaires dans la création d'applications en ligne. Un package JavaScript appelé SockJS offre une API HTTP bidirectionnelle pour la communication client-serveur qui ressemble aux WebSockets. Il permet aux navigateurs web et aux serveurs de communiquer en temps réel et à travers des événements, permettant l'utilisation d'applications comme les salons de chat, les nouvelles en direct et les outils de collaboration. Cependant, dans les environnements Node.js, IronPDF est une bibliothèque JavaScript puissante qui permet de produire et de modifier des documents PDF de manière programmatique.

Alors qu'IronPDF permet la création et la gestion dynamiques de documents PDF, le client SockJS gère l'échange de données en temps réel et les fonctionnalités de collaboration dans les applications en ligne via un canal de communication inter-domaine. En intégrant l’équivalent du serveur SockJS avec IronPDF, les développeurs peuvent facilement générer et servir des documents PDF basés sur des données dynamiques ou des interactions utilisateur tout en améliorant leurs applications avec des mises à jour en temps réel. Avec cette combinaison, les développeurs peuvent concevoir des applications en ligne sophistiquées qui prennent en charge une variété de cas d'utilisation, y compris les applications intensives en documents et les plateformes collaboratives, en utilisant à la fois la communication en temps réel et la création dynamique de PDF.

Qu'est-ce que SockJS NPM ?

SockJS est une bibliothèque JavaScript côté navigateur qui facilite la communication bidirectionnelle en temps réel entre les clients web et les serveurs. Il abstrait WebSocket et offre un mécanisme de repli vers d'autres protocoles de transport comme le long-polling HTTP et le streaming XHR, garantissant la compatibilité avec divers navigateurs web et environnements. Il fournit une API JavaScript simple pour établir et gérer des connexions et gérer des événements tels que l'ouverture de connexion, la réception de messages et la fermeture. De plus, SockJS inclut un client en ligne de commande pour des tests et des fins de débogage, ce qui le rend polyvalent à la fois pour les environnements de développement et de production. En général, l'objet JavaScript SockJS simplifie l'implémentation de fonctionnalités en temps réel dans les applications web, prenant en charge des canaux de communication évolutifs et réactifs.

sockjs NPM (Comment cela fonctionne pour les développeurs) : Figure 1 - SockJS

Caractéristiques clés de SockJS

Compatibilité Multi-navigateur

SockJS assure un comportement et une fonctionnalité cohérents dans de nombreux navigateurs web et environnements.

Mécanisme de Repli

Si les connexions WebSocket ne sont pas disponibles ou échouent, SockJS peut basculer de manière transparente vers d'autres protocoles de transport, tels que HTTP long-polling, XHR streaming ou même JSONP polling.

Communication en Temps Réel

Il permet aux applications côté serveur (utilisant généralement Node.js ou d'autres technologies côté serveur) et aux applications JavaScript côté client (s'exécutant dans les navigateurs web) de communiquer en temps réel et de manière orientée événement.

Facilité d'utilisation

Parce que SockJS offre une API simple équivalente à WebSocket, les développeurs peuvent facilement l'inclure et l'utiliser dans leurs projets.

Scalabilité

SockJS facilite le développement d'applications évolutives pouvant gérer de nombreuses connexions simultanées et une variété de situations réseau grâce au support de multiples protocoles de transport et techniques de repli.

Facilité d'Intégration

Il simplifie l'implémentation des fonctionnalités en temps réel en fournissant une API simple que les développeurs peuvent intégrer dans leurs applications web sans nécessiter une programmation réseau complexe de bas niveau.

Abstraction des Protocoles de Transport :

Les protocoles de transport sous-jacents comme WebSocket, le long-polling HTTP et autres sont abstraits par SockJS. Grâce à son adaptabilité, une communication fiable est garantie même dans les situations où les connexions WebSocket sont restreintes ou indisponibles.

Créer et Configurer SockJS

Vous devez généralement configurer SockJS à la fois côté client (dans votre navigateur web) et côté serveur (en utilisant un framework de navigateur ou de serveur comme Node.js) pour le construire et le configurer pour la communication en temps réel dans une application en ligne. Ci-dessous, un guide de base pour créer et configurer SockJS :

Installer SockJS

SockJS peut être installé en utilisant NPM ou inclus directement via un CDN :

npm install sockjs-client
npm install sockjs-client
SHELL

Inclure SockJS dans Votre HTML

Incluez la bibliothèque JavaScript SockJS dans le fichier HTML que vous créez :

<script src="https://cdn.jsdelivr.net/npm/sockjs-client@1/dist/sockjs.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sockjs-client@1/dist/sockjs.min.js"></script>
HTML

Initialiser la Connexion SockJS

Créez une instance SockJS dans votre fichier JavaScript (app.js ou quelque chose de similaire) et connectez-vous à votre serveur :

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>SockJS + IronPDF Example</title>
  </head>
  <body>
    <script src="https://cdn.jsdelivr.net/npm/sockjs-client@1/dist/sockjs.min.js"></script>
    <script>
      // Initialize SockJS connection
      const sock = new SockJS("http://localhost:3000/socket");

      // Event handlers
      sock.onopen = function () {
        console.log("Connection opened");
      };
      sock.onmessage = function (e) {
        console.log("Message received:", e.data);
      };
      sock.onclose = function () {
        console.log("Connection closed");
      };

      // Example function to send a message
      function sendMessage(message) {
        sock.send(message);
      }
    </script>
    Enter the Message:
  </body>
</html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>SockJS + IronPDF Example</title>
  </head>
  <body>
    <script src="https://cdn.jsdelivr.net/npm/sockjs-client@1/dist/sockjs.min.js"></script>
    <script>
      // Initialize SockJS connection
      const sock = new SockJS("http://localhost:3000/socket");

      // Event handlers
      sock.onopen = function () {
        console.log("Connection opened");
      };
      sock.onmessage = function (e) {
        console.log("Message received:", e.data);
      };
      sock.onclose = function () {
        console.log("Connection closed");
      };

      // Example function to send a message
      function sendMessage(message) {
        sock.send(message);
      }
    </script>
    Enter the Message:
  </body>
</html>
HTML

L'URL de votre point d'accès WebSocket côté serveur doit être utilisée à la place de "http://localhost:3000/socket".

sockjs NPM (Comment cela fonctionne pour les développeurs) : Figure 2 - Sortie de connexion SockJS

Configuration Côté Serveur

Installer SockJS-Node

Pour installer le package SockJS-Node, utilisez npm :

npm install sockjs
npm install sockjs
SHELL

Configurer le Serveur SockJS

Dans votre serveur Node.js, configurez SockJS :

// Import necessary modules
const http = require('http');
const sockjs = require('sockjs');

// Create a SockJS server
const sockjsServer = sockjs.createServer();

// Attach the server to an HTTP server instance
const server = http.createServer();

// Install SockJS handlers
sockjsServer.installHandlers(server, { prefix: '/socket' });

// Define SockJS event handlers
sockjsServer.on('connection', function(conn) {
    console.log('Client connected');
    conn.on('data', function(message) {
        console.log('Received message:', message);
        // Handle incoming messages from client
    });
    conn.on('close', function() {
        console.log('Client disconnected');
    });
});

// Start the server
const PORT = 3000;
server.listen(PORT, function() {
    console.log(`Server listening on port ${PORT}`);
});
// Import necessary modules
const http = require('http');
const sockjs = require('sockjs');

// Create a SockJS server
const sockjsServer = sockjs.createServer();

// Attach the server to an HTTP server instance
const server = http.createServer();

// Install SockJS handlers
sockjsServer.installHandlers(server, { prefix: '/socket' });

// Define SockJS event handlers
sockjsServer.on('connection', function(conn) {
    console.log('Client connected');
    conn.on('data', function(message) {
        console.log('Received message:', message);
        // Handle incoming messages from client
    });
    conn.on('close', function() {
        console.log('Client disconnected');
    });
});

// Start the server
const PORT = 3000;
server.listen(PORT, function() {
    console.log(`Server listening on port ${PORT}`);
});
JAVASCRIPT

Assurez-vous que le code côté serveur est personnalisé pour répondre aux besoins de votre application et fonctionne avec le framework ou la configuration du serveur que vous avez déjà.

sockjs NPM (Comment cela fonctionne pour les développeurs) : Figure 3 - Sortie de configuration du serveur SockJS

Requêtes Cross-Origin (CORS) : Assurez-vous que votre serveur gère efficacement les paramètres CORS si votre serveur et votre client sont sur des domaines séparés.

Gestion des Erreurs : Implémentez la gestion des erreurs et les mesures de sécurité (comme l'authentification et l'autorisation) selon les spécifications de votre application.

Déploiement : Configurez HTTPS pour des connexions sécurisées et configurez SockJS et votre serveur pour les environnements de déploiement.

Cette configuration offre une base fondamentale pour établir une communication en temps réel entre un client web et un serveur web utilisant SockJS. Selon les exigences et l'architecture de votre application particulière, des ajustements peuvent être nécessaires.

Démarrage

La première étape pour débuter avec SockJS et IronPDF est de configurer une application web qui utilise les capacités de communication en temps réel de SockJS et intègre IronPDF pour la création dynamique de PDF. Voici un guide de démarrage :

Qu'est-ce qu'IronPDF ?

Un outil puissant pour Node.js appelé IronPDF est conçu pour transformer des données HTML en fichiers PDF d'une qualité extraordinairement élevée. Sans sacrifier le contenu web original, il accélère le processus de conversion des fichiers HTML, CSS et autres fichiers JavaScript en PDFs correctement formatés. C'est un outil très utile pour les applications web qui doivent générer des documents dynamiques et imprimables comme des rapports, des factures et des certifications.

Des paramètres de page personnalisables, des en-têtes, des pieds de page et la possibilité d'ajouter des polices et des images ne sont que quelques-unes des capacités d'IronPDF. Il peut gérer des mises en page et des styles complexes pour garantir que chaque sortie PDF de test satisfait aux exigences. De plus, IronPDF gère l'exécution de JavaScript à l'intérieur du HTML, permettant un rendu précis de contenu dynamique et interactif.

sockjs NPM (Comment cela fonctionne pour les développeurs) : Figure 4 - IronPDF

Caractéristiques de IronPDF

1. Génération de PDF à partir de HTML

Convertissez JavaScript, HTML et CSS en PDF. Prend en charge les requêtes média et le design réactif, deux normes web contemporaines. Utile pour décorer dynamiquement des rapports PDF, des factures et des documents avec HTML et CSS.

2. Édition de PDF

Les PDFs existants peuvent se voir ajouter du texte, des images et d'autres contenus. Extraire du texte et des images à partir de fichiers PDF. Combinez plusieurs PDF en un seul fichier. Divisez les fichiers PDF en plusieurs documents séparés. Ajoutez des filigranes, des annotations, des en-têtes et des pieds de page.

3. Performance et fiabilité

La haute performance et la fiabilité sont des qualités de conception souhaitées dans les environnements industriels. Gère aisément de grands ensembles de documents.

Installer IronPDF

Installez le package IronPDF pour obtenir les outils nécessaires pour travailler avec des PDFs dans des projets Node.js. Exécutez la commande suivante :

npm install @ironsoftware/ironpdf
npm install @ironsoftware/ironpdf
SHELL

Combiner SockJS avec IronPDF

Configurez SockJS sur votre serveur Node.js pour gérer les demandes de génération de PDF et pour gérer les connexions client :

// server.js

// Import necessary modules
const http = require("http");
const sockjs = require("sockjs");
const IronPdf = require("@ironsoftware/ironpdf");

// Configure IronPDF with your license key
var config = IronPdf.IronPdfGlobalConfig;
config.setConfig({
  licenseKey: "",  // Add your IronPDF license key here
});

// Create a SockJS server
const sockjsServer = sockjs.createServer();

// Attach the SockJS server to an HTTP server instance
const server = http.createServer();
sockjsServer.installHandlers(server, { prefix: "/socket" });

// Handle SockJS connections and messages
sockjsServer.on("connection", function (conn) {
  console.log("Client connected");

  // Handle incoming messages (PDF generation requests)
  conn.on("data", async function(message) {
    console.log("Received message:", message);

    // Generate PDF using IronPDF
    let pdfdata = await generatePdf(message);

    // Send generated PDF data back to client
    conn.write(pdfdata);
  });

  conn.on("close", function () {
    console.log("Client disconnected");
  });
});

// Function to generate PDF using IronPDF
const generatePdf = async (htmlContent) => {
  const pdfDocument = IronPdf.PdfDocument;
  let result = (await pdfDocument.fromHtml(htmlContent));
  const pdfBuffer = await result.saveAsBuffer();
  return pdfBuffer;
};

// Start the HTTP server
const PORT = 3000;
server.listen(PORT, function () {
  console.log(`Server listening on port ${PORT}`);
});
// server.js

// Import necessary modules
const http = require("http");
const sockjs = require("sockjs");
const IronPdf = require("@ironsoftware/ironpdf");

// Configure IronPDF with your license key
var config = IronPdf.IronPdfGlobalConfig;
config.setConfig({
  licenseKey: "",  // Add your IronPDF license key here
});

// Create a SockJS server
const sockjsServer = sockjs.createServer();

// Attach the SockJS server to an HTTP server instance
const server = http.createServer();
sockjsServer.installHandlers(server, { prefix: "/socket" });

// Handle SockJS connections and messages
sockjsServer.on("connection", function (conn) {
  console.log("Client connected");

  // Handle incoming messages (PDF generation requests)
  conn.on("data", async function(message) {
    console.log("Received message:", message);

    // Generate PDF using IronPDF
    let pdfdata = await generatePdf(message);

    // Send generated PDF data back to client
    conn.write(pdfdata);
  });

  conn.on("close", function () {
    console.log("Client disconnected");
  });
});

// Function to generate PDF using IronPDF
const generatePdf = async (htmlContent) => {
  const pdfDocument = IronPdf.PdfDocument;
  let result = (await pdfDocument.fromHtml(htmlContent));
  const pdfBuffer = await result.saveAsBuffer();
  return pdfBuffer;
};

// Start the HTTP server
const PORT = 3000;
server.listen(PORT, function () {
  console.log(`Server listening on port ${PORT}`);
});
JAVASCRIPT

Configuration Côté Client

Configurez SockJS côté client pour interagir avec le serveur et soumettre des demandes pour générer des PDF.

<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>SockJS + IronPDF Example</title>
</head>
<body>
    <button onclick="generatePdf()">Generate PDF</button>
    <!-- Add SockJS browser JavaScript library -->
    <script src="https://cdn.jsdelivr.net/npm/sockjs-client@1/dist/sockjs.min.js"></script>
    <script>
        // Initialize SockJS connection
        const sock = new SockJS('http://localhost:3000/socket');

        // Event handlers
        sock.onopen = function() {
            console.log('Connection opened');
        };

        sock.onmessage = function(e) {
            console.log('PDF received');
            // Example: Display or download PDF received from server
            displayPdf(e.data);
        };

        sock.onclose = function() {
            console.log('Connection closed');
        };

        // Function to generate PDF
        function generatePdf() {
            // Example: HTML content to generate PDF
            const htmlContent = '<html><body><h1>Hello, IronPDF!</h1></body></html>';
            // Send HTML content to server for PDF generation
            sock.send(htmlContent);
        }

        // Function to display or download PDF data
        function displayPdf(pdfData) {
            // Example: Display or download PDF data received from server
            const pdfBlob = new Blob([atob(pdfData)], { type: 'application/pdf' });
            const pdfUrl = URL.createObjectURL(pdfBlob);
            window.open(pdfUrl, '_blank');
        }
    </script>
</body>
</html>
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>SockJS + IronPDF Example</title>
</head>
<body>
    <button onclick="generatePdf()">Generate PDF</button>
    <!-- Add SockJS browser JavaScript library -->
    <script src="https://cdn.jsdelivr.net/npm/sockjs-client@1/dist/sockjs.min.js"></script>
    <script>
        // Initialize SockJS connection
        const sock = new SockJS('http://localhost:3000/socket');

        // Event handlers
        sock.onopen = function() {
            console.log('Connection opened');
        };

        sock.onmessage = function(e) {
            console.log('PDF received');
            // Example: Display or download PDF received from server
            displayPdf(e.data);
        };

        sock.onclose = function() {
            console.log('Connection closed');
        };

        // Function to generate PDF
        function generatePdf() {
            // Example: HTML content to generate PDF
            const htmlContent = '<html><body><h1>Hello, IronPDF!</h1></body></html>';
            // Send HTML content to server for PDF generation
            sock.send(htmlContent);
        }

        // Function to display or download PDF data
        function displayPdf(pdfData) {
            // Example: Display or download PDF data received from server
            const pdfBlob = new Blob([atob(pdfData)], { type: 'application/pdf' });
            const pdfUrl = URL.createObjectURL(pdfBlob);
            window.open(pdfUrl, '_blank');
        }
    </script>
</body>
</html>
HTML

Côté Serveur : Le serveur Node.js configure un serveur SockJS (sockjsServer) et écoute les connexions sur le chemin /socket. Il utilise IronPDF (IronPdf.PdfDocument) pour invoquer la fonction generatePdf() afin de gérer les messages entrants (demandes de génération de PDF). Après avoir généré le PDF, il utilise la connexion SockJS pour envoyer les données PDF encodées en base64 au client.

sockjs NPM (Comment cela fonctionne pour les développeurs) : Figure 5 - Sortie de code source client SockJS

Côté Client : Le client se connecte au serveur via une connexion SockJS (sock) et écoute des événements tels que onopen, onmessage et onclose. L'utilisateur utilise sock.send(htmlContent) pour envoyer le contenu HTML (htmlContent) au serveur pour la génération de PDF lorsqu'il clique sur le bouton "Générer un PDF". Il affiche ou télécharge le PDF après avoir obtenu les données PDF du serveur (sock.onmessage).

sockjs NPM (Comment cela fonctionne pour les développeurs) : Figure 6 - Sortie côté client

Ci-dessous, la sortie générée par le code.

sockjs NPM (Comment cela fonctionne pour les développeurs) : Figure 7 - Sortie PDF

Conclusion

Une synergie forte est créée dans le développement d'applications web lorsque SockJS est utilisé pour la communication en temps réel et IronPDF est utilisé pour la production dynamique de PDF. Avec SockJS, la communication bidirectionnelle entre les clients et les serveurs est facilitée, permettant des fonctionnalités comme la collaboration interactive et les mises à jour en temps réel. Cependant, IronPDF donne aux programmeurs la possibilité de créer et de modifier des documents PDF de manière programmatique. Il peut même convertir dynamiquement du texte HTML en PDF.

Les applications web complexes qui peuvent créer des documents PDF instantanément en réponse aux entrées utilisateur ou aux mises à jour de données en temps réel sont rendues possibles par l'intégration de ces technologies. Les applications nécessitant des fonctionnalités de génération de documents en temps réel, d'édition de groupe ou de reporting interactif trouveront cette intégration particulièrement utile. Grâce à l'utilisation de SockJS pour les mises à jour instantanées et IronPDF pour la création dynamique de PDF, les développeurs peuvent optimiser l'expérience utilisateur, améliorer les flux de travail et fournir des solutions résilientes qui satisfont une gamme de besoins commerciaux pour tout utilisateur sérieux de SockJS.

Nous pouvons augmenter l'utilité de votre boîte à outils de développement d'applications Node.js en utilisant IronPDF pour ajouter la reconnaissance optique de caractères (OCR), le balayage de codes-barres, la production de PDF, l'interaction Excel et de nombreuses autres fonctionnalités. Les systèmes très configurables et la vaste bibliothèque de plugins soutenus par la communauté d'Iron Software permettent aux développeurs de créer des fonctionnalités et des applications web plus rapidement.

Les développeurs peuvent utiliser les nombreuses fonctionnalités d'IronPDF avec une licence d'essai gratuite et une gamme d'exemples de code fournis par l'entreprise avant de se décider à acheter. Pour plus d'informations sur la licence perpétuelle d'IronPDF, visitez la page des licences. Pour des instructions supplémentaires sur la façon de commencer à utiliser IronPDF, visitez la page de documentation.

Darrius Serrant
Ingénieur logiciel Full Stack (WebOps)

Darrius Serrant est titulaire d'un baccalauréat en informatique de l'université de Miami et travaille comme ingénieur marketing WebOps Full Stack chez Iron Software. Attiré par le codage dès son plus jeune âge, il a vu l'informatique comme à la fois mystérieuse et accessible, en faisant le ...

Lire la suite