Chartjs Node.js は、強力で多岐にわたる JavaScript ライブラリであり、開発者が美しいチャートやグラフを簡単に作成できるツールです。

HTMLからPDFへの変換

HTMLコンテンツを簡単にPDFドキュメントに変換します。 この機能は、動的なPDFをウェブコンテンツから生成するのに特に便利です。

URLからPDFへの変換

URLから直接PDFを生成し、ウェブページのコンテンツをプログラム的にキャプチャしてPDFファイルとして保存することができます。

PDF操作

既存のPDFドキュメントを簡単にマージ、分割、および操作します。 IronPDFは、ページの追加やドキュメントの分割などの機能を提供します。

PDFのセキュリティ

パスワードで暗号化したりデジタル署名を適用したりしてPDFドキュメントを保護します。 IronPDFは、機密文書の不正アクセスから保護するためのオプションを提供します。

高品質出力

テキスト、画像、およびフォーマットの正確なレンダリングを備えた高品質のPDFドキュメントを作成します。 IronPDFは、生成されたPDFが元のコンテンツの忠実度を保つことを保証します。

クロスプラットフォーム互換性

IronPDFは、Windows、Linux、macOSを含む様々なプラットフォームと互換性があり、幅広い開発環境に適しています。

シンプルな統合

npmパッケージを使用してNode.jsアプリケーションにIronPDFを簡単に統合します。 APIは十分に文書化されており、プロジェクトにPDF生成機能を組み込むのが簡単です。

インストール

IronPDF NPMパッケージをインストールするには、次のコマンドを使用してください。

yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64

yarn add @ironsoftware/ironpdf @ironsoftware/ironpdf-engine-windows-x64

PDFを作成する

では、IronPDFを使用してPDFを生成する簡単な例を作成しましょう。

PDF 生成 API:最初のステップは、PDF ドキュメントを生成するためのバックエンド API を作成することです。 IronPDFはサーバー側でのみ実行されるため、ユーザーがPDFを生成したいときに呼び出すAPIを作成する必要があります。 パスpages/api/pdf.jsにファイルを作成し、以下の内容を追加します。

IronPDFはライセンスキーを必要とします。ライセンスページから入手し、以下のコードに配置してください。

// pages/api/pdf.js
import { IronPdfGlobalConfig, PdfDocument } from "@ironsoftware/ironpdf";
import { validate as uuidValidate } from 'uuid';

// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Your license key";

export default async function handler(req, res) {
  try {
    // Extract query parameters from request
    const v4t = req.query.v4;
    const v5t = req.query.v5;
    const c = req.query.c;

    // Prepare HTML content for PDF
    let content = "<h1>Demo UUID and Generate PDF Using IronPDF</h1>";
    content += "<p>V4 UUID: " + v4t + "</p>";
    content += "<p>V5 UUID: " + v5t + "</p>";
    content += "<p>Is UUID: " + c + ", Valid: " + uuidValidate(c).toString() + "</p>";

    // Generate PDF document
    const pdf = await PdfDocument.fromHtml(content);
    const data = await pdf.saveAsBuffer();
    console.log("PDF generated successfully.");

    // Set the response headers and send the PDF as a response
    res.setHeader("Content-Type", "application/pdf");
    res.setHeader("Content-Disposition", "attachment; filename=awesomeIron.pdf");
    res.send(data);
  } catch (error) {
    console.error("Error generating PDF:", error);
    res.status(500).end();
  }
}

// pages/api/pdf.js
import { IronPdfGlobalConfig, PdfDocument } from "@ironsoftware/ironpdf";
import { validate as uuidValidate } from 'uuid';

// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Your license key";

export default async function handler(req, res) {
  try {
    // Extract query parameters from request
    const v4t = req.query.v4;
    const v5t = req.query.v5;
    const c = req.query.c;

    // Prepare HTML content for PDF
    let content = "<h1>Demo UUID and Generate PDF Using IronPDF</h1>";
    content += "<p>V4 UUID: " + v4t + "</p>";
    content += "<p>V5 UUID: " + v5t + "</p>";
    content += "<p>Is UUID: " + c + ", Valid: " + uuidValidate(c).toString() + "</p>";

    // Generate PDF document
    const pdf = await PdfDocument.fromHtml(content);
    const data = await pdf.saveAsBuffer();
    console.log("PDF generated successfully.");

    // Set the response headers and send the PDF as a response
    res.setHeader("Content-Type", "application/pdf");
    res.setHeader("Content-Disposition", "attachment; filename=awesomeIron.pdf");
    res.send(data);
  } catch (error) {
    console.error("Error generating PDF:", error);
    res.status(500).end();
  }
}

次に、UUIDとIronPDFを使用するためにindex.jsコードを以下のように修正します。

