“东莞梦幻网络科技”体育直播系统的短视频上传流程,与七牛云对接的实现思路和核心代码示例,包括上传签名、回调验证和存储路径规范。使用 ThinkPHP + MySQL + Redis + 七牛云架构。
一、上传流程概览
短视频上传涉及三步:前端拿到上传凭证 → 客户端上传视频 → 七牛云回调服务器确认入库。
流程图示意:
-
前端请求上传凭证
- 前端调用接口(
/api/video/getUploadToken
) - 后端生成七牛上传凭证(UploadToken),并返回给前端
- Token 包含上传策略、过期时间、回调 URL 等信息
- 前端调用接口(
-
客户端上传视频到七牛云
- 使用七牛官方 SDK 或表单直传
- 上传时附带上传凭证
-
七牛回调服务器
- 七牛上传完成后调用回调 URL
- 后端验证签名是否合法(防伪造)
- 将视频信息写入数据库(路径、大小、用户ID等)
- 返回 200 OK
二、实现思路
1. 后端生成上传凭证
核心思路:
-
使用七牛云 SDK 生成上传 token
-
设置上传策略:
callbackUrl
→ 七牛回调 URLcallbackBody
→ 回调参数(文件名、hash、用户ID等)saveKey
→ 视频存储路径规范(例如video/{userId}/{yyyyMMdd}/{random}.mp4
)
ThinkPHP 部分代码(PHP):
use Qiniu\Auth;
class VideoController extends Controller
{
public function getUploadToken()
{
$accessKey = config('qiniu.accessKey');
$secretKey = config('qiniu.secretKey');
$bucket = config('qiniu.bucket');
$auth = new Auth($accessKey, $secretKey);
// 存储路径规范
$userId = session('user_id');
$saveKey = "video/{$userId}/".date('Ymd')."/\$(fname)";
$policy = [
'callbackUrl' => config('app.url').'/api/video/callback',
'callbackBody' => 'filename=$(fname)&size=$(fsize)&hash=$(etag)&user_id='.$userId,
'saveKey' => $saveKey
];
$token = $auth->uploadToken($bucket, null, 3600, $policy);
return json(['uptoken' => $token, 'saveKey' => $saveKey]);
}
}
2. 前端上传视频
实现思路:
- 用七牛提供的 JS SDK(
qiniu-js
)和 H5 FormData + Ajax 上传 - 上传时需附带后端返回的
uptoken
- 上传完成自动触发七牛回调
部分 JS:
const file = document.getElementById('videoFile').files[0];
const formData = new FormData();
formData.append('file', file);
formData.append('token', uploadToken); // 后端返回的 token
fetch('https://upload.qiniup.com/', {
method: 'POST',
body: formData
})
.then(res => res.json())
.then(data => {
console.log('上传完成', data);
})
.catch(err => console.error(err));
3. 七牛云回调验证
核心思路:
- 七牛回调会带
Authorization
Header - 使用七牛 SDK 验证签名是否正确
- 验证通过后,将视频信息写入数据库
ThinkPHP 部分代码:
use Qiniu\Http\Client;
use Qiniu\Auth;
class VideoController extends Controller
{
public function callback()
{
$accessKey = config('qiniu.accessKey');
$secretKey = config('qiniu.secretKey');
$auth = new Auth($accessKey, $secretKey);
$body = file_get_contents("php://input");
$headers = getallheaders();
if (!$auth->verifyCallback($headers, $body, config('qiniu.callbackUrl'))) {
return json(['status' => 'fail', 'msg' => '签名验证失败'], 403);
}
$data = json_decode($body, true);
$videoData = [
'user_id' => $data['user_id'],
'filename' => $data['filename'],
'hash' => $data['hash'],
'size' => $data['size'],
'path' => "https://cdn.example.com/{$data['filename']}",
'created_at' => time(),
];
db('videos')->insert($videoData);
return json(['status' => 'success']);
}
}
4. 存储路径规范
video/{userId}/{yyyyMMdd}/{uuid}.mp4
- 用户 ID 分类目录
- 日期目录方便归档和清理
- 文件名使用原始文件名或 UUID 避免重复
- CDN 域名访问路径:
https://cdn.example.com/video/xxx/xxx.mp4
5. 总结
- 前端请求后端获取上传 token(带回调和存储规则)
- 前端用 token 上传文件到七牛
- 七牛回调后端接口
- 后端验证签名 → 写入数据库 → 返回成功
- 视频路径规范 + CDN 分发,方便播放和管理
點擊查看更多內(nèi)容
為 TA 點贊
評論
評論
共同學習,寫下你的評論
評論加載中...
作者其他優(yōu)質(zhì)文章
正在加載中
感謝您的支持,我會繼續(xù)努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