跳過到頁腳內容
  1. IronPDF for Node.js
  2. IronPDF for Node.js 博客
  3. Node 幫助
  4. sockjs NPM
NODE 說明

sockjs NPM（開發者的使用方法）

Darrius Serrant
Darrius Serrant
更新:

SockJS 和 IronPDF 在建立線上應用程式方面扮演著不同但互補的角色。 一個名為 SockJS 的 JavaScript 套件提供了一個類似 WebSocket 的雙向HTTP API，用於客戶端-伺服器通訊。 它使網頁瀏覽器和伺服器能夠透過事件進行即時通信，從而可以使用聊天室、即時新聞和團隊協作工具等應用程式。 然而，在 Node.js 環境中，IronPDF 是一個強大的 JavaScript 程式庫，它提供了以程式設計方式產生和修改 PDF 文件的功能。

IronPDF 允許動態建立和管理 PDF 文檔，而 SockJS 用戶端則透過跨域通訊通道管理線上應用程式中的即時資料交換和協作功能。 透過將 SockJS 伺服器版本與 IronPDF 集成，開發人員可以根據動態資料或使用者互動輕鬆產生和提供 PDF 文檔，同時透過即時變更增強其應用程式。 透過這種組合，開發人員可以利用即時通訊和動態 PDF 創建功能，設計出支援各種用例的複雜線上應用程序，包括文件密集型應用程式和協作平台。

什麼是 SockJS NPM？

SockJS是一個瀏覽器端 JavaScript 函式庫，可促進 Web 用戶端和伺服器之間的即時雙向通訊。 它抽象化了 WebSocket，並提供了一種回退機制，支援 HTTP 長輪詢和 XHR 串流等替代傳輸協議，從而確保與各種 Web 瀏覽器和環境的兼容性。 它提供了一個簡單的 JavaScript API，用於建立和管理連接，以及處理連接開啟、訊息接收和關閉等事件。 此外，SockJS 還包含一個用於測試和偵錯的命令列客戶端，使其在開發和生產環境中都具有很高的通用性。 總的來說，SockJS JavaScript 物件簡化了 Web 應用程式中即時功能的實現，支援可擴展且響應迅速的通訊管道。

! Sockjs NPM（開發者使用指南）：圖 1 - SockJS

SockJS 的主要特性

跨瀏覽器相容性

SockJS 確保在多種 Web 瀏覽器和環境下保持一致的行為和功能。

備用機制

如果 WebSocket 連線不可用或失敗，SockJS 可以透明地切換到其他傳輸協議，例如 HTTP 長輪詢、XHR 串流傳輸，甚至是 JSONP 輪詢。

即時通訊

它允許伺服器端應用程式（通常使用 Node.js 或其他伺服器端技術）和客戶端 JavaScript 應用程式（在 Web 瀏覽器中運行）以即時和事件驅動的方式進行通訊。

易用性

由於 SockJS 提供了與 WebSocket 等效的簡單 API，開發人員可以輕鬆地將其包含在他們的專案中並加以利用。

可擴展性

SockJS 支援多種傳輸協定和回退技術，從而促進可擴展應用程式的開發，這些應用程式可以管理大量並發連接和各種網路狀況。

易於集成

它提供了一個簡單的 API，開發人員可以將該 API 整合到他們的 Web 應用程式中，而無需複雜的底層網路編程，從而簡化了即時功能的實現。

傳輸協定抽象：

SockJS 對 WebSocket、HTTP 長輪詢和其他底層傳輸協定進行了抽象化。 由於其適應性強，即使在 WebSocket 連線受限或不可用的情況下，也能保證可靠的通訊。

建立和配置 SockJS

通常需要在客戶端（在您的 Web 瀏覽器中）和服務端（使用瀏覽器或像 Node.js 這樣的伺服器框架）設定 SockJS，才能建立和配置它，以便在線上應用程式中進行即時通訊。 以下是建立和設定 SockJS 的基本操作步驟：

安裝 SockJS

SockJS 可以透過 NPM 安裝，也可以透過 CDN 直接引入：

npm install sockjs-client
npm install sockjs-client
SHELL

在你的 HTML 程式碼中包含 SockJS

將 SockJS JavaScript 庫包含在您建立的 HTML 檔案中：

<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

初始化 SockJS 連接

在你的 JavaScript 檔案（app.js 或類似檔案）中建立一個 SockJS 實例，並連接到你的伺服器：

<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

應該使用伺服器端 WebSocket 端點的 URL，而不是" http://localhost:3000/socket "。

! sockjs NPM（開發者使用方法）：圖 2 - SockJS 連線輸出

伺服器端設定

安裝 SockJS-Node

若要安裝 SockJS-Node 套件，請使用 npm：

npm install sockjs
npm install sockjs
SHELL

配置 SockJS 伺服器

在您的 Node.js 伺服器中配置 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

確保伺服器端程式碼經過定制，以滿足應用程式的需求，並與您現有的伺服器框架或配置相容。

! sockjs NPM（開發者使用指南）：圖 3 - SockJS 伺服器符合配置的輸出

跨網域請求 (CORS)：如果您的伺服器和用戶端位於不同的網域中，請確保您的伺服器有效處理 CORS 設定。

錯誤處理：根據應用程式的規範實施錯誤處理和安全措施（例如身份驗證和授權）。

部署：設定 HTTPS 以實現安全連接，並為部署環境設定 SockJS 和您的伺服器。

此配置為使用 SockJS 在 Web 用戶端和 Web 伺服器之間建立即時通訊提供了基本基礎。 根據您特定應用程式的需求和架構，可能需要進行調整。

開始

