当前位置: 首页 > java >正文

实现视频分片上传 OSS

访问 OSS 有两种方式,本文用到的是使用临时访问凭证上传到 OSS,不同语言版本的代码参考:

使用STS临时访问凭证访问OSS_对象存储(OSS)-阿里云帮助中心

1.安装并使用

首先我们要安装 OSS:

npm install ali-oss --save

接着我们创建一个 oss.js 文件,编写如下代码:

const axios = require("axios");
const OSS = require("ali-oss");export let client = null
export let object_name = ''export const getToken = async (ext) => {const formData = {ext: ext,csrf_token: window.sessionStorage.getItem('csrf-token'),}const res = await axios.post('your-path', formData)const token = res.data.dataclient = new OSS({region: token.region,accessKeyId: token.AccessKeyId,accessKeySecret: token.AccessKeySecret,stsToken: token.SecurityToken,authorizationV4: true,bucket: token.bucket,})object_name = token.object_name
}

后端接口返回的参数结构如图:

接下来即可使用 OSS 的 client.multipartUpload 进行分片上传:

const uploadArt = () => {const inputFile = document.createElement('input');inputFile.type = 'file';inputFile.accept = 'video/*'inputFile.multiple = false // 是否可以批量上传inputFile.addEventListener('change', async (event) => {const files = event.target.files;if (!files || files.length === 0) returnif (art_type.value === 'video') {const file = files[0]if (!file.name.endsWith('.mp4') && !file.name.endsWith('.mov')) {Modal.message({status: 'error',message: '请上传.mov或.mp4格式的视频!',duration: 3000})return}if (file.size > 300 * 1024 * 1024) {Modal.message({status: 'error',message: '视频不能大于300MB!',duration: 3000})return}const ext = file.name.split('.').pop()await getToken(ext)const res = await client.multipartUpload(object_name, file)if(res) {videoUrl.value = {url: window.sessionStorage.getItem("video_url"),object_name: window.sessionStorage.getItem("video_object_name")}const url = stripQueryParams(res.res.requestUrls[0])await autoUploadPoster(`${url}?x-oss-process=video/snapshot,t_0,f_jpg`) // 获取封面图并上传}}});inputFile.click();
}

上传之后拿到的视频 url 可以调用如下方法获取视频第一帧作为视频封面:

`${url}?x-oss-process=video/snapshot,t_0,f_jpg`

分片效果如图: 

上述代码是每次上传一个视频,如果想批量上传,可设置:

inputFile.multiple = true // 是否可以批量上传

并视频 for 循环遍历各个文件进行上传。可查看文档,参考上传的回调,获取上传进度等,本文主要讲述 OSS 封装的操作,视频上传仅为使用实例。

http://www.xdnf.cn/news/6654.html

相关文章:

  • 深入浅出横向联邦学习、纵向联邦学习、联邦迁移学习
  • 25-05-16计算机网络学习笔记Day1
  • idea 保证旧版本配置的同时,如何从低版本升到高版本
  • 黑马k8s(八)
  • JSON格式详解
  • 基于MCP的桥梁设计规范智能解析与校审系统构建实践
  • npm和nvm和nrm有什么区别
  • EasyExcel导出excel再转PDF转图片详解
  • 卷积神经网络踩坑全记录
  • 5.16本日总结
  • C语言实现INI配置文件读取和写入
  • 内核性能测试(60s不丢包性能)
  • 《Elasticsearch 源码解析与优化实战》笔记
  • 【C/C++】C++中引用类型私有成员的设计与应用
  • MapReduce Shuffle 全解析:从 Map 端到 Reduce 端的核心数据流​
  • Java 常用的Arrays函数
  • Mysql、Oracle、Sql Server、达梦之间sql的差异
  • 弦理论的额外维度指的是什么,宇宙中有何依据
  • 成功案例丨从草图到鞍座:用先进的发泡成型仿真技术变革鞍座制造
  • 【Python+flask+mysql】网易云数据可视化分析(全网首发)
  • yocto5.2开发任务手册-7 升级配方
  • 【编译原理】递归下降分析程序的构造
  • 排序算法之高效排序:快速排序,归并排序,堆排序详解
  • 实例分割AI数据标注 ISAT自动标注工具使用方法
  • 如何在win11上 运行arm虚拟机
  • labelimg安装及使用指南(yolo)
  • VR场景制作如何完成?
  • 图像处理:预览并绘制图像细节
  • 汽车二自由度系统模型以及电动助力转向系统模型
  • LearnOpenGL --- 你好三角形