メッセージアイコン
  1. Node.js 用 IronPDF
  2. IronPDF for Node.js ブログ
  3. ノードヘルプ
  4. sockjs NPM
ノードヘルプ

sockjs NPM (開発者のための仕組み)

Darrius Serrant
Darrius Serrant
2024年10月24日
共有:

イントロダクション

SockJSとIronPDFはオンラインアプリケーションを構築する上で異なるが補完的な役割を果たす。 SockJSというJavaScriptパッケージは、HTTPを使用してクライアントとサーバー間の双方向通信を可能にするAPIを提供し、WebSocketに似ています。 Node.jsは、ウェブブラウザとサーバーがリアルタイムでイベントを通じて通信することを可能にし、チャットルーム、ライブニュース、チームワークツールなどのアプリの使用を可能にします。 しかしながら、Node.jsの設定において、IronPDFはプログラム的にPDFドキュメントを作成・修正するための強力なJavaScriptライブラリです。

IronPDFはPDFドキュメントを動的に作成し管理することができますが、SockJSクライアントはクロスドメイン通信チャネルを通してオンラインアプリケーションのリアルタイムデータ交換とコラボレーション機能を管理します。 SockJSサーバーとIronPDFを統合することで、開発者はダイナミックなデータやユーザーインタラクションに基づいてPDFドキュメントを簡単に生成し、提供することができます。 この組み合わせにより、開発者は、リアルタイムのコミュニケーションとダイナミックなPDF作成の両方を利用することで、ドキュメント集約型のアプリケーションや共同作業プラットフォームなど、さまざまなユースケースをサポートする洗練されたオンラインアプリを設計することができます。

SockJS NPMとは何ですか？

SockJSは、Webクライアントとサーバー間のリアルタイムで双方向の通信を促進するブラウザー側のJavaScriptライブラリです。 WebSocketを抽象化し、HTTPロングポーリングやXHRストリーミングなどの代替トランスポートプロトコルへのフォールバックメカニズムを提供し、さまざまなWebブラウザや環境での互換性を保証します。 接続の確立と管理、および接続のオープン、メッセージの受信、クローズなどのイベントを処理するための、わかりやすいJavaScript APIを提供します。 さらに、SockJSにはテストやデバッグを目的としたコマンドラインクライアントが含まれており、開発環境と本番環境の両方で多目的に使用できます。 全体として、SockJS JavaScriptオブジェクトは、Webアプリケーションのリアルタイム機能の実装を簡素化し、スケーラブルで応答性の高い通信チャネルをサポートします。

sockjs NPM (開発者にとっての仕組み): 図1 - SockJS

SockJSの主な特徴

クロスブラウザ互換性

SockJSは、多くのウェブブラウザや環境で一貫した動作と機能を保証します。

フォールバックメカニズム

WebSocket接続が利用できなかったり、失敗した場合、SockJSは透過的にHTTPロングポーリング、XHRストリーミング、あるいはJSONPポーリングなどの他のトランスポートプロトコルに切り替えることができます。

リアルタイムコミュニケーション

それは、サーバーサイドアプリケーション（通常はNode.jsや他のサーバーサイド技術を使用）とクライアントサイドのJavaScriptアプリ（ウェブブラウザで実行）がリアルタイムかつイベント駆動型で通信することを可能にします。

使いやすさ

SockJSはWebSocketと同等の分かりやすいAPIを提供しているため、開発者は簡単にプロジェクトに組み込んで利用することができます。

スケーラビリティ

SockJSは、複数のトランスポート・プロトコルとフォールバック技術をサポートすることで、多数の同時接続とさまざまなネットワーク状況を管理できるスケーラブルなアプリの開発を容易にします。

統合の容易さ

複雑な低レベルのネットワークプログラミングを必要とせずに、開発者がウェブアプリケーションに組み込むことができるシンプルなAPIを提供することで、リアルタイム機能の実装を容易にします。

トランスポートプロトコルの抽象化:

WebSocket、HTTPロングポーリング、その他の基礎となるトランスポート・プロトコルは、SockJSによって抽象化されています。 その適応性により、WebSocket接続が制限されたり利用できない状況でも、信頼できる通信が保証されます。

SockJSの作成と設定

オンラインアプリケーションでリアルタイム通信を構築および構成するには、通常、クライアント側（ウェブブラウザ内）とサーバー側（Node.jsのようなブラウザまたはサーバーフレームワークを使用）の両方でSockJSを設定する必要があります。 以下はSockJSの作成と設定の基本的なハウツーです：

