4a1d949e41
完整 Web 管理平台,涵盖: P0 生产加固: - 会话超时(空闲+绝对) + CSRF 防护 + 登录失败限流 - HTTPS/TLS 证书管理(自签生成/上传/删除/过期提醒) - SSL Bump (HTTPS 透明代理) 可视化配置 - 配置文件 diff 预览 + 二次确认才写入 - 服务控制二次确认 + 操作期间按钮锁定 P1 运维能力: - 日志轮转管理(logrotate) + 日志状态监控 - 告警规则(5xx/命中率/磁盘/客户端流量) - 多 Squid 实例管理 + 一键切换 - squidclient mgr 实时性能指标 - 流量异常检测(突增/大文件/高频小包/新客户端) P2 日志分析增强: - 日志持久化到 SQLite + 历史时间范围查询 - 导出 CSV/JSON(日志/KPI/异常/审计) - GeoIP 地图(Leaflet + ip-api.com 离线可选 GeoLite2) - 每客户端 24h 趋势图 - 自定义 Squid logformat 解析器 P3 体验锦上添花: - 暗/亮主题切换(cookie 持久化) - WebSSH 终端(xterm.js + paramiko) - 完整审计日志 + 用户管理 技术栈: Flask 3.0 + SQLAlchemy 2.0 + SQLite + Chart.js + Leaflet 总代码量: ~16500 行 (15 Python 模块 + 34 模板 + CSS) 路由数: 73
123 lines
5.3 KiB
HTML
123 lines
5.3 KiB
HTML
{% extends "base.html" %}
|
||
{% block title %}访问控制 - Squid Manager{% endblock %}
|
||
{% block content %}
|
||
<div class="page-header">
|
||
<h1>🔐 访问控制规则</h1>
|
||
<div class="page-actions">
|
||
<button onclick="document.getElementById('add-form').style.display='block'" class="btn btn-primary btn-small">➕ 添加规则</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" id="add-form" style="display:none;">
|
||
<h3 class="card-title">添加新规则</h3>
|
||
<form method="post" class="inline-form">
|
||
<input type="hidden" name="_csrf" value="{{ csrf_token() }}">
|
||
<input type="hidden" name="action" value="add">
|
||
<div class="filter-grid">
|
||
<div class="form-group">
|
||
<label>指令</label>
|
||
<select name="directive" class="form-input">
|
||
{% for d in rule_directives %}
|
||
<option value="{{ d }}">{{ d }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
<div class="form-group">
|
||
<label>动作</label>
|
||
<select name="action_type" class="form-input">
|
||
<option value="allow">allow</option>
|
||
<option value="deny">deny</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group" style="grid-column: span 2;">
|
||
<label>ACL 列表 <span class="hint">(空格分隔,! 表示取反,如 !localhost my_net)</span></label>
|
||
<input type="text" name="acls" class="form-input" placeholder="!localhost allowed_net">
|
||
</div>
|
||
<div class="form-group" style="grid-column: span 2;">
|
||
<label>备注</label>
|
||
<input type="text" name="comment" class="form-input">
|
||
</div>
|
||
</div>
|
||
<div class="form-actions">
|
||
<button type="submit" class="btn btn-primary">添加</button>
|
||
<button type="button" onclick="document.getElementById('add-form').style.display='none'" class="btn btn-secondary">取消</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<p class="card-desc">访问规则按顺序从上到下匹配,命中即停止。共 {{ rules | length }} 条规则。</p>
|
||
<p class="meta-text">可用的 ACL:
|
||
{% for name in acls_by_name.keys() %}
|
||
<code>{{ name }}</code>{% if not loop.last %} · {% endif %}
|
||
{% endfor %}
|
||
</p>
|
||
<form method="post">
|
||
<input type="hidden" name="_csrf" value="{{ csrf_token() }}">
|
||
<input type="hidden" name="action" value="save">
|
||
<div class="table-scroll">
|
||
<table class="data-table rules-table">
|
||
<thead>
|
||
<tr>
|
||
<th style="width:60px;">顺序</th>
|
||
<th style="width:160px;">指令</th>
|
||
<th style="width:100px;">动作</th>
|
||
<th>ACL</th>
|
||
<th>备注</th>
|
||
<th style="width:80px;">删除</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for r in rules %}
|
||
<tr>
|
||
<td>{{ loop.index }}
|
||
<input type="hidden" name="id[]" value="{{ loop.index }}">
|
||
</td>
|
||
<td>
|
||
<select name="directive[]" class="form-input">
|
||
{% for d in rule_directives %}
|
||
<option value="{{ d }}" {% if r.directive == d %}selected{% endif %}>{{ d }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</td>
|
||
<td>
|
||
<select name="action_type[]" class="form-input">
|
||
<option value="allow" {% if r.action == 'allow' %}selected{% endif %}>allow</option>
|
||
<option value="deny" {% if r.action == 'deny' %}selected{% endif %}>deny</option>
|
||
</select>
|
||
</td>
|
||
<td><input type="text" name="acls[]" value="{{ r.acls | join(' ') }}" class="form-input"></td>
|
||
<td><input type="text" name="comment[]" value="{{ r.comment }}" class="form-input"></td>
|
||
<td>
|
||
<button type="button" class="btn btn-danger btn-tiny" onclick="this.closest('tr').remove()">删除</button>
|
||
</td>
|
||
</tr>
|
||
{% endfor %}
|
||
{% if not rules %}
|
||
<tr><td colspan="6" class="empty-row">暂无规则。点击上方"添加规则"按钮开始。</td></tr>
|
||
{% endif %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
{% if rules %}
|
||
<div class="form-actions">
|
||
<button type="submit" class="btn btn-primary">💾 保存所有规则</button>
|
||
</div>
|
||
{% endif %}
|
||
</form>
|
||
</div>
|
||
|
||
<div class="card">
|
||
<h3 class="card-title">📖 规则说明</h3>
|
||
<ul>
|
||
<li><code>http_access</code>: 控制 HTTP 请求是否允许通过代理</li>
|
||
<li><code>https_access</code>: 控制 CONNECT 隧道 (HTTPS) 请求</li>
|
||
<li><code>icp_access</code>: 控制 ICP 查询 (邻居间)</li>
|
||
<li><code>snmp_access</code>: 控制 SNMP 监控访问</li>
|
||
<li><code>always_direct</code>: 强制直接访问 (不走 peer)</li>
|
||
<li><code>never_direct</code>: 强制走父代理</li>
|
||
<li>ACL 列表支持 <code>!</code> 取反,多个 ACL 之间为 AND 关系 (全部满足才匹配)</li>
|
||
</ul>
|
||
</div>
|
||
{% endblock %}
|