项目部署地址:https://ssp-7yv.pages.dev/

星舞轻氧站演示效果:

星舞轻氧站API调用页面

这是一个用于调用视频API的星舞轻氧站网页应用,支持多种视频类型和输出格式。

技术文档

功能特性

  • 🎬 支持15种不同的视频类型
  • 📊 可选择MP4视频或JSON数据输出
  • 🔄 自动连续播放 - 视频播放完成后自动播放下一个同类型视频
  • ⏹️ 播放控制 - 可随时停止自动播放
  • 🎨 响应式设计,适配各种设备
  • ⚡ 实时状态反馈和错误处理
  • ⌨️ 键盘快捷键支持(Enter键快速获取)

使用方法

基本使用

  1. 打开 index.html 文件在浏览器中运行
  2. 选择您想要的视频类型
  3. 选择输出格式(MP4视频或JSON数据)
  4. 点击"获取视频"按钮
  5. 查看返回的视频内容或JSON数据

自动播放功能(MP4模式)

  • 自动连续播放:当选择MP4格式时,系统会自动生成一个视频队列
  • 循环播放:视频播放完成后会自动播放下一个同类型视频
  • 播放控制
    • 点击"停止自动播放"按钮可中断自动播放循环
    • 停止后可以重新选择类型开始新的播放队列
  • 状态显示:实时显示当前播放进度(第X个/总共Y个视频)

JSON数据模式

  • 返回API的原始JSON响应数据
  • 适合开发调试和数据查看

视频类型列表

ID 类型说明
jk jk类型视频
YuMeng 你得欲梦视频
NvDa 女大视频
NvGao 女高视频
ReWu 热舞类型视频
QingCun 清纯类型视频
YuZu 玉足类型视频
SheJie 蛇姐类型视频
ChuanDa 穿搭类型视频
GaoZhiLiangXiaoJieJie 高质量小姐姐视频
HanFu 汉服类型视频
HeiSi 黑手类型视频
BianZhuang 变装类型视频
LuoLi 萝莉类型视频
TianMei 甜妹类型视频
BaiSi 白丝类型视频

CORS问题解决方案

由于API服务器没有设置CORS头,浏览器会阻止跨域请求。以下是解决方案:

方案1:使用本地服务器

1
2
3
4
5
# 使用Python启动本地服务器
python -m http.server 8000

# 或使用Node.js的http-server
npx http-server

方案2:浏览器禁用CORS检查(开发环境)

  • Chrome: 启动时添加参数 --disable-web-security --user-data-dir
  • Firefox: 安装CORS Everywhere扩展

方案3:使用代理服务器

页面已集成CORS代理,JSON请求会自动使用代理服务。

API接口信息

  • 接口地址: http://api.mmp.cc/api/ksvideo
  • 请求方式: GET
  • 返回格式: JSON
  • 参数:
    • type: mp4(视频)或 json(数据)
    • id: 视频类型ID

文件结构

1
2
3
4
├── index.html          # 主页面
├── style.css # 样式文件
├── script.js # JavaScript逻辑
└── README.md # 说明文档

技术栈

  • HTML5 + CSS3
  • JavaScript (ES6+)
  • Fetch API
  • CSS Grid & Flexbox

浏览器兼容性

  • Chrome 60+
  • Firefox 55+
  • Safari 11+
  • Edge 79+

注意事项

  • 视频播放需要网络连接
  • JSON数据请求可能受CORS限制
  • 建议在支持CORS的服务器环境中运行
  • 视频内容由第三方API提供,本页面仅作为调用工具

开发说明

如需修改或扩展功能,请编辑对应的HTML、CSS和JavaScript文件。

代码实现块