小白级教程,让你的网站支持浏览历史记录
第一步放入记录脚本可以跟你的统计代码放在一起在你的网页插入这段代码script srchttps://api.afmax.cn/so/history/index.php?writer.js/script第2步使用插入浏览查看代码手机效果截图!-- ID1经常访问/访问频次排序 num12输出12条--scriptsrchttps://api.afmax.cn/so/history/index.php?id1num12.js/script!-- ID2最近访问 num12输出12条--scriptsrchttps://api.afmax.cn/so/history/index.php?id2num12.js/script推荐方法1实时更新或者下载浏览历史记录查看页HTML到你的服务器https://file.afmax.cn/A/%E6%BA%90%E7%A0%81/PHP/%E5%8E%86%E5%8F%B2%E8%AE%B0%E5%BD%95%E6%9F%A5%E7%9C%8Blook.zip第3步可选首页插入 Cookie 提示scriptsrchttps://api.afmax.cn/use/cookie-consent.js/script完成补充说明 网站浏览记录系统 - 集成指南重要说明数据存储遵循浏览器同源策略✅ 同一域名下的数据可以共享❌ 不同域名的数据完全隔离 需要在同一域名下使用 writer.js 和展示页面 一、数据隔离机制浏览器同源策略localStorage 按域名隔离site-a.com 的 localStorage└─ 只能被 site-a.com 的页面访问site-b.com 的 localStorage└─ 只能被 site-b.com 的页面访问api.afmax.cn 的 localStorage└─ 只能被 api.afmax.cn 的页面访问关键理解 writer.js 会记录到当前页面域名的 localStorage 展示页面只能读取自己域名的 localStorage 不同域名之间无法共享数据使用 iook.html适用场景只需要展示页面不需要完整系统步骤1. 下载 iook.html2. 上传到你的服务器例如https://your-site.com/history.html3. 在页面中引入scriptsrchttps://api.afmax.cn/so/history/index.php?writer.js/script注意writer.js 可以跨域加载但数据会记录到当前页面的域名4. 查看记录访问https://your-site.com/look.html数据流your-site.com 页面 ↓ writer.js (从 api.afmax.cn 加载但执行在 your-site.com) 写入 your-site.com 的 localStorage ✓ ↓ your-site.com/look.html 读取 your-site.com 的 localStorage ✓❌ 三、常见错误错误 1跨域名查看记录❌ 错误示例!-- site-a.com --scriptsrchttps://api.afmax.cn/so/history/index.php?writer.js/script然后访问https://api.afmax.cn/so/history/index.php查看记录结果看不到任何记录原因site-a.com 页面 ↓ writer.js 写入 site-a.com 的 localStorage api.afmax.cn/so/history/index.php 读取 api.afmax.cn 的 localStorage空的错误 2误解数据共享❌ 错误理解“我的网站引入了 api.afmax.cn 的 writer.js用户访问 api.afmax.cn 就能看到在我的网站上的浏览记录”✅ 正确理解“writer.js 虽然从 api.afmax.cn 加载但执行在当前页面数据记录到当前域名的 localStorage。不同域名的数据完全隔离。” 问题排查Q1: 为什么看不到记录检查清单✅ writer.js 是否正确加载查看控制台✅ writer.js 和展示页面是否在同一域名下✅ localStorage 是否有数据控制台查看调试方法// 在浏览器控制台执行console.log(localStorage.getItem(__hist_records));Q2: 如何验证数据隔离测试步骤在site-a.com引入 writer.js 并访问页面在site-a.com查看记录 → 应该能看到访问api.afmax.cn/so/history/index.php→ 看不到site-a.com的记录在api.afmax.cn上访问页面并查看记录 → 只能看到api.afmax.cn的记录Q3: 可以跨域名共享数据吗答案❌ 不可以浏览器安全限制