|
|
@@ -1,27 +1,107 @@
|
|
|
<template>
|
|
|
- <view >
|
|
|
-
|
|
|
- 123
|
|
|
-
|
|
|
- </view>
|
|
|
+ <view id="player-con"></view>
|
|
|
</template>
|
|
|
|
|
|
+<script setup>
|
|
|
+ import {
|
|
|
+ videoPolicy,
|
|
|
+ getVideoAuth,
|
|
|
+ getVideoRefresh
|
|
|
+ } from "@/api/shipin.js"
|
|
|
+ import {
|
|
|
+ onLoad,
|
|
|
+ onReady
|
|
|
+ } from '@dcloudio/uni-app';
|
|
|
+ import {
|
|
|
+ ref,
|
|
|
+ reactive
|
|
|
+ } from "vue"
|
|
|
+ let videoUrl = 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4'
|
|
|
+ let pageData = reactive({
|
|
|
+ type: '',
|
|
|
+ partUrl: '',
|
|
|
+ downloadUrl: '',
|
|
|
+ videoId: '',
|
|
|
+ uploadAddress: '',
|
|
|
+ uploadAuth: '',
|
|
|
+ signature: '',
|
|
|
+ playauth: '',
|
|
|
+ })
|
|
|
|
|
|
-<script>
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- onReady: function (res) {
|
|
|
- console.log(this)
|
|
|
- // console.log(Aliplayer)
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
-
|
|
|
+ onReady(() => {
|
|
|
+ getPlayAuth()
|
|
|
+ }),
|
|
|
+ onLoad(() => {
|
|
|
+
|
|
|
+ })
|
|
|
+
|
|
|
+ // function getVideoId(){
|
|
|
+ // let req ={
|
|
|
+ // fileName:videoUrl,
|
|
|
+ // title:"测试视频"
|
|
|
+ // }
|
|
|
+ // videoPolicy(req).then(res=>{
|
|
|
+ // pageData.videoId = res.data.videoId
|
|
|
+ // getPlayAuth()
|
|
|
+ // })
|
|
|
+ // }
|
|
|
+
|
|
|
+ function getPlayAuth() {
|
|
|
+ let req = {
|
|
|
+ videoId: 'b997f16cb9cb474cb93526cff77d8801'
|
|
|
}
|
|
|
+ getVideoAuth(req).then(res => {
|
|
|
+ pageData.playauth = res.data
|
|
|
+ playAli()
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
+ function playAli() {
|
|
|
+ let configData = {
|
|
|
+ "id": "player-con",
|
|
|
+ "vid": 'b997f16cb9cb474cb93526cff77d8801',
|
|
|
+ "playauth": pageData.playauth,
|
|
|
+ "qualitySort": "asc",
|
|
|
+ "format": "m3u8",
|
|
|
+ "mediaType": "video",
|
|
|
+ "encryptType": 1,
|
|
|
+ "width": '100%',
|
|
|
+ progressMarkers: [{
|
|
|
+ offset: 30,
|
|
|
+ isCustomized: true,
|
|
|
+ coverUrl: 'https://alivc-demo-vod.aliyuncs.com/image/cover/9A3F562E595E4764AD1DD546FA52C6E5-6-2.png',
|
|
|
+ title: 'test title',
|
|
|
+ describe: 'test string',
|
|
|
+ }, {
|
|
|
+ offset: 50,
|
|
|
+ isCustomized: true,
|
|
|
+ coverUrl: 'https://alivc-demo-vod.aliyuncs.com/image/cover/1E7F402241CD4C0F94AD2BBB5CCC3EC7-6-2.png',
|
|
|
+ title: 'test title',
|
|
|
+ describe: 'test string',
|
|
|
+ }, {
|
|
|
+ offset: 150,
|
|
|
+ isCustomized: true,
|
|
|
+ coverUrl: 'https://alivc-demo-vod.aliyuncs.com/image/cover/553AEA01161342C8A2B1756E83B69B5B-6-2.png',
|
|
|
+ title: 'test title',
|
|
|
+ describe: 'test string',
|
|
|
+ }, {
|
|
|
+ offset: 120,
|
|
|
+ isCustomized: true,
|
|
|
+ coverUrl: 'https://alivc-demo-vod.aliyuncs.com/image/cover/553AEA01161342C8A2B1756E83B69B5B-6-2.png',
|
|
|
+ title: 'test title',
|
|
|
+ describe: 'test string',
|
|
|
+ }],
|
|
|
+ "height": '500px',
|
|
|
+ "autoplay": false,
|
|
|
+ "isLive": false,
|
|
|
+ "rePlay": false,
|
|
|
+ "playsinline": true,
|
|
|
+ "preload": false,
|
|
|
+ "controlBarVisibility": "hover",
|
|
|
+ "useH5Prism": true
|
|
|
+ }
|
|
|
+ var player = new Aliplayer(configData, function(player) {
|
|
|
+ console.log('The player is created.')
|
|
|
+ });
|
|
|
+ }
|
|
|
</script>
|
wangguoyu