251 lines
8.4 KiB
JavaScript
251 lines
8.4 KiB
JavaScript
|
(function () {
|
|||
|
|
const state = {
|
|||
|
|
meta: null,
|
|||
|
|
logs: [],
|
|||
|
|
currentRel: null,
|
|||
|
|
currentDetail: null,
|
|||
|
|
loadSource: 'outbound',
|
|||
|
|
bodyBase64: '',
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
function $(id) { return document.getElementById(id); }
|
|||
|
|
|
|||
|
|
async function api(path, opts) {
|
|||
|
|
const r = await fetch(path, opts);
|
|||
|
|
const t = await r.text();
|
|||
|
|
let j;
|
|||
|
|
try { j = JSON.parse(t); } catch { j = { error: t }; }
|
|||
|
|
if (!r.ok) throw new Error(j.error || r.statusText);
|
|||
|
|
return j;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function esc(s) {
|
|||
|
|
const d = document.createElement('div');
|
|||
|
|
d.textContent = s == null ? '' : String(s);
|
|||
|
|
return d.innerHTML;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function loadMeta() {
|
|||
|
|
state.meta = await api('/t/api/meta');
|
|||
|
|
$('meta-hint').innerHTML =
|
|||
|
|
'28212: <code>' + esc(state.meta.superviseTarget) + '</code><br>' +
|
|||
|
|
'28211: <code>' + esc(state.meta.fileTarget) + '</code>';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function loadLogs() {
|
|||
|
|
state.logs = await api('/t/api/logs');
|
|||
|
|
const ul = $('log-list');
|
|||
|
|
ul.innerHTML = '';
|
|||
|
|
if (!state.logs.length) {
|
|||
|
|
ul.innerHTML = '<li style="cursor:default;color:var(--muted)">暂无 file 日志</li>';
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
state.logs.forEach((e) => {
|
|||
|
|
const li = document.createElement('li');
|
|||
|
|
li.dataset.rel = e.rel;
|
|||
|
|
li.innerHTML =
|
|||
|
|
'<div class="name">' + esc(e.name) + '</div>' +
|
|||
|
|
'<div class="sub">' + esc(e.hourDir) + ' · ' + esc(e.modified) + '</div>';
|
|||
|
|
li.onclick = () => selectLog(e.rel, li);
|
|||
|
|
ul.appendChild(li);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function selectLog(rel, liEl) {
|
|||
|
|
state.currentRel = rel;
|
|||
|
|
document.querySelectorAll('.log-list li').forEach((el) => el.classList.remove('active'));
|
|||
|
|
if (liEl) liEl.classList.add('active');
|
|||
|
|
state.currentDetail = await api('/t/api/logs/detail?rel=' + encodeURIComponent(rel));
|
|||
|
|
loadSection(state.loadSource === 'inbound' ? state.currentDetail.inbound : state.currentDetail.outbound);
|
|||
|
|
showLogResponse();
|
|||
|
|
$('logmeta-view').textContent = JSON.stringify({
|
|||
|
|
meta: state.currentDetail.meta,
|
|||
|
|
parseWarnings: state.currentDetail.parseWarnings,
|
|||
|
|
outboundAbsent: state.currentDetail.outboundAbsent,
|
|||
|
|
}, null, 2);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function showLogResponse() {
|
|||
|
|
const r = state.currentDetail.response;
|
|||
|
|
let text = '';
|
|||
|
|
if (r.bodyJSON) text = r.bodyJSON;
|
|||
|
|
else if (r.body) text = r.body;
|
|||
|
|
else text = '(日志块3 无响应体)';
|
|||
|
|
if (r.status) text = 'HTTP ' + r.status + '\n\n' + text;
|
|||
|
|
$('response-view').textContent = text;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function loadSection(sec) {
|
|||
|
|
if (!sec) return;
|
|||
|
|
$('url').value = sec.url || '';
|
|||
|
|
renderHeaders(sec.headers || {});
|
|||
|
|
const info = [];
|
|||
|
|
if (sec.bodyLen) info.push('body_len=' + sec.bodyLen);
|
|||
|
|
if (sec.bodyPlain) info.push('明文');
|
|||
|
|
else if (sec.bodyBase64) info.push('base64');
|
|||
|
|
$('body-info').textContent = info.join(' · ') || '';
|
|||
|
|
state.bodyBase64 = sec.bodyBase64 || '';
|
|||
|
|
if (sec.bodyPlain && sec.bodyRaw) {
|
|||
|
|
$('body-raw').value = sec.bodyRaw;
|
|||
|
|
} else if (sec.bodyBase64) {
|
|||
|
|
try {
|
|||
|
|
$('body-raw').value = '[binary ' + sec.bodyLen + ' bytes — 发送时将使用 bodyBase64 回放]';
|
|||
|
|
} catch (e) {
|
|||
|
|
$('body-raw').value = '';
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
$('body-raw').value = sec.bodyRaw || '';
|
|||
|
|
}
|
|||
|
|
$('body-base64').value = state.bodyBase64;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function renderHeaders(hdrs) {
|
|||
|
|
const tbody = $('headers-table').querySelector('tbody');
|
|||
|
|
tbody.innerHTML = '';
|
|||
|
|
Object.entries(hdrs).forEach(([k, v]) => addHeaderRow(k, v));
|
|||
|
|
if (!tbody.children.length) addHeaderRow('', '');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function addHeaderRow(k, v) {
|
|||
|
|
const tbody = $('headers-table').querySelector('tbody');
|
|||
|
|
const tr = document.createElement('tr');
|
|||
|
|
tr.innerHTML =
|
|||
|
|
'<td><input class="hk" value="' + esc(k).replace(/"/g, '"') + '"></td>' +
|
|||
|
|
'<td><input class="hv" value="' + esc(v).replace(/"/g, '"') + '"></td>' +
|
|||
|
|
'<td><button type="button" class="btn sm del">删</button></td>';
|
|||
|
|
tr.querySelector('.del').onclick = () => tr.remove();
|
|||
|
|
tbody.appendChild(tr);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function collectHeaders() {
|
|||
|
|
const h = {};
|
|||
|
|
$('headers-table').querySelectorAll('tbody tr').forEach((tr) => {
|
|||
|
|
const k = tr.querySelector('.hk').value.trim();
|
|||
|
|
const v = tr.querySelector('.hv').value.trim();
|
|||
|
|
if (k) h[k] = v;
|
|||
|
|
});
|
|||
|
|
return h;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function runConnect(channel) {
|
|||
|
|
const box = $('connect-results');
|
|||
|
|
box.innerHTML = '<span class="badge">测试中…</span>';
|
|||
|
|
try {
|
|||
|
|
const res = await api('/t/api/test/connect', {
|
|||
|
|
method: 'POST',
|
|||
|
|
headers: { 'Content-Type': 'application/json' },
|
|||
|
|
body: JSON.stringify({ channel }),
|
|||
|
|
});
|
|||
|
|
box.innerHTML = res.results.map((r) => {
|
|||
|
|
const cls = r.ok ? 'ok' : 'err';
|
|||
|
|
const detail = r.ok
|
|||
|
|
? 'http=' + r.httpStatus + ' ' + r.elapsedMs + 'ms'
|
|||
|
|
: (r.phase || '') + ' ' + (r.error || '');
|
|||
|
|
return '<span class="badge ' + cls + '" title="' + esc(r.url) + '">' +
|
|||
|
|
esc(r.channel) + ' ' + esc(detail) + '</span>';
|
|||
|
|
}).join('');
|
|||
|
|
} catch (e) {
|
|||
|
|
box.innerHTML = '<span class="badge err">' + esc(e.message) + '</span>';
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function sendRequest() {
|
|||
|
|
const payload = {
|
|||
|
|
url: $('url').value.trim(),
|
|||
|
|
headers: collectHeaders(),
|
|||
|
|
useOutbound: state.loadSource === 'outbound',
|
|||
|
|
};
|
|||
|
|
if (state.currentRel) payload.rel = state.currentRel;
|
|||
|
|
const b64 = $('body-base64').value.trim();
|
|||
|
|
if (b64 && !$('body-raw').value.startsWith('[binary')) {
|
|||
|
|
payload.bodyBase64 = b64;
|
|||
|
|
} else if (b64) {
|
|||
|
|
payload.bodyBase64 = b64;
|
|||
|
|
} else {
|
|||
|
|
const raw = $('body-raw').value;
|
|||
|
|
if (raw && !raw.startsWith('[binary')) {
|
|||
|
|
payload.bodyBase64 = btoa(unescape(encodeURIComponent(raw)));
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
$('response-view').textContent = '请求中…';
|
|||
|
|
try {
|
|||
|
|
const res = await api('/t/api/test/send', {
|
|||
|
|
method: 'POST',
|
|||
|
|
headers: { 'Content-Type': 'application/json' },
|
|||
|
|
body: JSON.stringify(payload),
|
|||
|
|
});
|
|||
|
|
let text = 'HTTP ' + res.httpStatus + ' (' + res.elapsedMs + 'ms)\n\n';
|
|||
|
|
if (res.error) text += 'Error: ' + res.error;
|
|||
|
|
else if (res.bodyJSON) text += res.bodyJSON;
|
|||
|
|
else text += res.body || '';
|
|||
|
|
$('response-view').textContent = text;
|
|||
|
|
} catch (e) {
|
|||
|
|
$('response-view').textContent = '失败: ' + e.message;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function exportLog(source) {
|
|||
|
|
if (!state.currentRel) {
|
|||
|
|
alert('请先选择日志');
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
window.location.href =
|
|||
|
|
'/t/api/logs/export?rel=' + encodeURIComponent(state.currentRel) +
|
|||
|
|
'&source=' + (source === 'inbound' ? 'inbound' : 'outbound');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function copyCurl() {
|
|||
|
|
const url = $('url').value.trim();
|
|||
|
|
const hdrs = collectHeaders();
|
|||
|
|
let parts = ['curl -X POST "' + url + '"'];
|
|||
|
|
Object.entries(hdrs).forEach(([k, v]) => {
|
|||
|
|
parts.push('-H "' + k + ': ' + v.replace(/"/g, '\\"') + '"');
|
|||
|
|
});
|
|||
|
|
const b64 = $('body-base64').value.trim();
|
|||
|
|
if (b64) {
|
|||
|
|
parts.push('--data-binary @<(echo ' + b64 + ' | base64 -d)');
|
|||
|
|
} else {
|
|||
|
|
const raw = $('body-raw').value;
|
|||
|
|
if (raw && !raw.startsWith('[binary')) {
|
|||
|
|
parts.push("-d '" + raw.replace(/'/g, "'\\''") + "'");
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
navigator.clipboard.writeText(parts.join(' \\\n ')).then(
|
|||
|
|
() => alert('已复制 cURL（multipart 二进制请用导出 ApiPost）'),
|
|||
|
|
() => alert('复制失败')
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
document.querySelectorAll('.tab').forEach((tab) => {
|
|||
|
|
tab.onclick = () => {
|
|||
|
|
document.querySelectorAll('.tab').forEach((t) => t.classList.remove('active'));
|
|||
|
|
document.querySelectorAll('.panel').forEach((p) => p.classList.remove('active'));
|
|||
|
|
tab.classList.add('active');
|
|||
|
|
$('panel-' + tab.dataset.tab).classList.add('active');
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
document.querySelectorAll('[data-connect]').forEach((btn) => {
|
|||
|
|
btn.onclick = () => runConnect(btn.dataset.connect);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
$('btn-refresh-logs').onclick = loadLogs;
|
|||
|
|
$('btn-load-outbound').onclick = () => {
|
|||
|
|
state.loadSource = 'outbound';
|
|||
|
|
if (state.currentDetail) loadSection(state.currentDetail.outbound);
|
|||
|
|
};
|
|||
|
|
$('btn-load-inbound').onclick = () => {
|
|||
|
|
state.loadSource = 'inbound';
|
|||
|
|
if (state.currentDetail) loadSection(state.currentDetail.inbound);
|
|||
|
|
};
|
|||
|
|
$('btn-export-outbound').onclick = () => exportLog('outbound');
|
|||
|
|
$('btn-export-inbound').onclick = () => exportLog('inbound');
|
|||
|
|
$('btn-curl').onclick = copyCurl;
|
|||
|
|
$('btn-send').onclick = sendRequest;
|
|||
|
|
$('btn-add-header').onclick = () => addHeaderRow('', '');
|
|||
|
|
|
|||
|
|
loadMeta().then(loadLogs).catch((e) => {
|
|||
|
|
$('meta-hint').textContent = '加载失败: ' + e.message;
|
|||
|
|
});
|
|||
|
|
})();
|