修复分享功能

panlinlin

2021-05-06 429817b8c4937b1601fe7e824e81bbe3c965d367

修复分享功能

 web_src/src/components/dialog/devicePlayer.vue

@@ -14,15 +14,27 @@
                    </div>
                    <div style="display: flex; margin-bottom: 0.5rem; height: 2.5rem;">
                        <span style="width: 5rem; line-height: 2.5rem; text-align: right;">播放地址：</span>
                        <el-input v-model="getPlayerShared.sharedUrl" :disabled="true" v-on:click.native="copySharedInfo(getPlayerShared.sharedUrl)"></el-input>
                        <el-input v-model="getPlayerShared.sharedUrl" :disabled="true" >
                          <template slot="append">
                            <i class="cpoy-btn el-icon-document-copy"  title="点击拷贝" v-clipboard="getPlayerShared.sharedUrl" @success="$message({type:'success', message:'成功拷贝到粘贴板'})"></i>
                          </template>
                        </el-input>
                    </div>
                    <div style="display: flex; margin-bottom: 0.5rem; height: 2.5rem;">
                        <span style="width: 5rem; line-height: 2.5rem; text-align: right;">iframe：</span>
                        <el-input v-model="getPlayerShared.sharedIframe" :disabled="true" v-on:click.native="copySharedInfo(getPlayerShared.sharedIframe)"></el-input>
                        <el-input v-model="getPlayerShared.sharedIframe" :disabled="true" >
                          <template slot="append">
                            <i class="cpoy-btn el-icon-document-copy"  title="点击拷贝" v-clipboard="getPlayerShared.sharedIframe" @success="$message({type:'success', message:'成功拷贝到粘贴板'})"></i>
                          </template>
                        </el-input>
                    </div>
                    <div style="display: flex; margin-bottom: 0.5rem; height: 2.5rem;">
                        <span style="width: 5rem; line-height: 2.5rem; text-align: right;">资源地址：</span>
                        <el-input v-model="getPlayerShared.sharedRtmp" :disabled="true" v-on:click.native="copySharedInfo(getPlayerShared.sharedRtmp)"></el-input>
                        <el-input v-model="getPlayerShared.sharedRtmp" :disabled="true" >
                          <template slot="append">
                            <i class="cpoy-btn el-icon-document-copy"  title="点击拷贝" v-clipboard="getPlayerShared.sharedRtmp" @success="$message({type:'success', message:'成功拷贝到粘贴板'})"></i>
                          </template>
                        </el-input>
                    </div>
                </el-tab-pane>
                <!--{"code":0,"data":{"paths":["22-29-30.mp4"],"rootPath":"/home/kkkkk/Documents/ZLMediaKit/release/linux/Debug/www/record/hls/kkkkk/2020-05-11/"}}-->
@@ -148,9 +160,10 @@
    },
    computed: {
        getPlayerShared: function () {

            return {
                sharedUrl: window.location.host + '/' + this.videoUrl,
                sharedIframe: '<iframe src="' + window.location.host + '/' + this.videoUrl + '"></iframe>',
                sharedUrl: window.location.origin + '/#/play/wasm/' + encodeURIComponent(this.videoUrl),
                sharedIframe: '<iframe src="' + window.location.origin + '/#/play/wasm/' + encodeURIComponent(this.videoUrl) + '"></iframe>',
                sharedRtmp: this.videoUrl
            };
        }

 web_src/src/components/dialog/easyPlayer.vue

@@ -14,10 +14,14 @@
    },
    props: ['videoUrl', 'error', 'hasaudio'],
    mounted () {
      let paramUrl = decodeURIComponent(this.$route.params.url)
       this.$nextTick(() =>{
           console.log("初始化时的地址为: " + this.videoUrl)
            this.easyPlayer = new WasmPlayer(null, 'easyplayer', this.eventcallbacK)
            this.easyPlayer.play(this.videoUrl, 1)
          if (typeof (this.videoUrl) == "undefined") {
            this.videoUrl = paramUrl;
          }
          console.log("初始化时的地址为: " + this.videoUrl)
          this.easyPlayer = new WasmPlayer(null, 'easyplayer', this.eventcallbacK)
          this.easyPlayer.play(this.videoUrl, 1)
        })
    },
    watch:{

 web_src/src/components/dialog/rtcPlayer.vue

@@ -17,9 +17,13 @@
    },
    props: ['videoUrl', 'error', 'hasaudio'],
    mounted () {
      let paramUrl = decodeURIComponent(this.$route.params.url)
       this.$nextTick(() =>{
           console.log("初始化时的地址为: " + this.videoUrl)
            this.play(this.videoUrl)
         if (typeof (this.videoUrl) == "undefined") {
           this.videoUrl = paramUrl;
         }
         console.log("初始化时的地址为: " + this.videoUrl)
         this.play(this.videoUrl)
        })
    },
    watch:{
@@ -60,7 +64,7 @@
                        this.webrtcPlayer.close();
                        this.play(url)
                    }, 100)
                    

                }
            });

@@ -69,14 +73,14 @@
                // document.getElementById('selfVideo').srcObject=s;
                this.eventcallbacK("LOCAL STREAM", "获取到了本地流")
            });
            

        },
        pause: function () {
            if (this.webrtcPlayer != null) {
                this.webrtcPlayer.close();
                this.webrtcPlayer = null;
            }
            

        },
        eventcallbacK: function(type, message) {
            console.log("player 事件回调")
@@ -106,5 +110,5 @@
    /* .iconqingxiLOGO {
        display: none !important;
    } */
    
</style>

</style>

 web_src/src/router/index.js

@@ -14,6 +14,9 @@
import sip from '../components/setting/Sip.vue'
import media from '../components/setting/Media.vue'

import wasmPlayer from '../components/dialog/easyPlayer.vue'
import rtcPlayer from '../components/dialog/rtcPlayer.vue'

const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
@@ -81,5 +84,10 @@
      name: 'test',
      component: test,
    },
    {
      path: '/play/rtc/:url',
      name: 'rtcPlayer',
      component: rtcPlayer,
    },
  ]
})