手把手教会你如何使用宝塔+Vercel一键部署私人影视音乐站

图欧科技图欧科技2025-10-07 23:04:05来源:hiRip (hiripple.com/zh)阅读:42

大家好,我是Zkeq,继上次文章我用 Claude Code 开发了一整套影视站&音乐站(附源码与提示词),相信有不少朋友想要搭建同款音乐影视站,都又不知道该如何操作,今天再次应老板图欧君邀请,来教大家如何使用宝塔和 Vercel 部署属于自己的私人影视站和音乐站。

那么下面,就跟着我一起,从 0 开始一点一点部署这两个项目吧!

两个项目的的架构其实是类似,这里我们演示使用音乐站来进行部署。

一、前期准备

1.1 购买服务器

那么就开始吧,首先是需要购买一个服务器。这里,如果是腾讯云的新用户呢,那么之前就是没有买过服务器的朋友,可以从下面这个链接来进行购买:

Image

我购买的就是这一款,79 块钱 一年 4H4G,非常划算的一个服务器,买了之后,有什么 API 的小项目,都可以跑在上面,然后我的话,还有一个备案域名,这样再使用腾讯 CDN 加速下,全国访问的速度都是非常的快。

Image

点击购买之后,弹出购买框

Image
Image

点击购买,进行支付即可。

1.2 安装宝塔面板最新版

购买完成后呢,在腾讯轻量应用服务器这个控制台,可以看到刚才购买的服务器了。

Image

然后呢,点击右边的登录按钮,可以打开一个 网页端 Web 端的 Shell。

Image
Image

然后呢,去安装最新版的宝塔。

安装脚本:

Image

按 y 回车即可。

然后运行完毕之后 即可看到这样的一串字符串。

接着,我们需要去服务器安装组放行端口。

Image

添加安全组。

复制 外网面板地址 到浏览器,即可进行访问。

Image

首次进入会提示绑定账号和安装环境,这里选择 LNMP 即可。即为 (Linux、Nginx、MySQL 和 PHP)。

安装完毕后看到面板。

Image

接着,就开始部署我们的项目。

二、部署项目

2.1 下载压缩包

以上准备完毕之后,就可以开始部署项目啦:

👉

音乐站 Github 项目下载地址:https://github.com/zkeq/Self-Music

影视站 Github 项目下载地址:https://github.com/zkeq/Self-Cinema

首先要用别人的项目的话,出于礼貌的话,就是可以给别人点一点 star 哈哈哈哈,就是这样子也会让仓库的维护者非常开心。

那么点击去这个链接呢,看到的就是这样子的一个页面:

Image

那个 star 呢,就是一个小爱心的意思,star 越多呢,就代表这个项目越受人欢迎,那个 fork 呢,就代表要把这个项目拷贝一个副本 到自己的账户下面。

在这里部署呢,我们先部署的是后端,所以我们这两个按钮都不用,哈哈哈哈,我们用的是这个按钮。

Image

点击之后即可下载。

Image

2.2 上传压缩包到服务器并解压

然后呢,打开宝塔面板 -> 文件 /root 根目录,将压缩包拖动到网页上即可上传。

Image

右键压缩包,选择解压。

Image

解压之后,我们进入 /root/Self-Music/backend 这个文件夹,即可看到刚解压出来的后端。

Image

然后呢,根据仓库的提示:

👉
  • 音乐站仓库提示传送门:https://github.com/zkeq/Self-Music#-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B
  • 影视站仓库提示传送门:https://github.com/zkeq/Self-Cinema#-%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B

修改文件即可。

音乐站需修改的文件:

Image
Image

影视站需修改的文件:

Image
Image

2.3 添加项目并安装

Image
Image
Image
Image
Image

在这里讲解一个绑定 https 的教程。

进入 网站 -> 反向代理 -> 添加反代 ,填入一个你自己的域名,如果没有域名的话,可以去购买一个

然后在这里填入你要绑定的 API 域名,在这里使用 music-api.icodeq.com

Image

然后去 DNSPod 上面,添加 A 解析记录即可。

在这里我使用的 CloudFlare 演示的,其实都一样

Image

然后点开 SSL ,申请一个免费证书

Image

申请完毕后点击保存即可。

Image
Image

2.3 Vercel 一键部署

Vercel 是什么?

