From c2288fd6eb23687adff033aa9f97a94019d68032 Mon Sep 17 00:00:00 2001 From: xiaoming0000 <1925952439@qq.com> Date: Tue, 9 Jun 2026 15:58:18 +0800 Subject: [PATCH 1/2] feat: add X509 certificate generator tool - Add self-signed X509 certificate generator with customizable parameters - Support multiple domains (comma-separated) with SAN extension - Support email, DNS names, and IP addresses in SAN - Use SHA256 signing algorithm - Add UUID-based serial number - Include basicConstraints extension (cA: true) - Add country code selector with search and manual input - Support internationalization (en, zh, de, no, vi) - Add HTTPS server usage example - Add regenerate keys functionality --- components.d.ts | 25 +- locales/de.yml | 29 + locales/en.yml | 30 ++ locales/no.yml | 30 ++ locales/vi.yml | 30 ++ locales/zh.yml | 32 +- .../command-palette/command-palette.vue | 2 +- src/tools/index.ts | 3 +- .../https-server-example.ts | 59 ++ src/tools/x509-certificate-generator/index.ts | 12 + .../x509-certificate-generator.service.ts | 125 +++++ .../x509-certificate-generator.vue | 509 ++++++++++++++++++ src/ui/c-select/c-select.vue | 2 +- src/ui/c-table/c-table.vue | 2 +- 14 files changed, 883 insertions(+), 7 deletions(-) create mode 100644 src/tools/x509-certificate-generator/https-server-example.ts create mode 100644 src/tools/x509-certificate-generator/index.ts create mode 100644 src/tools/x509-certificate-generator/x509-certificate-generator.service.ts create mode 100644 src/tools/x509-certificate-generator/x509-certificate-generator.vue diff --git a/components.d.ts b/components.d.ts index 3e65c3cc52..8a0d4b87dc 100644 --- a/components.d.ts +++ b/components.d.ts @@ -91,6 +91,7 @@ declare module '@vue/runtime-core' { IbanValidatorAndParser: typeof import('./src/tools/iban-validator-and-parser/iban-validator-and-parser.vue')['default'] 'IconMdi:brushVariant': typeof import('~icons/mdi/brush-variant')['default'] 'IconMdi:kettleSteamOutline': typeof import('~icons/mdi/kettle-steam-outline')['default'] + IconMdiArrowRightBottom: typeof import('~icons/mdi/arrow-right-bottom')['default'] IconMdiChevronDown: typeof import('~icons/mdi/chevron-down')['default'] IconMdiChevronRight: typeof import('~icons/mdi/chevron-right')['default'] IconMdiClose: typeof import('~icons/mdi/close')['default'] @@ -98,6 +99,7 @@ declare module '@vue/runtime-core' { IconMdiEye: typeof import('~icons/mdi/eye')['default'] IconMdiEyeOff: typeof import('~icons/mdi/eye-off')['default'] IconMdiHeart: typeof import('~icons/mdi/heart')['default'] + IconMdiRefresh: typeof import('~icons/mdi/refresh')['default'] IconMdiSearch: typeof import('~icons/mdi/search')['default'] IconMdiTranslate: typeof import('~icons/mdi/translate')['default'] IconMdiTriangleDown: typeof import('~icons/mdi/triangle-down')['default'] @@ -129,20 +131,38 @@ declare module '@vue/runtime-core' { MenuLayout: typeof import('./src/components/MenuLayout.vue')['default'] MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default'] MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default'] + NAlert: typeof import('naive-ui')['NAlert'] NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default'] - NCheckbox: typeof import('naive-ui')['NCheckbox'] + NCode: typeof import('naive-ui')['NCode'] NCollapseTransition: typeof import('naive-ui')['NCollapseTransition'] + NColorPicker: typeof import('naive-ui')['NColorPicker'] NConfigProvider: typeof import('naive-ui')['NConfigProvider'] + NDatePicker: typeof import('naive-ui')['NDatePicker'] NDivider: typeof import('naive-ui')['NDivider'] NEllipsis: typeof import('naive-ui')['NEllipsis'] + NForm: typeof import('naive-ui')['NForm'] + NFormItem: typeof import('naive-ui')['NFormItem'] + NGi: typeof import('naive-ui')['NGi'] + NGrid: typeof import('naive-ui')['NGrid'] NH1: typeof import('naive-ui')['NH1'] + NH2: typeof import('naive-ui')['NH2'] NH3: typeof import('naive-ui')['NH3'] NIcon: typeof import('naive-ui')['NIcon'] + NImage: typeof import('naive-ui')['NImage'] + NInput: typeof import('naive-ui')['NInput'] + NInputGroup: typeof import('naive-ui')['NInputGroup'] + NInputGroupLabel: typeof import('naive-ui')['NInputGroupLabel'] + NInputNumber: typeof import('naive-ui')['NInputNumber'] NLayout: typeof import('naive-ui')['NLayout'] NLayoutSider: typeof import('naive-ui')['NLayoutSider'] NMenu: typeof import('naive-ui')['NMenu'] - NSpace: typeof import('naive-ui')['NSpace'] + NProgress: typeof import('naive-ui')['NProgress'] + NScrollbar: typeof import('naive-ui')['NScrollbar'] + NSelect: typeof import('naive-ui')['NSelect'] + NSlider: typeof import('naive-ui')['NSlider'] + NSwitch: typeof import('naive-ui')['NSwitch'] NTable: typeof import('naive-ui')['NTable'] + NTag: typeof import('naive-ui')['NTag'] NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default'] OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default'] PasswordStrengthAnalyser: typeof import('./src/tools/password-strength-analyser/password-strength-analyser.vue')['default'] @@ -186,6 +206,7 @@ declare module '@vue/runtime-core' { UserAgentResultCards: typeof import('./src/tools/user-agent-parser/user-agent-result-cards.vue')['default'] UuidGenerator: typeof import('./src/tools/uuid-generator/uuid-generator.vue')['default'] WifiQrCodeGenerator: typeof import('./src/tools/wifi-qr-code-generator/wifi-qr-code-generator.vue')['default'] + X509CertificateGenerator: typeof import('./src/tools/x509-certificate-generator/x509-certificate-generator.vue')['default'] XmlFormatter: typeof import('./src/tools/xml-formatter/xml-formatter.vue')['default'] XmlToJson: typeof import('./src/tools/xml-to-json/xml-to-json.vue')['default'] YamlToJson: typeof import('./src/tools/yaml-to-json-converter/yaml-to-json.vue')['default'] diff --git a/locales/de.yml b/locales/de.yml index 0ccdb71d95..ff080dc9d0 100644 --- a/locales/de.yml +++ b/locales/de.yml @@ -97,6 +97,35 @@ tools: description: >- Ermittle die Stärke deines Passworts mit diesem Client-seitigen Passwortstärken-Analysator und Tool zur Schätzung der Knackzeit. + x509-certificate-generator: + title: X509-Zertifikat-Generator + description: Erstellen Sie selbstsignierte X509-Zertifikate mit anpassbaren Parametern. Erstellen Sie Root-CA-Zertifikate für Entwicklung und Tests. + + commonName: Allgemeiner Name (CN) + country: Land (C) + stateOrProvince: Bundesland/Provinz (ST) + locality: Ort (L) + organization: Organisation (O) + organizationalUnit: Organisationseinheit (OU) + email: E-Mail + validFrom: Gültig ab + validTo: Gültig bis + regenerateKeys: Schlüssel neu generieren + certificate: Zertifikat + privateKey: Privater Schlüssel + download: Herunterladen + commonNamePlaceholder: example.com + countryPlaceholder: DE + stateOrProvincePlaceholder: Bayern + localityPlaceholder: München + organizationPlaceholder: Meine Firma + organizationalUnitPlaceholder: IT-Abteilung + emailPlaceholder: 'admin [at] example.com' + requiredField: '{field} ist erforderlich' + countryMustBe2Letters: Land muss ein 2-Buchstaben-ISO-Code sein + invalidEmailFormat: Ungültiges E-Mail-Format + endDateMustBeAfterStart: Enddatum muss nach dem Startdatum liegen + fillRequiredFields: Bitte füllen Sie die Pflichtfelder korrekt aus, um das Zertifikat zu generieren. chronometer: title: Chronometer description: >- diff --git a/locales/en.yml b/locales/en.yml index d03d80d3f6..e955181c61 100644 --- a/locales/en.yml +++ b/locales/en.yml @@ -75,6 +75,36 @@ tools: title: Password strength analyser description: Discover the strength of your password with this client-side-only password strength analyser and crack time estimation tool. + x509-certificate-generator: + title: X509 Certificate Generator + description: Generate self-signed X509 certificates with customizable parameters. Create root CA certificates for development and testing. + + commonName: Common Name (CN) + country: Country (C) + stateOrProvince: State/Province (ST) + locality: Locality (L) + organization: Organization (O) + organizationalUnit: Organizational Unit (OU) + email: Email + validFrom: Valid From + validTo: Valid To + regenerateKeys: Regenerate Keys + certificate: Certificate + privateKey: Private Key + download: Download + commonNamePlaceholder: example.com + countryPlaceholder: US + stateOrProvincePlaceholder: California + localityPlaceholder: San Francisco + organizationPlaceholder: My Company + organizationalUnitPlaceholder: IT Department + emailPlaceholder: 'admin [at] example.com' + requiredField: '{field} is required' + countryMustBe2Letters: Country must be a 2-letter ISO code + invalidEmailFormat: Invalid email format + endDateMustBeAfterStart: End date must be after start date + fillRequiredFields: Please fill in the required fields correctly to generate the certificate. + chronometer: title: Chronometer description: Monitor the duration of a thing. Basically a chronometer with simple chronometer features. diff --git a/locales/no.yml b/locales/no.yml index ba4f9e471c..b9cd525de0 100644 --- a/locales/no.yml +++ b/locales/no.yml @@ -75,6 +75,36 @@ tools: title: Analyseverktøy for passordstyrke description: Oppdag styrken av passordet ditt med dette kun-klient-maskin passordstyrke analyse verktøyet og se den estimerte knekketiden. + x509-certificate-generator: + title: X509-sertifikatgenerator + description: Generer selvsignerte X509-sertifikater med tilpassbare parametere. Opprett rot-CA-sertifikater for utvikling og testing. + + commonName: Vanlig navn (CN) + country: Land (C) + stateOrProvince: Stat/Provins (ST) + locality: Sted (L) + organization: Organisasjon (O) + organizationalUnit: Organisasjonsenhet (OU) + email: E-post + validFrom: Gyldig fra + validTo: Gyldig til + regenerateKeys: Regenerer nøkler + certificate: Sertifikat + privateKey: Privat nøkkel + download: Last ned + commonNamePlaceholder: example.com + countryPlaceholder: NO + stateOrProvincePlaceholder: California + localityPlaceholder: San Francisco + organizationPlaceholder: Mitt Selskap + organizationalUnitPlaceholder: IT-avdeling + emailPlaceholder: 'admin [at] example.com' + requiredField: '{field} er påkrevd' + countryMustBe2Letters: Land må være en 2-bokstavers ISO-kode + invalidEmailFormat: Ugyldig e-postformat + endDateMustBeAfterStart: Sluttdato må være etter startdato + fillRequiredFields: Vennligst fyll ut de obligatoriske feltene korrekt for å generere sertifikatet. + chronometer: title: Kronometer description: Overvåk varigheten av noe. I bunn og grunn et kronometer med enkle funksjoner. diff --git a/locales/vi.yml b/locales/vi.yml index 59514cd758..285a40a91c 100644 --- a/locales/vi.yml +++ b/locales/vi.yml @@ -75,6 +75,36 @@ tools: title: Bộ phân tích độ mạnh mật khẩu description: Khám phá độ mạnh của mật khẩu của bạn với công cụ phân tích độ mạnh mật khẩu chỉ chạy trên phía máy khách và ước tính thời gian phá mật khẩu. + x509-certificate-generator: + title: Trình tạo chứng chỉ X509 + description: Tạo chứng chỉ X509 tự ký với các thông số có thể tùy chỉnh. Tạo chứng chỉ root CA cho phát triển và kiểm thử. + + commonName: Tên chung (CN) + country: Quốc gia (C) + stateOrProvince: Tỉnh/Bang (ST) + locality: Địa phương (L) + organization: Tổ chức (O) + organizationalUnit: Đơn vị tổ chức (OU) + email: Email + validFrom: Có hiệu lực từ + validTo: Có hiệu lực đến + regenerateKeys: Tạo lại khóa + certificate: Chứng chỉ + privateKey: Khóa riêng + download: Tải xuống + commonNamePlaceholder: example.com + countryPlaceholder: VN + stateOrProvincePlaceholder: California + localityPlaceholder: San Francisco + organizationPlaceholder: Công ty của tôi + organizationalUnitPlaceholder: Bộ phận IT + emailPlaceholder: 'admin [at] example.com' + requiredField: '{field} là bắt buộc' + countryMustBe2Letters: Quốc gia phải là mã ISO 2 chữ cái + invalidEmailFormat: Định dạng email không hợp lệ + endDateMustBeAfterStart: Ngày kết thúc phải sau ngày bắt đầu + fillRequiredFields: Vui lòng điền đúng các trường bắt buộc để tạo chứng chỉ. + chronometer: title: Đồng hồ bấm giờ description: Giám sát thời gian của một sự việc. Cơ bản là một đồng hồ bấm giờ với các tính năng đơn giản. diff --git a/locales/zh.yml b/locales/zh.yml index 97968eb5ef..d521da743f 100644 --- a/locales/zh.yml +++ b/locales/zh.yml @@ -73,7 +73,37 @@ tools: password-strength-analyser: title: 密码强度分析仪 - description: 使用此密码强度分析器和破解时间估计工具来发现密码的强度。 + description: 使用此密码强度分析���和破解时间估计工具来发现密码的强度。 + + x509-certificate-generator: + title: X509证书生成器 + description: 生成具有可自定义参数的自签名X509证书。为开发和测试创建根CA证书。 + + commonName: 通用名称 (CN) + country: 国家 (C) + stateOrProvince: 省/州 (ST) + locality: 地区 (L) + organization: 组织 (O) + organizationalUnit: 组织单位 (OU) + email: 邮箱 + validFrom: 有效期从 + validTo: 有效期到 + regenerateKeys: 重新生成密钥 + certificate: 证书 + privateKey: 私钥 + download: 下载 + commonNamePlaceholder: example.com + countryPlaceholder: US + stateOrProvincePlaceholder: 加利福尼亚 + localityPlaceholder: 旧金山 + organizationPlaceholder: 我的公司 + organizationalUnitPlaceholder: IT部门 + emailPlaceholder: 'admin [at] example.com' + requiredField: '{field}是必填项' + countryMustBe2Letters: 国家必须是2字母ISO代码 + invalidEmailFormat: 无效的邮箱格式 + endDateMustBeAfterStart: 结束日期必须晚于开始日期 + fillRequiredFields: 请正确填写必填字段以生成证书。 chronometer: title: 计时器 diff --git a/src/modules/command-palette/command-palette.vue b/src/modules/command-palette/command-palette.vue index bceef5cdcd..5d953fee2e 100644 --- a/src/modules/command-palette/command-palette.vue +++ b/src/modules/command-palette/command-palette.vue @@ -128,7 +128,7 @@ function activateOption(option: PaletteOption) {
-
+
{{ category }}
diff --git a/src/tools/index.ts b/src/tools/index.ts index 388cfaf494..8821effc8b 100644 --- a/src/tools/index.ts +++ b/src/tools/index.ts @@ -81,6 +81,7 @@ import { tool as temperatureConverter } from './temperature-converter'; import { tool as textStatistics } from './text-statistics'; import { tool as tokenGenerator } from './token-generator'; import type { ToolCategory } from './tools.types'; +import { tool as x509CertificateGenerator } from './x509-certificate-generator'; import { tool as urlEncoder } from './url-encoder'; import { tool as urlParser } from './url-parser'; import { tool as uuidGenerator } from './uuid-generator'; @@ -91,7 +92,7 @@ import { tool as yamlViewer } from './yaml-viewer'; export const toolsByCategory: ToolCategory[] = [ { name: 'Crypto', - components: [tokenGenerator, hashText, bcrypt, uuidGenerator, ulidGenerator, cypher, bip39, hmacGenerator, rsaKeyPairGenerator, passwordStrengthAnalyser, pdfSignatureChecker], + components: [tokenGenerator, hashText, bcrypt, uuidGenerator, ulidGenerator, cypher, bip39, hmacGenerator, rsaKeyPairGenerator, x509CertificateGenerator, passwordStrengthAnalyser, pdfSignatureChecker], }, { name: 'Converter', diff --git a/src/tools/x509-certificate-generator/https-server-example.ts b/src/tools/x509-certificate-generator/https-server-example.ts new file mode 100644 index 0000000000..02e68f5d88 --- /dev/null +++ b/src/tools/x509-certificate-generator/https-server-example.ts @@ -0,0 +1,59 @@ +/* eslint-disable no-console */ +/** + * HTTPS Server Example + * + * This is an example demonstrating how to use the generated X509 certificate + * in a Node.js HTTPS server. + * + * Usage: + * 1. Generate a certificate using the X509 Certificate Generator tool + * 2. Save the certificate as 'certificate.crt' and private key as 'privateKey.key' + * 3. Create a 'cert' folder in your project root + * 4. Place the files in the cert folder + * 5. Run this file with: ts-node https-server-example.ts + * 6. Access the server at: https://localhost:8443 + * + * Note: Since this is a self-signed certificate, your browser will show a security warning. + * You can proceed safely for development/testing purposes. + */ + +import fs from 'node:fs'; +import https from 'node:https'; +import path from 'node:path'; + +const PORT = 8443; + +// Certificate and private key file paths (modify as needed) +const crtPath = path.join(__dirname, 'cert/certificate.crt'); +const keyPath = path.join(__dirname, 'cert/privateKey.key'); + +const options: https.ServerOptions = { + key: fs.readFileSync(keyPath), + cert: fs.readFileSync(crtPath), +}; + +const server = https.createServer(options, (req, res) => { + const { method, url } = req; + + res.writeHead(200, { 'Content-Type': 'application/json; charset=utf-8' }); + res.end( + JSON.stringify( + { + code: 0, + message: 'HTTPS server is running', + method, + url, + }, + null, + 2, + ), + ); +}); + +server.listen(PORT, () => { + console.log(`HTTPS server: https://localhost:${PORT}`); + console.log(`Certificate: ${crtPath}`); + console.log(`Private Key: ${keyPath}`); + console.log('\nNote: Your browser will show a security warning because this is a self-signed certificate.'); + console.log('This is normal for development/testing purposes.'); +}); diff --git a/src/tools/x509-certificate-generator/index.ts b/src/tools/x509-certificate-generator/index.ts new file mode 100644 index 0000000000..5951e30d2e --- /dev/null +++ b/src/tools/x509-certificate-generator/index.ts @@ -0,0 +1,12 @@ +import { Certificate } from '@vicons/tabler'; +import { defineTool } from '../tool'; +import { translate } from '@/plugins/i18n.plugin'; + +export const tool = defineTool({ + name: translate('tools.x509-certificate-generator.title'), + path: '/x509-certificate-generator', + description: translate('tools.x509-certificate-generator.description'), + keywords: ['x509', 'certificate', 'ssl', 'tls', 'pem', 'generator', 'root', 'ca', 'self-signed'], + component: () => import('./x509-certificate-generator.vue'), + icon: Certificate, +}); diff --git a/src/tools/x509-certificate-generator/x509-certificate-generator.service.ts b/src/tools/x509-certificate-generator/x509-certificate-generator.service.ts new file mode 100644 index 0000000000..2ddd3d504b --- /dev/null +++ b/src/tools/x509-certificate-generator/x509-certificate-generator.service.ts @@ -0,0 +1,125 @@ +import { md, pki } from 'node-forge'; +import { v4 as uuidv4 } from 'uuid'; + +export interface X509CertificateOptions { + commonName: string + country: string + stateOrProvince?: string + locality?: string + organization?: string + organizationalUnit?: string + email?: string + date: [string, string] +} + +export interface X509CertificateResult { + certificate: string + privateKey: string +} + +function getUuid(): string { + return uuidv4().replace(/-/g, ''); +} + +export function generateX509(options: X509CertificateOptions): X509CertificateResult { + const { + commonName, + country, + stateOrProvince, + locality, + organization, + organizationalUnit, + email, + date: [startDate, endDate], + } = options; + + // Generate RSA key pair, 2048 bits + const keys = pki.rsa.generateKeyPair(2048); + + // Create a new X.509 certificate + const cert = pki.createCertificate(); + cert.publicKey = keys.publicKey; + + // Set certificate serial number using UUID + cert.serialNumber = getUuid(); + + // Set certificate validity period + cert.validity.notBefore = new Date(startDate); + cert.validity.notAfter = new Date(endDate); + + // Define certificate subject attributes + const attrs: pki.CertificateField[] = [ + { + name: 'countryName', + value: country, + }, + { + shortName: 'ST', + value: stateOrProvince || '', + }, + { + name: 'localityName', + value: locality || '', + }, + { + name: 'organizationName', + value: organization || '', + }, + { + shortName: 'OU', + value: organizationalUnit || '', + }, + ]; + + // Handle multiple domains in commonName (comma-separated) + const domainList = commonName.split(',').map(item => item.trim()); + domainList.forEach((domain) => { + attrs.push({ + name: 'commonName', + value: domain, + }); + }); + + // Set certificate subject and issuer + cert.setSubject(attrs); + cert.setIssuer(attrs); + + // Build Subject Alternative Names (SAN) + const altNames: Array<{ type: number; value: string }> = []; + if (email) { + altNames.push({ type: 1, value: email }); // 1: Email + } + + domainList.forEach((domain) => { + // Check if it's an IP address (contains only digits and dots, and has 4 parts) + if (/\d+/.test(domain.replace(/\./g, '')) && domain.split('.').length === 4) { + altNames.push({ type: 7, value: domain }); // 7: IP Address + } + else { + altNames.push({ type: 2, value: domain }); // 2: DNS + } + }); + + // Set certificate extensions + cert.setExtensions([ + { + name: 'basicConstraints', + cA: true, + }, + { + name: 'subjectAltName', + altNames, + }, + ]); + + // Self-sign the certificate with SHA256 + cert.sign(keys.privateKey, md.sha256.create()); + + // Convert to PEM format + const pem = { + privateKey: pki.privateKeyToPem(keys.privateKey), + certificate: pki.certificateToPem(cert), + }; + + return pem; +} diff --git a/src/tools/x509-certificate-generator/x509-certificate-generator.vue b/src/tools/x509-certificate-generator/x509-certificate-generator.vue new file mode 100644 index 0000000000..a288bbe720 --- /dev/null +++ b/src/tools/x509-certificate-generator/x509-certificate-generator.vue @@ -0,0 +1,509 @@ + + + diff --git a/src/ui/c-select/c-select.vue b/src/ui/c-select/c-select.vue index 7b3607c93e..38e2eb8fef 100644 --- a/src/ui/c-select/c-select.vue +++ b/src/ui/c-select/c-select.vue @@ -151,7 +151,7 @@ function onSearchInput() { >
- + {{ selectedOption.label }} diff --git a/src/ui/c-table/c-table.vue b/src/ui/c-table/c-table.vue index ef569890e0..43293ab3c9 100644 --- a/src/ui/c-table/c-table.vue +++ b/src/ui/c-table/c-table.vue @@ -39,7 +39,7 @@ const headers = computed(() => {