83 lines
2.1 KiB
Vue
83 lines
2.1 KiB
Vue
<template>
|
|
<div>
|
|
<h1>call_room</h1>
|
|
<van-cell-group>
|
|
<van-field v-model="value" label="文本" placeholder="请输入用户名" />
|
|
</van-cell-group>
|
|
<video ref="video" id="rtc_media_player" width="310" autoplay muted controls></video>
|
|
<van-button type="primary" @click="playVideo">主要按钮</van-button>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
/* eslint-disable */
|
|
export default {
|
|
name: "call_room",
|
|
data() {
|
|
return {
|
|
value:"webrtc://119.45.242.222/live/livestream123",
|
|
};
|
|
},
|
|
mounted() {
|
|
let player = new SrsRtcPlayerAsync();
|
|
var url = 'webrtc://119.45.242.222/live/livestream123';
|
|
|
|
player.play(url).then(function(session){
|
|
console.log(session);
|
|
// ui.children('#peer').text('Peer: ' + url);
|
|
// video.prop('muted', false);
|
|
}).catch(function (reason) {
|
|
|
|
// player.close();
|
|
// video.hide();
|
|
console.error(reason);
|
|
});
|
|
|
|
},
|
|
methods: {
|
|
playVideo(){
|
|
let sdk=null;
|
|
const video = this.$refs.video;
|
|
video.srcObject=null;
|
|
|
|
var query = parse_query_string();
|
|
|
|
srs_init_rtc("#txt_url", this.value);
|
|
|
|
if (sdk) {
|
|
sdk.close();
|
|
}
|
|
sdk = new SrsRtcPlayerAsync();
|
|
|
|
// https://webrtc.org/getting-started/remote-streams
|
|
this.rtcSteam=sdk.stream
|
|
|
|
video.srcObject = sdk.stream;
|
|
video.onloadedmetadata = function (e) {
|
|
video.play();
|
|
};
|
|
|
|
// $('#rtc_media_player').prop('srcObject', sdk.stream);
|
|
// Optional callback, SDK will add track to stream.
|
|
// sdk.ontrack = function (event) { console.log('Got track', event); sdk.stream.addTrack(event.track); };
|
|
|
|
// For example: webrtc://r.ossrs.net/live/livestream
|
|
var url = this.value
|
|
sdk.play(url).then(function(session){
|
|
// $('#sessionid').html(session.sessionid);
|
|
// $('#simulator-drop').attr('href', session.simulator + '?drop=1&username=' + session.sessionid);
|
|
}).catch(function (reason) {
|
|
sdk.close();
|
|
$('#rtc_media_player').hide();
|
|
console.error(reason);
|
|
});
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|