就是这是一个静态托管平台,可以将我们的前端项目进行一个网站托管,我们可以很方便的将自己的前端代码部署上去,并且个人免费的额度完全够用。

每月免费 100GB 流量,非常Nice。

Image

在下面的网址点进去,注册一个账号就行啦:

之后呢,就开始我们的前端部署,在这里,本项目提供一键部署按钮,可以点击按钮进行一键部署,但是缺点就是后续项目更新了,没办法点击按钮一键同步,又或者可以点击 Fork 功能(对的,就是上文提到的那个 Fork),点击这个按钮可以创建一个上下游分支的功能,我们可以有按钮可以一键更新前端代码,在这里两种方式都提供下。

👉

音乐站一键部署:https://vercel.com/new/clone?repository-url=https://github.com/zkeq/Self-Music/tree/main/frontend

影视站一键部署:https://vercel.com/new/clone?repository-url=https://github.com/zkeq/Self-Cinema/tree/main/frontend

点击这个按钮之后,会看到这样的页面。

Image

我们点击 Create 按钮即可。

Image

然后填入后端 API 地址,也就是刚才我们构建好的(需要注意的是,这里需要使用 https 链接)

Image

点击 Deploy 进行部署。

Image
Image

三、绑定域名

3.1 把网站绑定到自己的域名上

再点击 Domains , 即可绑定一个自己的域名。

Image
Image
Image
Image

接着去添加 CNAME 解析,在这里使用一个大佬的 国内优选解析地址 cname-vc.9420.ltd 会快很多,解决很多网络问题。

Image

添加完毕后,返回 vercel , 看到 蓝色对勾就代表已经部署完成。

Image

进行访问测试,即可部署完成。

Image
Image

大功告成,开始享用吧!

四、二次开发

4.1 使用 Fork 导入仓库

如果你有自己的动手能力,想要对源码进行二次开发,点击Vercle 页的 fork 按钮后,点击Create fork,就可以将仓库导入你的名下相当于开启一个副本分支)

Image
Image
Image

记得点开设置环境变量 NEXT_PUBLIC_API_URL

Image

好的朋友们,那么这就是本期为大家带来的部署影视站和音乐站的教程,希望大家玩的愉快,再次给大家放一下项目的地址,希望大家点点 star 哈哈哈哈,感谢感谢大家。

👉

音乐站 Github 地址:https://github.com/zkeq/Self-Music

影视站 Github 地址:https://github.com/zkeq/Self-Cinema

四、吐槽一下

在本文编写过程中,发现宝塔面板自带的 Python 项目 自带的 SSL 功能似乎是坏掉的,不能正常绑定域名使用,希望官方可以优化一下这个BUG。


好了,以上就是本期文章的全部内容,感谢你的观看!如果觉得不错,对你有所帮助,欢迎随手点赞、红心、转发三连一下,我们下期再见~


原文:Zkeq,润色:图欧君

https://icodeq.com



猜你想看

16支春夏自用香水|这几瓶被公认最好闻!简直就是行走的荷尔蒙
刹车油你知道多久换一次吗?
每天“打卡”刷万步?小心关节更受伤!
这五点想通了,你才有勇气买电动车
30万买车20万换电池,新能源车更换电池为什么这么贵?
夏天如何提高电动车的电池寿命,三点充电方式要记牢,别再充错了
剧情电影《五月十二月》解说文案
医生帮你粉碎五大癌症谣言
装修刮大白前必须明白这4点,等师傅刮完就晚了,关键省钱不开裂
英雄联盟pbe登录失败怎么办 无法登录问题解决方法汇总
这6种“光瓶白酒”,价格不到50元,却是老酒鬼认准的纯粮白酒
使用激素快速祛痘 关于祛痘的4大误区不要中招了
辨识手机是否已染“病毒”勿大意,小心你的隐私图外泄
为什么有的猪肉盖红章,有的盖蓝章?看完才明白,原来是这样!
如果想将一块机械表戴上一辈子,那这是你必须得看看的使用说明
45岁后,想要健康的身体,这4个要坚持,睡觉这3点要注意
你的车险怎么买的?是只看保费不看险种吗?
要复工啦!别慌,这份指南让你摆脱“春节综合征”
失业后,怎样从公司参保转为灵活就业参保?
彩票被弃奖的奖金会去哪里

推荐站点