SockJSのインストール

SockJSはNPMを使用してインストールするか、CDN経由で直接含めることができます：

npm install sockjs-client
npm install sockjs-client
SHELL

HTMLにSockJSを含める

作成する HTML ファイルに SockJS JavaScript ライブラリを含めます：

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

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>
      const sock = new SockJS("http://localhost:3000/socket");
      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 of sending 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>
      const sock = new SockJS("http://localhost:3000/socket");
      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 of sending 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 Serveの設定

Node.js サーバで、SockJS を設定します：

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();
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}`);
});
js
JAVASCRIPT

サーバーサイドのコードは、アプリケーションの要件に合わせてカスタマイズし、すでに使用しているサーバーフレームワークや構成で動作するようにしてください。

sockjs NPM（開発者のための仕組み）：図3 - SockJSサーバーの適合設定出力

クロスオリジンリクエスト (CORS): サーバーとクライアントが異なるドメインにある場合、CORS設定を効果的に処理するテストサーバーに注意してください。

エラーハンドリング: アプリケーションの仕様に従い、ブラウザ制限内でエラーハンドリングとセキュリティ対策（認証や承認など）を実装します。

デプロイメント: セキュアな接続のためにHTTPSを設定し、デプロイメント環境向けにSockJSとサーバーを構成します。

この構成は、SockJSを使用して、ウェブクライアントとウェブサーバー間のリアルタイム通信を確立するための基本的な基礎を提供します。 特定のアプリケーションの要件やアーキテクチャによっては、調整が必要になることがあります。

はじめに

SockJSのリアルタイム通信機能を利用し、ダイナミックPDF作成のためにIronPDFを統合したウェブアプリケーションをセットアップすることは、SockJSとIronPDFを使い始める第一歩です。 これが出発点のガイドです：

IronPDFとは何ですか？

強力なNode.jsツールであるIronPDFは、HTMLデータを非常に高品質なPDFファイルに変換するために設計されています。 元のウェブコンテンツを犠牲にすることなく、HTML、CSS、その他のJavaScriptファイルを正しくフォーマットされたPDFに変換するプロセスを迅速化します。 レポート、請求書、認証書のような動的で印刷可能な書類を生成する必要があるウェブアプリケーションにとって、これは非常に役立つツールです。

カスタマイズ可能なページ設定、ヘッダー、フッター、フォントや画像の追加機能は、IronPDFの機能のほんの一部です。 それは複雑なレイアウトやスタイルを処理して、すべてのテストPDF出力が要件を満たすことを保証します。 さらに、IronPDFはHTML内でJavaScriptの実行を管理し、正確な動的およびインタラクティブなコンテンツのレンダリングを可能にします。

sockjs NPM（開発者向けの仕組み）：図4 - IronPDF

IronPDFの機能

1. HTMLからのPDF生成

JavaScript、HTML、CSSをPDFに変換。 メディアクエリとレスポンシブデザインをサポート。 PDFのレポート、請求書、ドキュメントをHTMLとCSSで動的に装飾するのに便利です。

PDF編集

既存のPDFにテキスト、写真、その他のコンテンツを追加することができます。 PDFファイルからテキストと画像を取り出します。 多数のPDFを1つのファイルにまとめる。PDFファイルを複数の別々のペーパーに分割します。 透かし、注釈、ヘッダー、フッターを含む。

3. パフォーマンスと信頼性

高い性能と信頼性は、産業環境において望まれる設計品質である。 大きな文書セットも簡単に管理。

IronPDF をインストール

Node.jsプロジェクトでPDFを扱うために必要なツールを得るためにIronPDFパッケージをインストールしてください。 コマンドラインに以下のコードを追加してください。

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

SockJSとIronPDFの組み合わせ

PDF生成のリクエストを処理し、クライアント接続を管理するために、Node.jsサーバ上でSockJSを構成します：

// server.js
const http = require("http");
const sockjs = require("sockjs");
const IronPdf = require("@ironsoftware/ironpdf");
var config = IronPdf.IronPdfGlobalConfig;
config.setConfig({
  licenseKey:
    "",
});
// Create a SockJS server
const sockjsServer = sockjs.createServer();
// Attach the 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}`);
});
js
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>
        const sock = new SockJS('http://localhost:3000/socket');
        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 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 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>
        const sock = new SockJS('http://localhost:3000/socket');
        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 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 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

