HTML无法记录访问者信息，因纯静态文件不经过服务器且浏览器API受限；真实日志需服务端生成，或通过后端代理+埋点实现，前端JS埋点仅适用于粗略统计。
HTML 本身无法记录谁访问了作品集
纯 HTML 是静态文件，浏览器打开时根本不经过服务器，document 或 window 没有 API 能获取来访者 IP、时间或设备信息。所谓“谁在何时查看”，HTML 单独做不到——这不是权限控制问题，是技术能力边界问题。
常见错误现象：404 页面里塞一段 console.log(new Date()) 就以为记下了访问日志；或者用 localStorage 存时间戳，结果换台电脑就清零、隐身模式不触发、爬虫根本不会执行 JS。
- 真实访问日志必须由服务器生成（如 Nginx 的
access.log、Apache 的mod_log_config） - 想关联“具体某人”，得用户主动登录（比如 OAuth 或表单提交），HTML 无法绕过浏览器同源策略去读取系统身份
- CDN 或静态托管（GitHub Pages、Vercel、Netlify）默认只提供极简访问统计（UV/PV），不存原始请求详情
用服务端代理 + 简单后端记录访问行为
如果你能部署一个轻量后端（哪怕只是个云函数），就能在用户点击作品链接前，先跳转到一个带埋点的中间页，由它记录再重定向。核心不是改 HTML，而是改路由逻辑。
使用场景：作品集托管在 GitHub Pages，但你有个 Vercel 函数 /log-visit 接收 POST 请求并写入数据库或 CSV。
立即学习“前端免费学习笔记（深入）”；
示例 HTML 中的作品链接要改写：
<a href="/log-visit?ref=project-01" target="_blank">查看《城市数据可视化》</a>
/log-visit 收到请求后可读取 req.headers['x-forwarded-for']（注意代理链）、new Date().toISOString()，再用 res.redirect(302, 'https://example.com/project-01.html') 跳转。
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 别依赖
req.ip：很多云平台返回的是内网地址，优先看x-forwarded-for并校验x-forwarded-proto - 避免日志被刷：加简单限流（如 1 分钟内同一 IP 只记 1 条），否则爬虫会撑爆你的存储
- 隐私合规：欧盟/国内要求明示收集行为，页面底部加一行小字“访问日志用于优化体验，不含个人身份信息”
前端配合埋点的最小可行方案
如果真没法上后端，只能靠前端 JS 埋点，那务必接受它的局限性：只能统计“打开了这个页面的浏览器实例”，不是“某个人”。适合内部演示或粗略热度参考。
关键不是用什么库，而是怎么发请求不阻塞页面、不被广告拦截器干掉：
- 用
navigator.sendBeacon()发送日志，页面卸载时也能发出（比fetch(..., { keepalive: true })兼容性更好） - 目标 URL 必须是同源，或对方明确允许跨域（
Access-Control-Allow-Origin: *），否则浏览器直接静默丢弃 - 不要在
DOMContentLoaded里立刻发——等 3 秒再发，过滤掉误点、快速回退的流量
示例代码片段（放在每个作品页底部）：
<script>
setTimeout(() => {
const data = JSON.stringify({
url: window.location.href,
ts: new Date().toISOString(),
ref: document.referrer
});
navigator.sendBeacon('/api/log', data);
}, 3000);
</script>
权限控制和日志不能混为一谈
“谁有权限看”和“谁看了”是两层事。HTML 里用 robots.txt 或 meta name="robots" 控制爬虫，用 .htaccess 或 CDN 的 IP 白名单控访问，但这些都不产生可读日志。
真正需要权限日志的场景（比如客户审核后台），应该用成熟方案：Auth0 记录登录事件、Cloudflare Access 输出审计日志、或自建 Express 中间件在 req.user 存在时写 DB。
- 别在 HTML 里藏
if (userRole === 'client') { showProject() }—— 前端判断毫无意义，源码一查全暴露 - 日志字段至少包含：时间戳、请求路径、用户标识（非明文 ID，用哈希或临时 token）、HTTP 状态码（区分 200 和 403）
- 最常被忽略的一点：日志存储本身要有访问控制。别让
/logs/access.csv能被任何人下载
事情说清了就结束
