阿里云 视频播放操作
1.1、找到视频点播
1.2、进入管理控制台
1.2、开通服务
1.3、选择“按使用流量计费”,开通服务
1.4、开通后,进入管理控制台
1.5、上传音 / 视频
1.6、启用存储地址
1.7、已启用
1.8、选择上传的音频,开始上传
1.9、上传成功
1.10、分类管理
1.11、视频转码
1.12、再上传一个视频,添加转码,分类上传
1.13、上传后,显示转码中,需要一点时间
使用工具类进行视频上传
2.1、引入依赖
<dependencies>
<dependency>
<groupId>com.aliyun</groupId>
<artifactId>aliyun-java-sdk-core</artifactId>
</dependency>
<dependency>
<groupId>com.aliyun.oss</groupId>
<artifactId>aliyun-sdk-oss</artifactId>
</dependency>
<dependency>
<groupId>com.aliyun</groupId>
<artifactId>aliyun-java-sdk-vod</artifactId>
</dependency>
<dependency>
<groupId>com.aliyun</groupId>
<artifactId>aliyun-sdk-vod-upload</artifactId>
</dependency>
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
</dependency>
<dependency>
<groupId>org.json</groupId>
<artifactId>json</artifactId>
</dependency>
<dependency>
<groupId>com.google.code.gson</groupId>
<artifactId>gson</artifactId>
</dependency>
<dependency>
<groupId>joda-time</groupId>
<artifactId>joda-time</artifactId>
</dependency>
</dependencies>
2.2、初始化类
public class InitObject {
public static DefaultAcsClient initVodClient(String accessKeyId, String accessKeySecret) throws ClientException {
String regionId = "cn-guangzhou"; // 点播服务接入区域
DefaultProfile profile = DefaultProfile.getProfile(regionId, accessKeyId, accessKeySecret);
DefaultAcsClient client = new DefaultAcsClient(profile);
return client;
}
}
2.3、测试类
public class TestVod {
public static void main(String[] args) {
String accessKeyId = "xxxx";
String accessKeySecret = "xxxxx";
String title = "6 - What If I Want to Move Faster - upload by sdk"; //上传之后文件名称
String fileName = "E:\\aaaaa\\6 - What If I Want to Move Faster.mp4"; //本地文件路径和名称
//上传视频的方法
UploadVideoRequest request = new UploadVideoRequest(accessKeyId, accessKeySecret, title, fileName);
/* 可指定分片上传时每个分片的大小,默认为2M字节 */
request.setPartSize(2 * 1024 * 1024L);
/* 可指定分片上传时的并发线程数,默认为1,(注:该配置会占用服务器CPU资源,需根据服务器情况指定)*/
request.setTaskNum(1);
UploadVideoImpl uploader = new UploadVideoImpl();
UploadVideoResponse response = uploader.uploadVideo(request);
if (response.isSuccess()) {
System.out.print("VideoId=" + response.getVideoId() + "\n");
} else {
/* 如果设置回调URL无效,不影响视频上传,可以返回VideoId同时会返回错误码。其他情况上传失败时,VideoId为空,此时需要根据返回错误码分析具体错误原因 */
System.out.print("VideoId=" + response.getVideoId() + "\n");
System.out.print("ErrorCode=" + response.getCode() + "\n");
System.out.print("ErrorMessage=" + response.getMessage() + "\n");
}
}
//1 根据视频iD获取视频播放凭证
public static void getPlayAuth() throws Exception{
DefaultAcsClient client = InitObject.initVodClient("xxxx", "xxxx");
GetVideoPlayAuthRequest request = new GetVideoPlayAuthRequest();
GetVideoPlayAuthResponse response = new GetVideoPlayAuthResponse();
request.setVideoId("990b13273e004b088da9a456ba425e28");
response = client.getAcsResponse(request);
System.out.println("playAuth:"+response.getPlayAuth());
}
//1 根据视频iD获取视频播放地址
public static void getPlayUrl() throws Exception{
//创建初始化对象
DefaultAcsClient client = InitObject.initVodClient("xxxx", "xxxx");
//创建获取视频地址request和response
GetPlayInfoRequest request = new GetPlayInfoRequest();
GetPlayInfoResponse response = new GetPlayInfoResponse();
//向request对象里面设置视频id
request.setVideoId("990b13273e004b088da9a456ba425e28");
//调用初始化对象里面的方法,传递request,获取数据
response = client.getAcsResponse(request);
List<GetPlayInfoResponse.PlayInfo> playInfoList = response.getPlayInfoList();
//播放地址
for (GetPlayInfoResponse.PlayInfo playInfo : playInfoList) {
System.out.print("PlayInfo.PlayURL = " + playInfo.getPlayURL() + "\n");
}
//Base信息
System.out.print("VideoBase.Title = " + response.getVideoBase().getTitle() + "\n");
}
}
2.4、运行
2.5、查看云服务器
使用springboot进行上传
3.1、引入依赖(同上)
3.2、配置application文件
# 服务端口
server.port=8003
# 服务名
spring.application.name=service-vod
# 环境设置:dev、test、prod
spring.profiles.active=dev
#阿里云 vod
#不同的服务器,地址不同
aliyun.vod.file.keyid=xxxx
aliyun.vod.file.keysecret=xxxx
# 最大上传单个文件大小:默认1M
spring.servlet.multipart.max-file-size=1024MB
# 最大置总上传的数据大小 :默认10M
spring.servlet.multipart.max-request-size=1024MB
3.3、获取配置中的值的Bean
@Component
public class ConstantVodUtils implements InitializingBean {
@Value("${aliyun.vod.file.keyid}")
private String keyid;
@Value("${aliyun.vod.file.keysecret}")
private String keysecret;
public static String ACCESS_KEY_SECRET;
public static String ACCESS_KEY_ID;
@Override
public void afterPropertiesSet() throws Exception {
ACCESS_KEY_ID = keyid;
ACCESS_KEY_SECRET = keysecret;
}
}
3.4、controller代码
@RestController
@RequestMapping("/eduvod/video")
@CrossOrigin
public class VodController {
@Autowired
private VodService vodService;
//上传视频到阿里云
@PostMapping("uploadAlyiVideo")
public R uploadAlyiVideo(MultipartFile file) {
//返回上传视频id
String videoId = vodService.uploadVideoAly(file);
return R.ok().data("videoId",videoId);
}
}
3.5、service代码
@Service
public class VodServiceImpl implements VodService {
@Override
public String uploadVideoAly(MultipartFile file) {
try {
//accessKeyId, accessKeySecret
//fileName:上传文件原始名称
// 01.03.09.mp4
String fileName = file.getOriginalFilename();
//title:上传之后显示名称
String title = fileName.substring(0, fileName.lastIndexOf("."));
//inputStream:上传文件输入流
InputStream inputStream = file.getInputStream();
UploadStreamRequest request = new UploadStreamRequest(ConstantVodUtils.ACCESS_KEY_ID,ConstantVodUtils.ACCESS_KEY_SECRET, title, fileName, inputStream);
UploadVideoImpl uploader = new UploadVideoImpl();
UploadStreamResponse response = uploader.uploadStream(request);
String videoId = null;
if (response.isSuccess()) {
videoId = response.getVideoId();
} else { //如果设置回调URL无效,不影响视频上传,可以返回VideoId同时会返回错误码。其他情况上传失败时,VideoId为空,此时需要根据返回错误码分析具体错误原因
videoId = response.getVideoId();
}
return videoId;
}catch(Exception e) {
e.printStackTrace();
return null;
}
}
}
3.6、swagger测试
3.7、服务器查看
整合前端进行上传
4.1 有nginx进行反向代理的设置
4.1.1、设置请求转发地址
location ~ /vod/ {
proxy_pass http://localhost:8003;
}
4.1.2、设置上传文件的大小限制
配置nginx上传文件大小,否则上传时会有 413 (Request Entity Too Large) 异常;
打开nginx主配置文件nginx.conf,找到http{},添加
client_max_body_size 1024m;
4.1.3、重启服务
nginx -s reload
或者 先关闭再启动
#关闭服务
nginx.exe -s stop
#启用
nginx.exe
4.2、前端实现-数据定义
fileList: [],//上传文件列表
BASE_API: process.env.BASE_API // 接口API地址
4.3、整合上传组件
<el-form-item label="上传视频">
<el-upload
:on-success="handleVodUploadSuccess"
:on-remove="handleVodRemove"
:before-remove="beforeVodRemove"
:on-exceed="handleUploadExceed"
:file-list="fileList"
:action="BASE_API+'/eduvod/video/uploadAlyiVideo'"
:limit="1"
class="upload-demo">
<el-button size="small" type="primary">上传视频</el-button>
<el-tooltip placement="right-end">
<div slot="content">最大支持1G,<br>
支持3GP、ASF、AVI、DAT、DV、FLV、F4V、<br>
GIF、M2T、M4V、MJ2、MJPEG、MKV、MOV、MP4、<br>
MPE、MPG、MPEG、MTS、OGG、QT、RM、RMVB、<br>
SWF、TS、VOB、WMV、WEBM 等视频格式上传</div>
<i class="el-icon-question"/>
</el-tooltip>
</el-upload>
</el-form-item>
4.4、方法回调
//上传视频成功调用的方法
handleVodUploadSuccess(response, file, fileList) {
//上传视频id赋值
this.video.videoSourceId = response.data.videoId
//上传视频名称赋值
this.video.videoOriginalName = file.name
},
handleUploadExceed() {
this.$message.warning('想要重新上传视频,请先删除已上传的视频')
},
4.5、页面上传文件
4.6、查看服务器
点击x删除上传
5.1、初始化类
public class InitVodCilent {
public static DefaultAcsClient initVodClient(String accessKeyId, String accessKeySecret) throws ClientException {
String regionId = "cn-shanghai"; // 点播服务接入区域
DefaultProfile profile = DefaultProfile.getProfile(regionId, accessKeyId, accessKeySecret);
DefaultAcsClient client = new DefaultAcsClient(profile);
return client;
}
}
5.2、删除接口
//根据视频id删除阿里云视频
@DeleteMapping("removeAlyVideo/{id}")
public R removeAlyVideo(@PathVariable String id) {
try {
//初始化对象
DefaultAcsClient client = InitVodCilent.initVodClient(ConstantVodUtils.ACCESS_KEY_ID, ConstantVodUtils.ACCESS_KEY_SECRET);
//创建删除视频request对象
DeleteVideoRequest request = new DeleteVideoRequest();
//向request设置视频id
request.setVideoIds(id);
//调用初始化对象的方法实现删除
client.getAcsResponse(request);
return R.ok();
}catch(Exception e) {
e.printStackTrace();
throw new GuliException(20001,"删除视频失败");
}
}
5.3、前端方法
5.4、点击x的事件,对应的方法
//点击确定调用的方法
handleVodRemove() {
//调用接口的删除视频的方法
video.deleteAliyunvod(this.video.videoSourceId)
.then(response => {
//提示信息
this.$message({
type: 'success',
message: '删除视频成功!'
});
//把文件列表清空
this.fileList = []
//把video视频id和视频名称值清空
//上传视频id赋值
this.video.videoSourceId = ''
//上传视频名称赋值
this.video.videoOriginalName = ''
})
},
//点击×调用这个方法
beforeVodRemove(file,fileList) {
return this.$confirm(`确定移除 ${ file.name }?`);
},
5.5、页面效果
5.6、服务器查看,已经删除
文章来源:https://www.toymoban.com/news/detail-784432.html
结束!!!!文章来源地址https://www.toymoban.com/news/detail-784432.html
如果你困在一个地方,每天都完全一样,做什么都改变不了状况,你会怎么办?
到了这里,关于springboot + vue 整合 阿里云 视频点播 功能的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!