之前在Web端用 h5connect.js 方式点播视频，现在需要移动到微信小程序中，求大佬解决帮助，急急急.... 谢谢啦！
因为视频服务器存在别人那里，他们就只给我们提供了 h5connect.js 来获取视频 按照小程序的开发方式，（播放域名和推送地址随机生成一个id）我们如何根据ID来获取对应的视频地址？
<!--pages/push-config/push-config.wxml-->
<view class="mainUI">
<view class='title' style='padding-top:{{(headerHeight statusBarHeight)/2 - 12}}px'>
<text>RTMP推流</text>
</view>
<view class='item' style='padding-top:2vh'>
<text class='item-title'>推流获取</text>
<button class="item-button1" bindtap="onScanQR">扫码读取</button>
<button class="item-button1" bindtap="onNewUrlClick">自动生成</button>
</view>
<view class='item'>
<text class='item-title'>推流地址</text>
<input class='item-input' placeholder="rtmp://" focus="{{focusPush}}" bindtap='onPushInputTap' bindinput="onPushInputChange" value="{{pushUrl}}"></input>
<image class='item-image' bindtap="onCopyPushUrl" src='/pages/Resources/copy.png'></image>
</view>
<view class='item'>
<text class='item-title'>播放地址</text>
<input class='item-input' placeholder="http://" focus="{{focusPlay}}" bindtap='onPlayInputTap' bindinput="onPlayInputChange" value="{{playUrl}}"></input>
<image class='item-image' bindtap="onCopyPlayUrl" src='/pages/Resources/copy.png'></image>
</view>
<view class='item'>
<text class='item-title'>画面质量</text>
<radio-group class="radio-group" bindchange="modeRadioChange">
<label class="radio" wx:for="{{modeItems}}" wx:key="" class="{{mode == item.value ? 'bc_blue white': 'blue'}}">
<radio value="{{item.value}}" checked="{{item.checked}}" /> {{item.title}}
</label>
</radio-group>
</view>
<view class='item'>
<text class='item-title'>画面方向</text>
<radio-group class="radio-group" bindchange="orientationRadioChange">
<label class="radio" wx:for="{{orientationItems}}" wx:key="" class="{{orientation == item.value ? 'bc_blue white': 'blue'}}">
<radio value="{{item.value}}" checked="{{item.checked}}" /> {{item.title}}
</label>
</radio-group>
</view>
<view class='item'>
<text class='item-title'>仅推声音</text>
<switch class='item-switch' checked="{{!enableCamera}}" bindchange="switchChange" />
</view>
</view>
<view class='start-box'>
<button class='start' bindtap="startPush" src='/pages/Resources/logo.png'>开始</button>
</view>
<view class='logo-box'>
<image class='logo' src='/pages/Resources/logo.png'></image>
</view>
<cover-image class='close' style="top:{{(headerHeight statusBarHeight) - 26}}rpx" src="/pages/Resources/back.png" bindtap="onBack"></cover-image>
// pages/push-config/push-config.js
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
modeItems: [
{ value: 'SD', title: 'SD'},
{ value: 'HD', title: 'HD'},
{ value: 'FHD', title: 'FHD'},
],
mode :'SD',
orientationItems: [
{ value: 'vertical', title: '竖屏推流' },
{ value: 'horizontal', title: '横屏推流' },
],
orientation: 'vertical',
enableCamera : true,
focusPush: false,
focusPlay: false,
tapTime: '', // 防止两次点击操作间隔太快
headerHeight: app.globalData.headerHeight,
statusBarHeight: app.globalData.statusBarHeight,
},
onPushInputTap: function () {
this.setData({
focusPush: true
})
},
onPushInputChange: function (e) {
this.setData({
pushUrl: e.detail.value,
})
},
onPlayInputTap: function () {
this.setData({
focusPlay: true
})
},
onPlayInputChange: function (e) {
this.setData({
playUrl: e.detail.value,
})
},
modeRadioChange: function (e) {
this.setData({
mode: e.detail.value
});
},
orientationRadioChange: function (e) {
this.setData({
orientation: e.detail.value
});
},
switchChange: function (e) {
this.setData({
enableCamera: !e.detail.value
});
},
onScanQR: function () {
var self = this;
wx.scanCode({
onlyFromCamera: true,
success: (res) => {
console.log(res);
self.setData({
pushUrl: res.result,
playUrl: "",
})
}
})
},
onNewUrlClick: function () {
var self = this;
wx.request({
url: 'https://lvb.zijiebao.com/weapp/utils/get_test_pushurl',
success: (res) => {
var pushUrl = res.data['url_push'];
var rtmpUrl = res.data['url_play_rtmp'];
var flvUrl = res.data['url_play_flv'];
var hlsUrl = res.data['url_play_hls'];
var accUrl = res.data['url_play_acc'];
console.log(pushUrl);
self.setData({
pushUrl: pushUrl,
playUrl: flvUrl,
})
wx.showToast({
title: '获取地址成功',
})
},
fail: (res) => {
console.log(res);
wx.showToast({
title: '网络或服务器异常',
})
}
})
},
onCopyPushUrl: function () {
wx.setClipboardData({
data: this.data.pushUrl,
})
},
onCopyPlayUrl: function () {
wx.setClipboardData({
data: this.data.playUrl,
})
},
startPush : function () {
var self = this;
// 防止两次点击操作间隔太快
var nowTime = new Date();
if (nowTime - this.data.tapTime < 1000) {
return;
}
if (!self.data.pushUrl || self.data.pushUrl.indexOf("rtmp://") != 0) {
wx.showModal({
title: '提示',
content: '推流地址不合法，请点击自动生成按钮先获取腾讯云推流地址',
showCancel: false
});
return;
}
var url = '/pages/live-pusher-demo/push?pushUrl=' encodeURIComponent(self.data.pushUrl) '&mode=' self.data.mode '&orientation=' self.data.orientation '&enableCamera=' self.data.enableCamera;
console.log(url);
wx.navigateTo({
url: url
});
self.setData({ 'tapTime': nowTime });
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
onBack: function () {
wx.navigateBack({
delta: 1
});
}
})
以上是我写的一个案例demo 有不到之处请大家批评指正！！！
