hls预览页面
This commit is contained in:
wangliwen
parent
e8254b293c
commit
6edc669e6a
BIN
hisense_dh.db
BIN
hisense_dh.db
Binary file not shown.
|
|
@ -105,7 +105,47 @@ class DeviceChannelController(
|
||||||
* hls预览页面
|
* hls预览页面
|
||||||
*/
|
*/
|
||||||
fun hls(requestHandler: RoutingContext) {
|
fun hls(requestHandler: RoutingContext) {
|
||||||
|
val userId = requestHandler.get<Int>("userId") // 用户id
|
||||||
val queryParams = requestHandler.queryParams()
|
val queryParams = requestHandler.queryParams()
|
||||||
|
val channelId = queryParams.get("channelId")
|
||||||
|
val subType = queryParams.get("subType")
|
||||||
|
val scheme = MonitorScheme.HLS.scheme
|
||||||
|
val data =
|
||||||
|
JsonObject().put("hls", "http://219.151.31.38/liveplay-kk.rtxapp.com/live/program/live/hnwshd/4000000/mnf.m3u8")
|
||||||
|
templateEngine!!.render(
|
||||||
|
data, "templates/device_channel/hls.html"
|
||||||
|
).onSuccess { success: Buffer? ->
|
||||||
|
requestHandler.response().putHeader("Content-Type", "text/html").end(success)
|
||||||
|
}.onFailure { fail: Throwable ->
|
||||||
|
requestHandler.fail(fail)
|
||||||
|
}
|
||||||
|
// event!!.request<JsonArray>(EventBusAddress.SYS_MONITOR_USER_ALLMONITORUSER_TOKEN.address, JsonObject()) {
|
||||||
|
// if (it.succeeded()) {
|
||||||
|
// val token = it.result().body().stream().filter { index ->
|
||||||
|
// index as JsonObject
|
||||||
|
// index.getInteger("id") == userId
|
||||||
|
// }.findFirst()
|
||||||
|
// token.ifPresent { tokenInfo ->
|
||||||
|
// tokenInfo as JsonObject
|
||||||
|
// tokenInfo.put("channelId", channelId)
|
||||||
|
// tokenInfo.put("subType", subType)
|
||||||
|
// tokenInfo.put("scheme", MonitorScheme.values()[scheme.toInt()].scheme)
|
||||||
|
// event!!.request<JsonObject>(EventBusAddress.SYS_DEVICE_CHANNEL_PREVIEW_URL.address, tokenInfo) { previewUrl ->
|
||||||
|
// if (previewUrl.succeeded()) {
|
||||||
|
// requestHandler
|
||||||
|
// .response()
|
||||||
|
// .putHeader("content-type", "application/json")
|
||||||
|
// .end(previewUrl.result().body().encode())
|
||||||
|
// } else {
|
||||||
|
// requestHandler
|
||||||
|
// .response()
|
||||||
|
// .putHeader("content-type", "application/json")
|
||||||
|
// .end(JsonObject().encode())
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -94,5 +94,7 @@ class WebAPIVerticle : CoroutineVerticle() {
|
||||||
|
|
||||||
router.route(HttpMethod.GET, "/admin/channel/index").handler(deviceChannelController::index) // 通道首页
|
router.route(HttpMethod.GET, "/admin/channel/index").handler(deviceChannelController::index) // 通道首页
|
||||||
router.route(HttpMethod.POST, "/admin/channel/page").handler(deviceChannelController::deviceChannelPage) // 通道分页
|
router.route(HttpMethod.POST, "/admin/channel/page").handler(deviceChannelController::deviceChannelPage) // 通道分页
|
||||||
|
router.route(HttpMethod.GET, "/admin/channel/flv").handler(deviceChannelController::flv) // flv预览播放页面
|
||||||
|
router.route(HttpMethod.GET, "/admin/channel/hls").handler(deviceChannelController::hls) // flv预览播放页面
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,12 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html xmlns:th="http://www.thymeleaf.org">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="utf-8">
|
||||||
<title>Title</title>
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title>flv预览页面</title>
|
||||||
|
<link rel="stylesheet" th:href="@{/layui/css/layui.css}">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,53 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html xmlns:th="http://www.thymeleaf.org">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="utf-8">
|
||||||
<title>Title</title>
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title>hls预览页面</title>
|
||||||
|
<link th:href="@{/layui/css/layui.css}" rel="stylesheet">
|
||||||
|
<link th:href="@{/video-js/video-js.min.css}" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div id="content">
|
||||||
|
<video id="rtmpVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="true">
|
||||||
|
<source th:src="${hls}" type="application/x-mpegURL">
|
||||||
|
</source>
|
||||||
|
</video>
|
||||||
|
</div>
|
||||||
|
<script th:src="@{/video-js/video.min.js}"></script>
|
||||||
|
<script th:src="@{/video-js/videojs-http-streaming.min.js}"></script>
|
||||||
|
<script th:src="@{/video-js/lang/zh-CN.js}"></script>
|
||||||
|
<script th:src="@{/layui/layui.js}"></script>
|
||||||
|
<script language='javascript' th:inline="javascript">
|
||||||
|
var hls = [[${ hls }]]
|
||||||
|
videojs.options.autoplay = true;
|
||||||
|
var width = window.innerWidth;
|
||||||
|
var height = window.innerHeight;
|
||||||
|
window.onload = function () {
|
||||||
|
var player = videojs('rtmpVideo', {
|
||||||
|
autoplay: true,
|
||||||
|
width: width,
|
||||||
|
height: height,
|
||||||
|
language: 'zh-CN',
|
||||||
|
controlBar: {
|
||||||
|
liveDisplay: true
|
||||||
|
},
|
||||||
|
muted: true,
|
||||||
|
preload: 'metadata',
|
||||||
|
sources: [{
|
||||||
|
src: hls,
|
||||||
|
type: 'application/x-mpegURL'
|
||||||
|
}]
|
||||||
|
}, function () {
|
||||||
|
console.log('videojs播放器初始化成功');
|
||||||
|
});
|
||||||
|
player.on('loadedalldata', function (e) {
|
||||||
|
console.log('数据加载完成!');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -21,8 +21,8 @@
|
||||||
</div>
|
</div>
|
||||||
<script type="text/html" id="barDemo">
|
<script type="text/html" id="barDemo">
|
||||||
<a href="#" title="通道信息" style="font-size: 18px"><i class="layui-icon layui-icon-template-1"
|
<a href="#" title="通道信息" style="font-size: 18px"><i class="layui-icon layui-icon-template-1"
|
||||||
style="font-size: 18px; color: #5FB878;"
|
style="font-size: 18px; color: #5FB878;"
|
||||||
lay-event="info"></i></a>
|
lay-event="info"></i></a>
|
||||||
<a href="#" title="预览flv" style="font-size: 18px"><i class="layui-icon layui-icon-play"
|
<a href="#" title="预览flv" style="font-size: 18px"><i class="layui-icon layui-icon-play"
|
||||||
style="font-size: 18px; color: #5FB878;"
|
style="font-size: 18px; color: #5FB878;"
|
||||||
lay-event="flv"></i></a>
|
lay-event="flv"></i></a>
|
||||||
|
|
@ -104,18 +104,31 @@ layui.use('table', function(){
|
||||||
var data = obj.data;
|
var data = obj.data;
|
||||||
var layEvent = obj.event;
|
var layEvent = obj.event;
|
||||||
var tr = obj.tr;
|
var tr = obj.tr;
|
||||||
if (layEvent === 'flv') { // flv 预览
|
|
||||||
|
if (layEvent === 'flv') { // flv 预览
|
||||||
layer.open({
|
layer.open({
|
||||||
type: 2,
|
type: 2,
|
||||||
title: false,
|
title: false,
|
||||||
area: ['1280px', '720px'],
|
area: ['1280px', '720px'],
|
||||||
shade: 0.8,
|
shade: 0.8,
|
||||||
closeBtn: 0,
|
closeBtn: 1,
|
||||||
scrollbar: false,
|
scrollbar: false,
|
||||||
shadeClose: true,
|
shadeClose: true,
|
||||||
content: '/vod?stream=' + data.stream + '&clientId=' + data.clientId + '&liveApp=' + data.liveApp
|
content: '/admin/channel/flv?channelId=' + data.channelId
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
if (layEvent === 'hls') { // hls 预览
|
||||||
|
layer.open({
|
||||||
|
type: 2,
|
||||||
|
title: false,
|
||||||
|
area: ['1280px', '720px'],
|
||||||
|
shade: 0.8,
|
||||||
|
closeBtn: 1,
|
||||||
|
scrollbar: false,
|
||||||
|
shadeClose: true,
|
||||||
|
content: '/admin/channel/hls?channelId=' + data.channelId
|
||||||
|
});
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
var $ = layui.$, active = {
|
var $ = layui.$, active = {
|
||||||
|
|
@ -140,6 +153,8 @@ layui.use('table', function(){
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -97,12 +97,5 @@ layui.use(['element', 'layer', 'util'], function(){
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue