阿里云 視頻播放操作

1.1、找到視頻點(diǎn)播

1.2、進(jìn)入管理控制臺

1.2、開通服務(wù)

1.3、選擇“按使用流量計費(fèi)”，開通服務(wù)

1.4、開通后，進(jìn)入管理控制臺

1.5、上傳音 / 視頻

1.6、啟用存儲地址

1.7、已啟用

1.8、選擇上傳的音頻，開始上傳

1.9、上傳成功

1.10、分類管理

1.11、視頻轉(zhuǎn)碼

1.12、再上傳一個視頻，添加轉(zhuǎn)碼，分類上傳

1.13、上傳后，顯示轉(zhuǎn)碼中，需要一點(diǎn)時間

使用工具類進(jìn)行視頻上傳

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"; // 點(diǎn)播服務(wù)接入?yún)^(qū)域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);/* 可指定分片上傳時每個分片的大小，默認(rèn)為2M字節(jié) */request.setPartSize(2 * 1024 * 1024L);/* 可指定分片上傳時的并發(fā)線程數(shù)，默認(rèn)為1，(注：該配置會占用服務(wù)器CPU資源，需根據(jù)服務(wù)器情況指定）*/request.setTaskNum(1);UploadVideoImpl uploader = new UploadVideoImpl();UploadVideoResponse response = uploader.uploadVideo(request);if (response.isSuccess()) {System.out.print("VideoId=" + response.getVideoId() + "\n");} else {/* 如果設(shè)置回調(diào)URL無效，不影響視頻上傳，可以返回VideoId同時會返回錯誤碼。其他情況上傳失敗時，VideoId為空，此時需要根據(jù)返回錯誤碼分析具體錯誤原因 */System.out.print("VideoId=" + response.getVideoId() + "\n");System.out.print("ErrorCode=" + response.getCode() + "\n");System.out.print("ErrorMessage=" + response.getMessage() + "\n");}}//1 根據(jù)視頻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 根據(jù)視頻iD獲取視頻播放地址public static void getPlayUrl() throws Exception{//創(chuàng)建初始化對象DefaultAcsClient client = InitObject.initVodClient("xxxx", "xxxx");//創(chuàng)建獲取視頻地址request和responseGetPlayInfoRequest request = new GetPlayInfoRequest();GetPlayInfoResponse response = new GetPlayInfoResponse();//向request對象里面設(shè)置視頻idrequest.setVideoId("990b13273e004b088da9a456ba425e28");//調(diào)用初始化對象里面的方法，傳遞request，獲取數(shù)據(jù)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、運(yùn)行

2.5、查看云服務(wù)器

使用springboot進(jìn)行上傳

3.1、引入依賴（同上）

3.2、配置application文件

# 服務(wù)端口 server.port=8003 # 服務(wù)名 spring.application.name=service-vod# 環(huán)境設(shè)置：dev、test、prod spring.profiles.active=dev#阿里云 vod #不同的服務(wù)器，地址不同 aliyun.vod.file.keyid=xxxx aliyun.vod.file.keysecret=xxxx# 最大上傳單個文件大小：默認(rèn)1M spring.servlet.multipart.max-file-size=1024MB # 最大置總上傳的數(shù)據(jù)大小 ：默認(rèn)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;@Overridepublic void afterPropertiesSet() throws Exception {ACCESS_KEY_ID = keyid;ACCESS_KEY_SECRET = keysecret;} }

3.4、controller代碼

@RestController @RequestMapping("/eduvod/video") @CrossOrigin public class VodController {@Autowiredprivate VodService vodService;//上傳視頻到阿里云@PostMapping("uploadAlyiVideo")public R uploadAlyiVideo(MultipartFile file) {//返回上傳視頻idString videoId = vodService.uploadVideoAly(file);return R.ok().data("videoId",videoId);} }

3.5、service代碼

@Service public class VodServiceImpl implements VodService {@Overridepublic String uploadVideoAly(MultipartFile file) {try {//accessKeyId, accessKeySecret//fileName：上傳文件原始名稱// 01.03.09.mp4String 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 { //如果設(shè)置回調(diào)URL無效，不影響視頻上傳，可以返回VideoId同時會返回錯誤碼。其他情況上傳失敗時，VideoId為空，此時需要根據(jù)返回錯誤碼分析具體錯誤原因videoId = response.getVideoId();}return videoId;}catch(Exception e) {e.printStackTrace();return null;}} }

3.6、swagger測試

3.7、服務(wù)器查看

整合前端進(jìn)行上傳

4.1 有nginx進(jìn)行反向代理的設(shè)置

4.1.1、設(shè)置請求轉(zhuǎn)發(fā)地址

location ~ /vod/ { proxy_pass http://localhost:8003; }

4.1.2、設(shè)置上傳文件的大小限制

配置nginx上傳文件大小，否則上傳時會有 413 (Request Entity Too Large) 異常；
打開nginx主配置文件nginx.conf，找到http{}，添加

client_max_body_size 1024m;

4.1.3、重啟服務(wù)

nginx -s reload

或者 先關(guān)閉再啟動

#關(guān)閉服務(wù) nginx.exe -s stop #啟用 nginx.exe

4.2、前端實(shí)現(xiàn)-數(shù)據(jù)定義

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、方法回調(diào)

//上傳視頻成功調(diào)用的方法handleVodUploadSuccess(response, file, fileList) {//上傳視頻id賦值this.video.videoSourceId = response.data.videoId//上傳視頻名稱賦值this.video.videoOriginalName = file.name},handleUploadExceed() {this.$message.warning('想要重新上傳視頻，請先刪除已上傳的視頻')},

4.5、頁面上傳文件

4.6、查看服務(wù)器

點(diǎn)擊x刪除上傳

5.1、初始化類

public class InitVodCilent {public static DefaultAcsClient initVodClient(String accessKeyId, String accessKeySecret) throws ClientException {String regionId = "cn-shanghai"; // 點(diǎn)播服務(wù)接入?yún)^(qū)域DefaultProfile profile = DefaultProfile.getProfile(regionId, accessKeyId, accessKeySecret);DefaultAcsClient client = new DefaultAcsClient(profile);return client;} }

5.2、刪除接口

//根據(jù)視頻id刪除阿里云視頻@DeleteMapping("removeAlyVideo/{id}")public R removeAlyVideo(@PathVariable String id) {try {//初始化對象DefaultAcsClient client = InitVodCilent.initVodClient(ConstantVodUtils.ACCESS_KEY_ID, ConstantVodUtils.ACCESS_KEY_SECRET);//創(chuàng)建刪除視頻request對象DeleteVideoRequest request = new DeleteVideoRequest();//向request設(shè)置視頻idrequest.setVideoIds(id);//調(diào)用初始化對象的方法實(shí)現(xiàn)刪除client.getAcsResponse(request);return R.ok();}catch(Exception e) {e.printStackTrace();throw new GuliException(20001,"刪除視頻失敗");}}

5.3、前端方法

5.4、點(diǎn)擊x的事件，對應(yīng)的方法

//點(diǎn)擊確定調(diào)用的方法handleVodRemove() {//調(diào)用接口的刪除視頻的方法video.deleteAliyunvod(this.video.videoSourceId).then(response => {//提示信息this.$message({type: 'success',message: '刪除視頻成功!'});//把文件列表清空this.fileList = []//把video視頻id和視頻名稱值清空//上傳視頻id賦值this.video.videoSourceId = ''//上傳視頻名稱賦值this.video.videoOriginalName = ''}) }, //點(diǎn)擊×調(diào)用這個方法 beforeVodRemove(file,fileList) {return this.$confirm(`確定移除 ${ file.name }？`); },

5.5、頁面效果

5.6、服務(wù)器查看，已經(jīng)刪除

結(jié)束！！！！

---

如果你困在一個地方，每天都完全一樣，做什么都改變不了狀況，你會怎么辦？

總結(jié)

以上是生活随笔為你收集整理的springboot + vue 整合 阿里云 视频点播 功能的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。