節點幫助

uuid NPM (對開發者而言如何運作)

介紹

UUID(全域唯一識別碼)套件是一個受歡迎的 NPM(Node 套件管理器)庫,用於在 JavaScript 應用程式中生成全域唯一識別碼(UUID)。 UUIDs 對於在資料庫中建立唯一鍵、會話識別符及其他用途非常有用。 稍後在本文中,我們還將探討來自Iron Software的 PDF 生成 Node.js 套件IronPDF。 這兩個庫都可以用來生成數據庫的唯一 ID,並可以以 PDF 格式存儲生成的 UUID 以供存檔。

主要功能

  1. RFC4122 合規性:UUID 套件支持創建符合 RFC4122 的 UUID,確保其具有全球唯一性和標準化。

  2. 多個 UUID 版本:它支持多種 UUID 版本,包括:

    • v1:基於時間戳的 UUID。

    • v3:基於命名空間的 UUID 使用 MD5 雜湊。

    • v4:隨機生成的 UUID。

    • v5:基於命名空間的UUID使用SHA-1雜湊。

    • v6: 基於時間戳的UUID,具有重新排序的字段以改善排序1
  3. 跨平台支持:該套件可在不同的環境中工作,包括 Node.js、React Native 和現代網頁瀏覽器。

  4. 零依賴:它具有小型化且無需依賴,使其輕量且易於整合到專案中。

  5. 加密強度高:所生成的UUID具有加密強度高的特性,確保高度安全性。

安裝

要安裝 uuid 套件,請使用以下命令行:

npm install uuid
or
yarn add uuid
npm install uuid
or
yarn add uuid
SHELL

基本用法

以下是使用 uuid 套件生成 UUID 字串的方法:

// Import syntax for uuid library
import { v4 as uuidv4 } from 'uuid';
// Generate a random UUID v4
const myUUID = uuidv4();
console.log(myUUID); // Example valid uuid: '9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d'
js
JAVASCRIPT

或者,使用 CommonJS 語法:

const { v4: uuidv4 } = require('uuid');
// Generate a random UUID (version 4)
const myUUID = uuidv4();
console.log(myUUID); // Example uuid string output: '1b9d6bcd-bbfd-4b2d-9b5d-ab8dfbbd4bed'
js
JAVASCRIPT

進階功能

  1. 基於命名空間的UUID:當您在項目頂部導入 uuid 時,您可以使用版本 3 或版本 5 根據命名空間和名稱創建 UUID。
import { v5 as uuidv5 } from 'uuid';
// Define a namespace UUID
const MY_NAMESPACE = '6ba7b810-9dad-11d1-80b4-00c04fd430c8';
// Generate UUID based on the namespace and a name
const myUUID = uuidv5('my-unique-name', MY_NAMESPACE);
console.log(myUUID); // Example output: 'e4eaaaf2-d142-11e1-b3e4-080027620cdd'
js
JAVASCRIPT
  1. 驗證和解析:UUID 套件還提供了驗證和解析 UUID 的功能:
import { validate as uuidValidate, parse as uuidParse } from 'uuid';
// Validate a UUID
const isValid = uuidValidate('9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d');
console.log(isValid); // true
// Convert UUID string to an array of bytes
const bytes = uuidParse('9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d');
console.log(bytes); // Uint8Array(16) [ 155, 29, 235, 77, 59, 125, 75, 173, 155, 221, 43, 13, 123, 61, 203, 109 ]
js
JAVASCRIPT

IronPDF 介紹

uuid NPM(它對開發人員的運作方式):圖 1 - IronPDF

IronPDF 是一個受歡迎的 PDF 生成庫,用於生成、編輯和轉換 PDF 文件。 IronPDF NPM 套件是專為 Node.js 應用程式設計的。 以下是關於 IronPDF NPM 套件的一些關鍵功能和詳細信息:

主要功能

HTML 轉 PDF

輕鬆將 HTML 內容轉換成 PDF 文件。 此功能特別適合從網頁內容生成動態 PDF。

URL 轉換為 PDF

直接從網址生成PDF,讓您可以程式化地捕獲網頁內容並將其保存為PDF文件。

PDF 操作

輕鬆合併、拆分和操作現有的 PDF 文件。 IronPDF 提供如附加頁面、拆分文檔等功能。

PDF 安全性

透過加密密碼或應用數位簽章來保護您的 PDF 文件。 IronPDF 提供選項來保護您的敏感文件免受未經授權的訪問。

高品質輸出

生成高品質的 PDF 文件,精確還原文字、圖像和格式。 IronPDF 確保您生成的 PDF 保持對原始內容的忠實性。

跨平台相容性

IronPDF 與多種平台兼容,包括 Windows、Linux 和 macOS,這使得它適合廣泛的開發環境。

簡單整合

輕鬆使用其 npm 套件將 IronPDF 集成到您的 Node.js 應用程式中。 API 有完善的文檔,使將 PDF 生成功能融入您的項目變得簡單明瞭。

安裝

要安裝 IronPDF NPM 套件,請使用以下指令:

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

使用IronPDF生成PDF文件和使用UUID NPM套件

UUID可以在應用程式中的許多地方使用。 在應用程式中,這是一個非常基本的部分。 UUID 可用作加密數據的秘密,這些秘密可以存儲在 PDF 文件中以用於歸檔目的。 下面,我們將看到一個例子,使用 IronPDF 生成不同版本的 UUID 並將其記錄在 PDF 文件中。

