kevin
8ea4a623a9
- Referer 开放重定向：safeRedirectPath 仅放行同站相对路径， 外部 URL/协议跳转一律回退 /inbox - 发信配额 TOCTOU：新增 TryReserveQuota 原子预扣 （UPDATE ... WHERE used_bytes + n <= quota_bytes），超配额即拒发； 附件保存失败按大小补偿回退 - 移除危险模板函数 safeHTML/safeJS：新增 jsonify（json.Marshal， < > & 转义为 \u003c 等，无法逃出 </script>），compose 页 quill.innerHTML 改用 jsonify；srcdoc 改回默认属性转义 - 会话治理：登录成功后 session.Clear() 清旧状态；记录 loginAt， 绝对过期 7 天 + 滑动续期（活跃会话 12h 写回刷新） - 确认 #15 Content-Disposition 编码随 P1 #4 已完成 - 新增 12 个测试：重定向路径矩阵、配额原子性（含超额不部分扣费）、 jsonify 逃逸防护、会话绝对过期/有效访问（签名会话构造） 至此 16 项安全审计项（P0-P3）全部修复完成。
131 lines
5.9 KiB
HTML
131 lines
5.9 KiB
HTML
{{define "compose"}}
|
|
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
|
|
<title>写信 - MailGo</title>
|
|
<link href="https://cdn.quilljs.com/1.3.7/quill.snow.css" rel="stylesheet">
|
|
{{template "styles" .}}
|
|
</head>
|
|
<body class="page-compose">
|
|
{{template "navbar" .}}
|
|
<div class="app-body">
|
|
{{template "sidebar" .}}
|
|
<main class="mail-main">
|
|
<div class="compose-toolbar">
|
|
<button type="submit" form="compose-form" class="btn btn-primary">
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-2px;margin-right:4px;"><line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/></svg>
|
|
发送
|
|
</button>
|
|
<label class="tb-btn" style="cursor:pointer;">
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"/></svg>
|
|
附件
|
|
<input type="file" name="attachments" id="attach-input" multiple style="display:none;">
|
|
</label>
|
|
<a href="/inbox" class="tb-btn">取消</a>
|
|
<div class="toolbar-spacer"></div>
|
|
<span class="page-info">撰写新邮件</span>
|
|
</div>
|
|
|
|
{{if .error}}<div class="alert alert-error" style="margin:12px 18px 0;">{{.error}}</div>{{end}}
|
|
|
|
<form id="compose-form" class="compose-form" method="POST" action="/compose" enctype="multipart/form-data">
|
|
<div class="compose-field">
|
|
<label>收件人</label>
|
|
<input type="email" name="to" required value="{{.to}}" placeholder="输入收件人邮箱地址">
|
|
</div>
|
|
<div class="compose-field">
|
|
<label>抄送</label>
|
|
<input type="text" name="cc" value="{{.cc}}" placeholder="多个地址用逗号分隔（可选）">
|
|
</div>
|
|
<div class="compose-field">
|
|
<label>主题</label>
|
|
<input type="text" name="subject" value="{{.subject}}" placeholder="输入邮件主题">
|
|
</div>
|
|
|
|
<div id="attach-chips" class="attach-chips" style="{{if not .attachments}}display:none;{{end}}"></div>
|
|
|
|
<div class="editor-wrap">
|
|
<div id="editor" data-placeholder="请输入邮件内容..."></div>
|
|
<input type="hidden" name="body" id="body-hidden">
|
|
<input type="hidden" name="html_body" id="html-body-hidden">
|
|
</div>
|
|
|
|
<div class="compose-footer">
|
|
<span>附件配额</span>
|
|
<span class="quota-bar" id="quota-bar" data-used="{{.usedBytes}}" data-quota="{{.quotaBytes}}"><i></i></span>
|
|
<span id="quota-text">{{formatBytes .usedBytes}} / {{formatBytes .quotaBytes}}</span>
|
|
</div>
|
|
</form>
|
|
</main>
|
|
</div>
|
|
<script src="https://cdn.quilljs.com/1.3.7/quill.min.js"></script>
|
|
<script>
|
|
var quill = new Quill('#editor', {
|
|
theme: 'snow',
|
|
placeholder: document.getElementById('editor').dataset.placeholder || '请输入邮件内容...',
|
|
modules: {
|
|
toolbar: [
|
|
[{ 'header': [1, 2, 3, false] }],
|
|
['bold', 'italic', 'underline', 'strike'],
|
|
[{ 'color': [] }, { 'background': [] }],
|
|
[{ 'list': 'ordered'}, { 'list': 'bullet' }],
|
|
['link', 'image'],
|
|
['clean']
|
|
]
|
|
}
|
|
});
|
|
{{if .bodyContent}}
|
|
quill.root.innerHTML = {{.bodyContent | jsonify}};
|
|
{{end}}
|
|
|
|
document.getElementById('compose-form').addEventListener('submit', function () {
|
|
document.getElementById('body-hidden').value = quill.getText();
|
|
document.getElementById('html-body-hidden').value = quill.root.innerHTML;
|
|
});
|
|
|
|
// 附件选择预览
|
|
var attachInput = document.getElementById('attach-input');
|
|
var chipsBox = document.getElementById('attach-chips');
|
|
var files = [];
|
|
function renderChips() {
|
|
chipsBox.innerHTML = '';
|
|
chipsBox.style.display = files.length ? 'flex' : 'none';
|
|
files.forEach(function (f, i) {
|
|
var chip = document.createElement('span');
|
|
chip.className = 'attach-chip';
|
|
chip.innerHTML = '📎 ' + f.name + ' (' + (f.size / 1024).toFixed(1) + ' KB)' +
|
|
'<button type="button" class="chip-del" data-i="' + i + '" title="移除">✕</button>';
|
|
chipsBox.appendChild(chip);
|
|
});
|
|
}
|
|
attachInput.addEventListener('change', function () {
|
|
files = Array.prototype.slice.call(attachInput.files);
|
|
renderChips();
|
|
});
|
|
chipsBox.addEventListener('click', function (e) {
|
|
var del = e.target.closest('.chip-del');
|
|
if (!del) return;
|
|
files.splice(parseInt(del.dataset.i, 10), 1);
|
|
var dt = new DataTransfer();
|
|
files.forEach(function (f) { dt.items.add(f); });
|
|
attachInput.files = dt.files;
|
|
renderChips();
|
|
});
|
|
|
|
// 配额进度条
|
|
var bar = document.getElementById('quota-bar');
|
|
if (bar) {
|
|
var used = parseInt(bar.dataset.used, 10) || 0;
|
|
var quota = parseInt(bar.dataset.quota, 10) || 1;
|
|
var pct = Math.min(100, Math.round(used / quota * 100));
|
|
bar.querySelector('i').style.width = pct + '%';
|
|
if (pct >= 90) bar.classList.add('warn');
|
|
if (pct >= 100) bar.classList.add('over');
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|
|
{{end}}
|