feat: add client-side SSH Ed25519 key generator on order page

Adds a "Generate a new key" button to the checkout SSH key section that
creates an Ed25519 keypair entirely in the browser using Web Crypto API.
The public key auto-fills the form field, and the private key is presented
for download/copy with a clear "save now" warning.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
EZSCALE
2026-02-07 15:22:33 -06:00
parent e8d2eb0aa1
commit 209e01deb6
2 changed files with 234 additions and 0 deletions

View File

@@ -1,6 +1,7 @@
<?php
use WHMCS\Module\Server\VirtFusionDirect\ConfigureService;
use WHMCS\Module\Server\VirtFusionDirect\Database;
use WHMCS\User\User;
if (!defined("WHMCS")) {
@@ -135,7 +136,10 @@ add_hook('ClientAreaFooterOutput', 1, function ($vars) {
return null;
}
$systemUrl = Database::getSystemUrl();
return "
<script src=\"" . htmlspecialchars($systemUrl, ENT_QUOTES, 'UTF-8') . "modules/servers/VirtFusionDirect/templates/js/keygen.js?v=0.0.20\"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var osTemplates = " . json_encode($dropdownOptions, JSON_THROW_ON_ERROR | JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT) . ";
@@ -197,6 +201,106 @@ add_hook('ClientAreaFooterOutput', 1, function ($vars) {
sshPasteContainer.appendChild(pasteLabel);
sshPasteContainer.appendChild(pasteArea);
// Generate key button
var generateBtn = document.createElement('button');
generateBtn.type = 'button';
generateBtn.className = 'btn btn-outline-secondary btn-sm';
generateBtn.textContent = 'Generate a new key';
generateBtn.style.marginTop = '8px';
// Private key panel (hidden initially)
var privKeyPanel = document.createElement('div');
privKeyPanel.setAttribute('id', 'vf-privkey-panel');
privKeyPanel.style.display = 'none';
privKeyPanel.style.marginTop = '12px';
privKeyPanel.style.border = '2px solid #dc3545';
privKeyPanel.style.borderRadius = '6px';
privKeyPanel.style.padding = '12px';
var privKeyWarning = document.createElement('div');
privKeyWarning.style.color = '#dc3545';
privKeyWarning.style.fontWeight = 'bold';
privKeyWarning.style.marginBottom = '8px';
privKeyWarning.textContent = 'Private Key — Save This Now! It will not be shown again.';
var privKeyArea = document.createElement('textarea');
privKeyArea.className = 'form-control';
privKeyArea.setAttribute('rows', '6');
privKeyArea.setAttribute('readonly', 'readonly');
privKeyArea.style.fontFamily = 'monospace';
privKeyArea.style.fontSize = '12px';
privKeyArea.style.marginBottom = '8px';
var privKeyBtnRow = document.createElement('div');
privKeyBtnRow.style.display = 'flex';
privKeyBtnRow.style.gap = '8px';
privKeyBtnRow.style.alignItems = 'center';
privKeyBtnRow.style.flexWrap = 'wrap';
var downloadBtn = document.createElement('button');
downloadBtn.type = 'button';
downloadBtn.className = 'btn btn-primary btn-sm';
downloadBtn.textContent = 'Download';
var copyBtn = document.createElement('button');
copyBtn.type = 'button';
copyBtn.className = 'btn btn-default btn-secondary btn-sm';
copyBtn.textContent = 'Copy to Clipboard';
var pubKeyConfirm = document.createElement('span');
pubKeyConfirm.style.color = '#28a745';
pubKeyConfirm.style.fontWeight = 'bold';
pubKeyConfirm.textContent = 'Public key set automatically.';
privKeyBtnRow.appendChild(downloadBtn);
privKeyBtnRow.appendChild(copyBtn);
privKeyBtnRow.appendChild(pubKeyConfirm);
privKeyPanel.appendChild(privKeyWarning);
privKeyPanel.appendChild(privKeyArea);
privKeyPanel.appendChild(privKeyBtnRow);
downloadBtn.addEventListener('click', function() {
vfDownloadFile('id_ed25519', privKeyArea.value);
});
copyBtn.addEventListener('click', function() {
navigator.clipboard.writeText(privKeyArea.value).then(function() {
copyBtn.textContent = 'Copied!';
setTimeout(function() { copyBtn.textContent = 'Copy to Clipboard'; }, 2000);
});
});
// Error message for unsupported browsers
var genErrorMsg = document.createElement('div');
genErrorMsg.style.display = 'none';
genErrorMsg.style.marginTop = '8px';
genErrorMsg.style.color = '#dc3545';
genErrorMsg.textContent = 'Your browser does not support Ed25519 key generation. Please paste your public key manually.';
generateBtn.addEventListener('click', async function() {
generateBtn.disabled = true;
generateBtn.textContent = 'Generating...';
try {
var keys = await vfGenerateSSHKey();
var sshSelect = document.getElementById('vf-ssh-select');
if (sshSelect) {
sshSelect.value = '__new__';
sshPasteContainer.style.display = 'block';
}
pasteArea.value = keys.publicKey;
sshInputField.value = keys.publicKey;
privKeyArea.value = keys.privateKey;
privKeyPanel.style.display = 'block';
genErrorMsg.style.display = 'none';
} catch (e) {
genErrorMsg.style.display = 'block';
privKeyPanel.style.display = 'none';
} finally {
generateBtn.disabled = false;
generateBtn.textContent = 'Generate a new key';
}
});
if (sshKeys.length > 0) {
var sshSelect = document.createElement('select');
sshSelect.className = 'form-control';
@@ -233,11 +337,17 @@ add_hook('ClientAreaFooterOutput', 1, function ($vars) {
sshInputField.parentNode.insertBefore(sshSelect, sshInputField.nextSibling);
sshSelect.parentNode.insertBefore(sshPasteContainer, sshSelect.nextSibling);
sshPasteContainer.parentNode.insertBefore(generateBtn, sshPasteContainer.nextSibling);
generateBtn.parentNode.insertBefore(genErrorMsg, generateBtn.nextSibling);
genErrorMsg.parentNode.insertBefore(privKeyPanel, genErrorMsg.nextSibling);
sshInputField.style.display = 'none';
} else {
// No existing keys — show the paste textarea directly
sshPasteContainer.style.display = 'block';
sshInputField.parentNode.insertBefore(sshPasteContainer, sshInputField.nextSibling);
sshPasteContainer.parentNode.insertBefore(generateBtn, sshPasteContainer.nextSibling);
generateBtn.parentNode.insertBefore(genErrorMsg, generateBtn.nextSibling);
genErrorMsg.parentNode.insertBefore(privKeyPanel, genErrorMsg.nextSibling);
sshInputField.style.display = 'none';
}
}

View File

@@ -0,0 +1,124 @@
/**
* VirtFusion SSH Ed25519 Key Generator
*
* Client-side Ed25519 keypair generation using Web Crypto API.
* Produces OpenSSH-format public and private keys.
*/
function vfConcatArrays() {
var total = 0;
for (var i = 0; i < arguments.length; i++) total += arguments[i].length;
var result = new Uint8Array(total);
var offset = 0;
for (var i = 0; i < arguments.length; i++) {
result.set(arguments[i], offset);
offset += arguments[i].length;
}
return result;
}
function vfSshEncodeUint32(value) {
return new Uint8Array([
(value >>> 24) & 0xff,
(value >>> 16) & 0xff,
(value >>> 8) & 0xff,
value & 0xff
]);
}
function vfSshEncodeString(data) {
if (typeof data === 'string') {
data = new TextEncoder().encode(data);
}
return vfConcatArrays(vfSshEncodeUint32(data.length), data);
}
function vfArrayToBase64(uint8Array) {
var binary = '';
for (var i = 0; i < uint8Array.length; i++) {
binary += String.fromCharCode(uint8Array[i]);
}
return btoa(binary);
}
function vfEncodeSSHPublicKey(pubKeyBytes) {
var blob = vfConcatArrays(
vfSshEncodeString('ssh-ed25519'),
vfSshEncodeString(pubKeyBytes)
);
return 'ssh-ed25519 ' + vfArrayToBase64(blob);
}
function vfEncodeSSHPrivateKey(seed, pubKeyBytes) {
var keyType = vfSshEncodeString('ssh-ed25519');
var pubBlob = vfConcatArrays(keyType, vfSshEncodeString(pubKeyBytes));
var checkInt = crypto.getRandomValues(new Uint8Array(4));
var privKey = vfConcatArrays(seed, pubKeyBytes); // 64 bytes: seed || pubkey
var privateSection = vfConcatArrays(
checkInt,
checkInt,
vfSshEncodeString('ssh-ed25519'),
vfSshEncodeString(pubKeyBytes),
vfSshEncodeString(privKey),
vfSshEncodeString('') // empty comment
);
// Pad to 8-byte boundary with 1,2,3,4,5...
var padLen = 8 - (privateSection.length % 8);
if (padLen < 8) {
var padding = new Uint8Array(padLen);
for (var i = 0; i < padLen; i++) padding[i] = i + 1;
privateSection = vfConcatArrays(privateSection, padding);
}
var authMagic = new TextEncoder().encode('openssh-key-v1\0');
var body = vfConcatArrays(
authMagic,
vfSshEncodeString('none'), // cipher
vfSshEncodeString('none'), // kdf
vfSshEncodeString(''), // kdf options
vfSshEncodeUint32(1), // number of keys
vfSshEncodeString(pubBlob),
vfSshEncodeString(privateSection)
);
var b64 = vfArrayToBase64(body);
var lines = ['-----BEGIN OPENSSH PRIVATE KEY-----'];
for (var i = 0; i < b64.length; i += 70) {
lines.push(b64.substring(i, i + 70));
}
lines.push('-----END OPENSSH PRIVATE KEY-----');
lines.push('');
return lines.join('\n');
}
async function vfGenerateSSHKey() {
var keyPair = await crypto.subtle.generateKey('Ed25519', true, ['sign', 'verify']);
var pubRaw = await crypto.subtle.exportKey('raw', keyPair.publicKey);
var pubKeyBytes = new Uint8Array(pubRaw);
// PKCS#8 for Ed25519 is exactly 48 bytes; bytes 16-47 are the 32-byte seed
var privPkcs8 = await crypto.subtle.exportKey('pkcs8', keyPair.privateKey);
var privBytes = new Uint8Array(privPkcs8);
var seed = privBytes.slice(16, 48);
return {
publicKey: vfEncodeSSHPublicKey(pubKeyBytes),
privateKey: vfEncodeSSHPrivateKey(seed, pubKeyBytes)
};
}
function vfDownloadFile(filename, content) {
var blob = new Blob([content], { type: 'application/octet-stream' });
var url = URL.createObjectURL(blob);
var a = document.createElement('a');
a.href = url;
a.download = filename;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
}