星之空二次元风格官网源码
浏览:51 留言:0
手机扫我访问

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

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

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

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

核心架构特点

  • 前后端分离:纯静态 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修复权限,确认后台能正常保存后,其他设备刷新即可看到(最多10秒自动同步)。

图片[1]-星之空二次元风格官网源码-茉莉小栈
ScreenShot_2026-06-26_205815_522
ScreenShot_2026-06-26_205808_791
ScreenShot_2026-06-26_205805_346
ScreenShot_2026-06-26_205801_614
ScreenShot_2026-06-26_205757_816
ScreenShot_2026-06-26_205751_646
© 版权声明
THE END
喜欢就支持一下吧
点赞15 分享
评论 抢沙发

请登录后发表评论

    请登录后查看评论内容