星之空二次元风格官网源码

星之空，一个梦幻二次元主题个人网站，支持自定义内容与后台管理，多设备实时同步，打造专属的动漫风格展示空间。

核心架构特点

• 前后端分离：纯静态 HTML + PHP API
• 双缓存策略：服务器 JSON 文件 + 浏览器 localStorage 双重缓存
• 定时轮询同步：前端每 10 秒自动拉取服务器数据，实现多设备实时同步
• 离线降级：服务器不可用时自动切换到本地 localStorage 缓存
• 频率限制：后端基于 IP + JSON 文件的请求频率控制
• 图片处理：Canvas 压缩上传图片为 Base64，降低存储压力
• CORS 跨域支持：后端配置了灵活的跨域白名单

其他特性

• 粒子动画：CSS + JS 实现的樱花飘落效果
• IntersectionObserver：滚动触发动画（元素淡入效果）
• 全屏轮播：原生 JS 实现的 Hero 区图片轮播（支持触摸滑动和键盘导航）
• 响应式设计：适配桌面端和移动端

伪静态配置

location /api/ {
    rewrite ^/api/(.*)$ /api.php/api/$1 last;
}

location ~ /(site-data\.json|rate-limit\.json|locks/) {
    deny all;
}

初始化数据文件 & 设置权限

cd /www/wwwroot/您的域名

# 1. 创建数据文件
touch site-data.json rate-limit.json

# 2. 改权限（宝塔上传的文件所有者是 root，PHP 以 www 用户运行）
chown -R www:www /www/wwwroot/您的域名/
chmod 666 site-data.json rate-limit.json

# 3. 初始化默认数据
php -r "require 'api.php'; readData();"

# 4. 确认文件已创建
ls -la site-data.json

看到文件信息就说明成功了。

验证

浏览器依次打开：

| `http://您的域名/` | 前台首页正常显示 |
| `http://您的域名/admin.html` | 后台管理页面 |
| `http://您的域名/api/health` | 返回 `{"success":true,"status":"ok"}` |

常见问题

问题1：后台修改后 JSON 文件没有被写入

原因：文件所有者是 root，PHP 以 www 用户运行，没有写入权限。

解决办法

cd /www/wwwroot/您的域名
chown www:www site-data.json rate-limit.json
chmod 666 site-data.json rate-limit.json

问题2：site-data.json 文件不存在

原因：数据文件被误删或首次部署未创建

解决办法

cd /www/wwwroot/您的域名
touch site-data.json rate-limit.json
chown www:www site-data.json rate-limit.json
chmod 666 site-data.json rate-limit.json
php -r "require 'api.php'; readData();"

问题3：其他设备看不到修改后的界面

原因：文件权限问题导致保存未写入服务器。

解决办法

先按问题1修复权限，确认后台能正常保存后，其他设备刷新即可看到