Sea-Studio/PerToolBoxFront
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v1.0.0提交

Browse Source
This commit is contained in:
canglan
2026-03-31 15:54:32 +08:00
parent 79bfeb0e18
commit 314e53bf9c
16 changed files with 2110 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

172
pages/crypto.php Normal file
View File

@@ -0,0 +1,172 @@
<?php
/**
* PerToolBox Front - 加密工具箱页面
*
* Copyright (C) 2024 Sea Network Technology Studio
* Author: Canglan <admin@sea-studio.top>
* License: AGPL v3
*/
require_once '../config.php';
include_once '../header.php';
include_once '../sidebar.php';
?>
<div class="main-content">
<div class="card">
<h1 class="text-2xl font-bold mb-6">🔒 加密工具箱</h1>
<!-- 哈希计算 -->
<div class="mb-8 border-b pb-6">
<h2 class="text-xl font-semibold mb-4">哈希计算</h2>
<div class="flex gap-2 mb-3">
<select id="hashAlgo" class="form-input w-32">
<option value="md5">MD5</option>
<option value="sha1">SHA1</option>
<option value="sha256">SHA256</option>
<option value="sha512">SHA512</option>
</select>
<input type="text" id="hashInput" placeholder="输入文本" class="form-input flex-1">
<button id="hashBtn" class="btn btn-primary">计算</button>
</div>
<div class="bg-gray-50 p-3 rounded-lg">
<div class="text-sm text-gray-500">结果：</div>
<div id="hashResult" class="font-mono text-sm break-all"></div>
</div>
</div>
<!-- Base64 编解码 -->
<div class="mb-8 border-b pb-6">
<h2 class="text-xl font-semibold mb-4">Base64 编解码</h2>
<textarea id="base64Input" rows="3" placeholder="输入文本" class="form-input mb-3"></textarea>
<div class="flex gap-2 mb-3">
<button id="base64Encode" class="btn btn-primary">编码</button>
<button id="base64Decode" class="btn btn-secondary">解码</button>
</div>
<div class="bg-gray-50 p-3 rounded-lg">
<div class="text-sm text-gray-500">结果：</div>
<div id="base64Result" class="font-mono text-sm break-all"></div>
</div>
</div>
<!-- URL 编解码 -->
<div class="mb-8 border-b pb-6">
<h2 class="text-xl font-semibold mb-4">URL 编解码</h2>
<textarea id="urlInput" rows="3" placeholder="输入文本" class="form-input mb-3"></textarea>
<div class="flex gap-2 mb-3">
<button id="urlEncode" class="btn btn-primary">编码</button>
<button id="urlDecode" class="btn btn-secondary">解码</button>
</div>
<div class="bg-gray-50 p-3 rounded-lg">
<div class="text-sm text-gray-500">结果：</div>
<div id="urlResult" class="font-mono text-sm break-all"></div>
</div>
</div>
<!-- AES 加解密 -->
<div class="mb-8">
<h2 class="text-xl font-semibold mb-4">AES 加解密</h2>
<div class="grid md:grid-cols-2 gap-4 mb-3">
<select id="aesMode" class="form-input">
<option value="ECB">ECB</option>
<option value="CBC">CBC</option>
<option value="GCM">GCM</option>
</select>
<input type="text" id="aesKey" placeholder="密钥 (16/24/32字节)" class="form-input">
</div>
<input type="text" id="aesIv" placeholder="IV (CBC/GCM模式需要，16字节)" class="form-input mb-3">
<textarea id="aesInput" rows="3" placeholder="输入文本" class="form-input mb-3"></textarea>
<div class="flex gap-2 mb-3">
<button id="aesEncrypt" class="btn btn-primary">加密</button>
<button id="aesDecrypt" class="btn btn-secondary">解密</button>
</div>
<div class="bg-gray-50 p-3 rounded-lg">
<div class="text-sm text-gray-500">结果：</div>
<div id="aesResult" class="font-mono text-sm break-all"></div>
</div>
</div>
</div>
</div>
<script>
// 哈希计算
document.getElementById('hashBtn').addEventListener('click', async () => {
const algo = document.getElementById('hashAlgo').value;
const text = document.getElementById('hashInput').value;
if (!text) { showToast('请输入文本', 'error'); return; }
try {
const data = await apiRequest('/crypto/hash', {
method: 'POST',
body: JSON.stringify({ algorithm: algo, text })
});
document.getElementById('hashResult').textContent = data.result;
} catch (error) {
showToast(error.message, 'error');
}
});
// Base64
async function base64Process(action) {
const text = document.getElementById('base64Input').value;
if (!text) { showToast('请输入文本', 'error'); return; }
try {
const data = await apiRequest('/crypto/base64', {
method: 'POST',
body: JSON.stringify({ action, text })
});
document.getElementById('base64Result').textContent = data.result;
} catch (error) {
showToast(error.message, 'error');
}
}
document.getElementById('base64Encode').addEventListener('click', () => base64Process('encode'));
document.getElementById('base64Decode').addEventListener('click', () => base64Process('decode'));
// URL
async function urlProcess(action) {
const text = document.getElementById('urlInput').value;
if (!text) { showToast('请输入文本', 'error'); return; }
try {
const data = await apiRequest('/crypto/url', {
method: 'POST',
body: JSON.stringify({ action, text })
});
document.getElementById('urlResult').textContent = data.result;
} catch (error) {
showToast(error.message, 'error');
}
}
document.getElementById('urlEncode').addEventListener('click', () => urlProcess('encode'));
document.getElementById('urlDecode').addEventListener('click', () => urlProcess('decode'));
// AES
async function aesProcess(action) {
const mode = document.getElementById('aesMode').value;
const key = document.getElementById('aesKey').value;
const iv = document.getElementById('aesIv').value;
const text = document.getElementById('aesInput').value;
if (!key) { showToast('请输入密钥', 'error'); return; }
if (!text) { showToast('请输入文本', 'error'); return; }
if ((mode === 'CBC' || mode === 'GCM') && !iv) {
showToast('CBC/GCM模式需要IV', 'error');
return;
}
try {
const data = await apiRequest('/crypto/aes', {
method: 'POST',
body: JSON.stringify({ mode, action, key, iv: iv || null, text })
});
document.getElementById('aesResult').textContent = data.result;
} catch (error) {
showToast(error.message, 'error');
}
}
document.getElementById('aesEncrypt').addEventListener('click', () => aesProcess('encrypt'));
document.getElementById('aesDecrypt').addEventListener('click', () => aesProcess('decrypt'));
recordUsage('crypto_hash');
</script>
<?php include_once '../footer.php'; ?>