安裝依賴項:首先,使用以下命令創建一個新的 Next.js 項目(如果您還沒有創建的話):請參考這裡

npx create-next-app@latest uuid-pdf --use-npm --example "https://github.com/vercel/next-learn/tree/main/basics/learn-starter"
npx create-next-app@latest uuid-pdf --use-npm --example "https://github.com/vercel/next-learn/tree/main/basics/learn-starter"
SHELL

接著,導航至您的專案目錄:

cd uuid-pdf
cd uuid-pdf
SHELL

安裝所需的軟體包:

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

建立 PDF

現在,讓我們使用IronPDF創建一個生成PDF的簡單範例。

PDF 生成 API:第一步是創建一個後端 API 來生成 PDF 文件。 由於 IronPDF 只在伺服器端運行,我們需要創建一個 API,供用戶在需要生成 PDF 時調用。 在路徑 pages/api/pdf.js 中創建一個文件,並添加以下內容。

IronPDF 需要許可證密鑰,您可以從許可證頁面獲取,並將其放置在下面的代碼中。

// pages/api/pdf.js
import {IronPdfGlobalConfig, PdfDocument} from "@ironsoftware/ironpdf";
// Apply your IronPDF license key
IronPdfGlobalConfig.getConfig().licenseKey = "Your license key";
  export default async function handler(req, res) {
    try {
      const v4t = req.query.v4;
      const v5t = req.query.v5;
      const c = req.query.c;
      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>";
      const pdf = await PdfDocument.fromHtml(content);
      const data = await pdf.saveAsBuffer();
      console.error("data PDF:", data);
      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();
    }
  }
js
JAVASCRIPT

現在將 index.js 代碼修改如下以使用 UUID 和 IronPDF。

import Head from "next/head";
import styles from "../styles/Home.module.css";
import React, { useState, useEffect } from "react";
import { v4 as uuidv4 } from 'uuid';
import { v5 as uuidv5 } from 'uuid';
import { validate as uuidValidate, parse as uuidParse } from 'uuid';
export default function Home() {
  const [text, setText] = useState("");
  const myUUID = uuidv4();
  const MY_NAMESPACE = '6ba7b810-9dad-11d1-80b4-00c04fd430c8';
  const myV5UUID = uuidv5('IronPDF', MY_NAMESPACE);
  const generatePdf = async () => {
    try {
      const response = await fetch("/api/pdf-uuid?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");
      document.body.appendChild(link);
      link.click();
      link.parentNode.removeChild(link);
    } catch (error) {
      console.error("Error generating PDF:", error);
    }
  };
  const handleChange = (event) => {
    setText(event.target.value);
  };
  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>{" "}
        </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;
        }
        footer {
          width: 100%;
          height: 100px;
          border-top: 1px solid #eaeaea;
          display: flex;
          justify-content: center;
          align-items: center;
        }
        footer img {
          margin-left: 0.5rem;
        }
        footer a {
          display: flex;
          justify-content: center;
          align-items: center;
          text-decoration: none;
          color: inherit;
        }
        code {
          background: #fafafa;
          border-radius: 5px;
          padding: 0.75rem;
          font-size: 1.1rem;
          font-family:
            Menlo,
            Monaco,
            Lucida Console,
            Liberation Mono,
            DejaVu Sans Mono,
            Bitstream Vera Sans Mono,
            Courier New,
            monospace;
        }
      `}</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>
  );
}
js
JAVASCRIPT

程式碼說明

  1. 導入和初始設置:

    • next/head:用於修改 HTML 文件的

      以設置標題和網站圖標。

    • 從"../styles/Home.module.css"引入樣式:為組件導入本地CSS樣式。

    • React、useState、useEffect:進行狀態管理和處理副作用的基本 React 鉤子。
    • uuidv4、uuidv5、uuidValidate、uuidParse:從 UUID 套件導入的函數,用於 UUID 的生成、驗證和解析。
  2. 元件功能:

    • 狀態管理:

      • useState:管理用戶輸入 UUID 的文本輸入欄位的狀態。

      • 文本:儲存輸入欄位當前值的狀態變數。
    • UUID 生成:

      • uuidv4():生成一個隨機的 UUID 版本 4。

      • MY_NAMESPACE 和 uuidv5('IronPDF', MY_NAMESPACE): 根據給定的命名空間 (MY_NAMESPACE) 生成 UUID 版本 5。
    • PDF 生成 (generatePdf 函數):

      • 使用 fetch 呼叫 API 端點(/api/pdf-uuid)並附帶查詢參數(v4, v5, c)。

      • 將回應下載為 blob,為其創建一個 URL,並生成一個下載連結( 元素)。

      • 將連結附加到 DOM,點擊以開始下載,然後從 DOM 中移除。
    • 事件處理(handleChange 函數):

      • 當使用者在輸入欄位中鍵入時,更新文字狀態。
  3. 渲染方法:

    • 返回組件的 UI 結構的 JSX:

      • 包括標題(Head)、主部分(

        )和顯示UUID及用戶交互輸入欄位的各種段落。

      • generatePdf 函數綁定在按鈕點擊上以觸發 PDF 生成。
      • 在 Next.js 中,CSS 樣式可以使用 styled-jsx 本地定義(
        立即獲取您的免費30天試用金鑰
        謝謝。
        如果您想和我們的授權團隊聯系:

        有疑問嗎?聯絡我們的開發團隊。
        不需要信用卡或帳戶註冊