使用 SockJS 和 IronPDF 的第一步是建立一個利用 SockJS 的即時通訊功能並整合 IronPDF 以動態建立 PDF 的 Web 應用程式。 以下是入門指南：

什麼是 IronPDF？

IronPDF是一款功能強大的 Node.js 工具，旨在將 HTML 資料轉換為極高品質的 PDF 檔案。 在不犧牲原始網頁內容的前提下，它可以加快將 HTML、CSS 和其他 JavaScript 檔案轉換為格式正確的 PDF 的過程。 對於需要產生動態、可列印文件（如報表、發票和憑證）的 Web 應用程式來說，這是一個非常有用的工具。

IronPDF 的眾多功能中，可自訂頁面設定、頁首、頁腳，以及新增字體和圖像的功能只是其中的一部分。 它可以處理複雜的佈局和樣式，以確保每個測試 PDF 輸出都符合要求。 此外，IronPDF 還管理 HTML 中 JavaScript 的執行，從而實現精確的動態互動內容渲染。

! sockjs NPM（開發者使用方法）：圖 4 - IronPDF

IronPDF 的特點

1. 從 HTML 產生 PDF

將 JavaScript、HTML 和 CSS 轉換為 PDF。 支援媒體查詢和回應式設計這兩項當代網路標準。 可用於使用 HTML 和 CSS 動態裝飾 PDF 報告、發票和文件。

2.PDF 編輯

預先存在的 PDF 可以加入文字、圖片和其他內容。 從 PDF 檔案中萃取文字和影像。 將多個PDF文件合併成一個文件。將PDF文件拆分成多個單獨的文檔。 包括水印、註解、頁首和頁尾。

3. 性能和可靠性

在工業環境中，高效能和可靠度是理想的設計品質。 輕鬆管理大型文件集。

安裝 IronPDF

安裝 IronPDF 包，即可獲得在 Node.js 專案中處理 PDF 所需的工具。 運行以下命令：

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

將 SockJS 與 IronPDF 結合使用

在您的 Node.js 伺服器上設定 SockJS，以處理 PDF 產生請求並管理客戶端連線：

// 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

客戶端設定

在客戶端配置 SockJS，使其與伺服器互動並提交請求以產生 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

伺服器端： Node.js 伺服器設定 SockJS 伺服器 ( sockjsServer ) 並監聽/socket路徑上的連線。 它使用 IronPDF（ IronPdf.PdfDocument ）呼叫generatePdf()函數來處理傳入的訊息（PDF 產生請求）。 產生 PDF 後，它使用 SockJS 連線將 base64 編碼的 PDF 資料傳送回客戶端。

! sockjs NPM（開發者使用指南）：圖 5 - SockJS 用戶端原始碼輸出

客戶端：客戶端透過 SockJS 連線（ sock ）連接到伺服器，並監聽onopen 、 onmessage和onclose等事件。 當使用者點擊"產生 PDF"按鈕時，使用者使用sock.send(htmlContent)將 HTML 內容 ( htmlContent ) 傳送到伺服器以產生 PDF。 它在從伺服器取得 PDF 資料後（ sock.onmessage ）顯示或下載 PDF。

! sockjs NPM（開發者使用指南）：圖 6 - 客戶端輸出

以下是程式碼產生的輸出結果。

! sockjs NPM（開發者使用指南）：圖 7 - PDF 輸出

結論

在 Web 應用程式開發中，當使用 SockJS 進行即時通信，而使用 IronPDF 進行動態 PDF 生成時，會產生強大的協同效應。 借助 SockJS，客戶端和伺服器之間的雙向通訊變得簡單，從而實現了互動式協作和即時更新等功能。 然而，IronPDF 使程式設計師能夠以程式設計方式建立和修改 PDF 文件。 它甚至可以動態地將HTML文字轉換為PDF。

透過整合這些技術，可以實現複雜的 Web 應用程序，這些應用程式能夠根據使用者輸入或即時資料更新立即建立 PDF 文件。 對於需要即時文件產生、群組編輯或互動式報告功能的應用來說，這種整合尤其有用。 透過使用 SockJS 進行即時更新和 IronPDF 進行動態 PDF 創建，開發人員可以優化用戶體驗、優化工作流程，並提供滿足任何認真使用 SockJS 的用戶的各種業務需求的彈性解決方案。

我們可以利用IronPDF來增加您的 Node.js 應用程式開發工具包的實用性，例如添加 OCR、條碼掃描、PDF 生成、Excel 互動以及許多其他功能。 Iron Software 高度可配置的系統和豐富的社群支援外掛程式庫使開發人員能夠更快地建立功能和 Web 應用程式。

開發者可以在購買前使用 IronPDF 的免費試用許可證和一系列程式碼範例來體驗其眾多功能。 有關 IronPDF 永久許可的更多信息，請訪問許可頁面。 有關如何開始使用 IronPDF 的更多說明，請造訪文件頁面。

Darrius Serrant
Darrius Serrant
  立即與工程團隊聊天
全棧軟件工程師 (WebOps)

Darrius Serrant 擁有邁阿密大學計算機科學學士學位，目前任職於 Iron Software 的全栈 WebOps 市場營銷工程師。從小就迷上編碼，他認為計算既神秘又可接近，是創意和解決問題的完美媒介。

在 Iron Software，Darrius 喜歡創造新事物，並簡化複雜概念以便於理解。作為我們的駐場開發者之一，他也自願教學生，分享他的專業知識給下一代。

對 Darrius 來說，工作令人滿意因為它被重視且有實際影響。

相關文章

30 天試用 → 完整產品。無限制。無卡。 開始免費試用