import Head from "next/head";
import styles from "../styles/Home.module.css";
import React, { useState } from "react";
import { v4 as uuidv4, v5 as uuidv5, validate as uuidValidate } from 'uuid';

export default function Home() {
  const [text, setText] = useState("");

  // Generate UUIDs for demonstration
  const myUUID = uuidv4();
  const MY_NAMESPACE = '6ba7b810-9dad-11d1-80b4-00c04fd430c8';
  const myV5UUID = uuidv5('IronPDF', MY_NAMESPACE);

  // Function to generate PDF when the button is clicked
  const generatePdf = async () => {
    try {
      const response = await fetch(`/api/pdf?v4=${myUUID}&v5=${myV5UUID}&c=${text}`);
      const blob = await response.blob();
      const url = window.URL.createObjectURL(new Blob([blob]));
      const link = document.createElement("a");
      link.href = url;
      link.setAttribute("download", "awesomeIron.pdf");

      // Append, click and remove the link to download the PDF
      document.body.appendChild(link);
      link.click();
      link.parentNode.removeChild(link);
    } catch (error) {
      console.error("Error generating PDF:", error);
    }
  };

  // Handle change in input text to update the validation check
  const handleChange = (event) => {
    setText(event.target.value);
  };

  // Render the component
  return (
    <div className={styles.container}>
      <Head>
        <title>Generate PDF Using IronPDF</title>
        <link rel="icon" href="/favicon.ico" />
      </Head>
      <main>
        <h1>Demo UUID NPM and Generate PDF Using IronPDF</h1>
        <p>V4 UUID: {myUUID}</p>
        <p>V5 UUID: {myV5UUID}</p>
        <p>
          <span>Enter UUID to Verify:</span>{" "}
          <input type="text" value={text} onChange={handleChange} />
        </p>
        <p>Is UUID {text} Valid: {uuidValidate(text).toString()}</p>
        <button style={{margin: 20, padding: 5}} onClick={generatePdf}>
          Generate PDF 
        </button>
      </main>
      <style jsx>{`
        main {
          padding: 5rem 0;
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
        }
      `}</style>
      <style jsx global>{`
        html,
        body {
          padding: 0;
          margin: 0;
          font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
            Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue,
            sans-serif;
        }
        * {
          box-sizing: border-box;
        }
      `}</style>
    </div>
  );
}

import Head from "next/head";
import styles from "../styles/Home.module.css";
import React, { useState } from "react";
import { v4 as uuidv4, v5 as uuidv5, validate as uuidValidate } from 'uuid';

export default function Home() {
  const [text, setText] = useState("");

  // Generate UUIDs for demonstration
  const myUUID = uuidv4();
  const MY_NAMESPACE = '6ba7b810-9dad-11d1-80b4-00c04fd430c8';
  const myV5UUID = uuidv5('IronPDF', MY_NAMESPACE);

  // Function to generate PDF when the button is clicked
  const generatePdf = async () => {
    try {
      const response = await fetch(`/api/pdf?v4=${myUUID}&v5=${myV5UUID}&c=${text}`);
      const blob = await response.blob();
      const url = window.URL.createObjectURL(new Blob([blob]));
      const link = document.createElement("a");
      link.href = url;
      link.setAttribute("download", "awesomeIron.pdf");

      // Append, click and remove the link to download the PDF
      document.body.appendChild(link);
      link.click();
      link.parentNode.removeChild(link);
    } catch (error) {
      console.error("Error generating PDF:", error);
    }
  };

  // Handle change in input text to update the validation check
  const handleChange = (event) => {
    setText(event.target.value);
  };

  // Render the component
  return (
    <div className={styles.container}>
      <Head>
        <title>Generate PDF Using IronPDF</title>
        <link rel="icon" href="/favicon.ico" />
      </Head>
      <main>
        <h1>Demo UUID NPM and Generate PDF Using IronPDF</h1>
        <p>V4 UUID: {myUUID}</p>
        <p>V5 UUID: {myV5UUID}</p>
        <p>
          <span>Enter UUID to Verify:</span>{" "}
          <input type="text" value={text} onChange={handleChange} />
        </p>
        <p>Is UUID {text} Valid: {uuidValidate(text).toString()}</p>
        <button style={{margin: 20, padding: 5}} onClick={generatePdf}>
          Generate PDF 
        </button>
      </main>
      <style jsx>{`
        main {
          padding: 5rem 0;
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
        }
      `}</style>
      <style jsx global>{`
        html,
        body {
          padding: 0;
          margin: 0;
          font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
            Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue,
            sans-serif;
        }
        * {
          box-sizing: border-box;
        }
      `}</style>
    </div>
  );
}