サーバーサイド: SockJSサーバー (sockjsServer) は Node.js サーバーによって設定され、/socket ポートでの接続を監視します。 それは、受信メッセージ（PDF生成リクエスト）を処理するために generatePdf() 関数を呼び出すために IronPDF (IronPdf.PdfDocument) を使用します。 PDFを生成した後、SockJS接続を使用して、base64エンコードされたPDFデータをクライアントに送り返します。

sockjs NPM（開発者向けの仕組み）：図5 - SockJSクライアントソースコード出力

クライアント側: クライアントはSockJS接続（sock）を介してサーバーに接続し、onopen、onmessage、およびoncloseのようなイベントを監視します。 ユーザーは、「PDFを生成」ボタンをクリックしたときに、sock.send(htmlContent)を使用してサーバーにHTMLコンテンツ（htmlContent）を送信し、PDFを生成します。 サーバーからPDFデータを取得した後、両方のクライアントにPDFを表示またはダウンロードします（sock.onmessage）。

sockjs NPM (開発者向けの仕組み): 図6 - クライアント側の出力

以下は、コードから生成された出力です。

sockjs NPM (開発者向けの仕組み): 図 7 - PDF 出力

結論

SockJSがリアルタイム通信に使われ、IronPDFがダイナミックPDF作成に使われるとき、ウェブアプリケーション開発において強力な相乗効果が生まれます。 SockJSを使用すると、クライアントとサーバー間の双方向通信が容易になり、インタラクティブなコラボレーションやリアルタイム更新などの機能が可能になります。 しかし、IronPdfはプログラマーにプログラムでPDFドキュメントを作成・修正する機能を提供します。 HTMLテキストをPDFに動的に変換することもできます。

ユーザーの入力やリアルタイムのデータ更新に応じて瞬時にPDF文書を作成するような複雑なWebアプリケーションは、これらの技術の統合によって可能になります。 リアルタイムのドキュメント生成、グループ編集、インタラクティブなレポート機能を必要とするアプリケーションでは、この統合が特に役立ちます。 瞬時のアップデートのためのSockJSとダイナミックなPDF作成のためのIronPDFの利用を通して、開発者はユーザーエクスペリエンスを最適化し、ワークフローを最適化し、本格的なSockJSユーザーのために様々なビジネス要件を満たす弾力性のあるソリューションを提供することができます。

Node.jsアプリの開発ツールキットの実用性を向上させるために、IronPDFを利用して、OCR、バーコードスキャニング、PDF作成、Excelとの連携、その他多数の機能を追加できます。 Iron Software の高い構成可能なシステムと、コミュニティでサポートされている豊富なプラグインライブラリにより、開発者は機能やWebアプリケーションをより迅速に構築できます。

開発者は、IronPDF の多くの機能を無料のトライアルライセンスと、購入を検討する前に企業から提供されるさまざまなコードサンプルとともに利用できます。 IronPDFの永久ライセンスについての詳細はライセンスページをご覧ください。 IronPDFの使い方についてはドキュメントページをご覧ください。

Darrius Serrant
Darrius Serrant
  今すぐエンジニアリングチームとチャット
フルスタックソフトウェアエンジニア（WebOps）

Darrius Serrantは、マイアミ大学でコンピュータサイエンスの学士号を取得しており、Iron SoftwareでフルスタックWebOpsマーケティングエンジニアとして働いています。若い頃からコーディングに魅了され、コンピューティングを神秘的でありながらアクセスしやすいものと見なし、それが創造性と問題解決のための完璧な媒体であると感じました。

Iron Softwareでは、新しいものを作り出し、複雑な概念を簡単にすることでより理解しやすくすることを楽しんでいます。彼は常駐の開発者の一人として、学生に教えることを志願し、自分の専門知識を次世代と共有しています。

Darriusにとって、彼の仕事は評価され、実際に影響があることで充実しています。

< 以前
browserify NPM (開発者のための仕組み)
次へ >
JsdomNPM (開発者のための仕組み)

npmでインストール

バージョン:2025.5

> npm i @ironsoftware/ironpdf

問題を報告

準備はできましたか？ バージョン: 2025.5 新発売

無料で始める
npm ダウンロード 無料トライアルを開始
ライセンスを表示 >
Experience the full power of IronPDF 無料トライアルを開始
Textlogo Iron Suite related to sockjs NPM (開発者のための仕組み)

IronPDF は IRONSUITE の一部です。

10 .NET API製品オフィスドキュメントのために

2つの価格で10製品を手に入れよう   無料トライアルを開始