0基础花了两天用gpt-5.3-codex搓了个音乐播放器

Web 编程语言 AIcodex
浏览数 - 65发布于 - 2026-03-14 - 01:05

      我的水平也就cmd敲个pip install那种,上个星期很好奇那种b站上看到的歌曲推荐视频的音乐播放器效果是怎么做的,发现还要pr或者剪映制作,我在想能不能直接做出来一个,然后刷到视频发现gpt-5.3-codex可以免费用,也是在vscode上使用codex插件尝试制作了。

      一个账号的额度每七天重置,一个号我就用了一整天了,有七个号那就可以无限白嫖。我直接弄三个号,哎呀真爽。

  • ——3.10 刷视频发现codex官方取消掉5.3-codex和5.4模型了,那些人批量注册账号太狠了。还好我提前弄了。

     

     一开始是直接画个图给ai看做个大概出来,就想着做个网页端的播放器。

     先生成了这个初步的页面,后面就继续完善主页面(歌词滚动、音频可视化、音乐播放控制台、歌词循环)、侧边栏(获取api、背景设置、账号登录)、保存各项设置等。

      这里就不写什么过程了,前前后后和ai对话了几十次,大部分时间都是耗在推理上,有会员的话应该就能快点。

IMG20260304162946.jpg屏幕截图 2026-03-04 163934.png

侧边栏

鼠标移动到主页面右侧就能弹出,经过了一天折腾差不多就这样了,浏览器截不了全部

image.png

主页面

基本就先这样,没那么花里胡哨,简单点甚好。

当然控制台的播放键啥的也是ai生成的,然后ps扣出来就行

image.png

api接入和启动方法

      当然很大一部分功能还是要靠api,这里我用的是网易云的接口,毕竟我习惯用了,然后本地部署那些东西也成功了,也实现了登录功能,具体看这里就行。

https://github.com/neteasecloudmusicapienhanced/api-enhanced

      用bat文件启动的时候可以把这个api接口也一起启动了,然后就能跳到网页去

歌词循环

      等了30多分钟,这下把歌词循环给弄出来了,还支持ctrl选择歌词和shift一键选择循环,想单听一行歌词学唱还是很有帮助的。之前用网易云的时候还得手动放回去,这下不需要这么麻烦了,主流的好像就没看到有播放器支持这功能,还得是ai,这也能做出来。

屏幕截图 2026-03-05 204326.png

高亮选择后出现循环按钮

image.png

点击循环按钮后窗口控制

image.png

下载歌曲/切换音质

后面刷手机等了50分钟没白等,真的可以下载歌曲和切换音质了

image.pngimage.pngimage.png

背景图

支持三种背景(歌曲封面/图片/视频),然后给图片弄了裁剪放大旋转功能,不过有点小瑕疵但问题不大

image.png

设置保存

刷新网页后就能保存设置了,这下再也不用再选一次歌曲了

image.png

总结

      用下来挺牛逼的,关键是就算生成的东西有点错误他也能修好,当然还是需要人工引导,有时候也需要自己想想是什么问题导致的错误,基本上我就靠这样把问题弄好了。

      我在纸上画的设计图和潦草的文字也能识别,放在以前不可能做到。而且思考的时候还能检查,就是慢了点,关键是直接在代码修改,就不像网页端还要复制,特别是像我后面这script.js文件的代码已经4k多行了,要是浏览器复制人都麻了。虽然感觉存在ai史山,不过能跑就行而且我也不会看啊!

      当然肯定还有很多东西有可以优化,就这些功能放在其他播放器里基本都有而且更好,像ui那些东西其实都不是什么大问题,有设计图和对应的图片素材ai一下就能改出来。

      换做以前弄出这玩意应该要学挺久的吧,敲代码都不知道要敲多久。放在现在真就用ai花个几天就能搞定。

      现在想想或者直接给codex上传音乐播放器的需求文档,把想要的效果和功能描述什么的全部写下。这样应该能一次性大多数效果,我这样一点一点加就慢多了。

image.png

本文版权遵循 CC BY-NC 协议 本站版权政策

1 条回复

dsfwvwvw
发布于 2026-03-14 - 01:19

末 满 18 岁 勿 入 【 32kw.club 】【 mc57.shop 】

(。>︿<。) 已经一滴回复都不剩了哦~