172 lines
6.9 KiB
PHP
172 lines
6.9 KiB
PHP
<?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'; ?>
|