Add VOD.
This commit is contained in:
eatfishfish
parent
33cf4d0dc5
commit
9efaf98d38
53
README.md
53
README.md
|
|
@ -1,16 +1,17 @@
|
|||
# openpilot-server
|
||||
|
||||
#### 1. 配置文件
|
||||
(1)在 config.txt 文件中，
|
||||
<ws_bind> 是绑定websocket server 的ip和端口。
|
||||
<http_bind> 是绑定http server 的ip和端口。
|
||||
<athena_host> 是该服务端公网的域名。
|
||||
<upload_url> 是该服务端公网的域名。
|
||||
<amap_key> 高德API KEY 。https://console.amap.com/dev/index 这里注册。选择绑定“Web服务”
|
||||
(1)在 config.txt 文件中，
|
||||
<ws_bind> 是绑定websocket server 的ip和端口。
|
||||
<http_bind> 是绑定http server 的ip和端口。
|
||||
<athena_host> 是该服务端公网的域名。
|
||||
<upload_url> 是该服务端公网的域名。
|
||||
<amap_key> 高德API KEY 。https://console.amap.com/dev/index 这里注册。选择绑定“Web服务”
|
||||
<ffmpeg_path>ffmpeg程序路径。 ffmpeg 从https://ffmpeg.org/download.html下载。
|
||||
(2) 启动
|
||||
在服务器上启动opserver.exe。
|
||||
在服务器上启动opserver.exe。
|
||||
|
||||
#### 2. 设置c3/c3x
|
||||
#### 2. 设置c3/c3x
|
||||
(1) ssh进入c3/c3x 设备。
|
||||
(2) 在/data/continue.sh export 添加 <athena_host> 和 <upload_url>。
|
||||
export ATHENA_HOST='ws://laolang.duckdns.org:7899'
|
||||
|
|
@ -19,22 +20,22 @@
|
|||
像这样：
|
||||
/-----/data/continue.sh file-----------------
|
||||
#!/usr/bin/bash
|
||||
|
||||
|
||||
export ATHENA_HOST='ws://laolang.duckdns.org:7899'
|
||||
export API_HOST='http://laolang.duckdns.org:7898'
|
||||
export MAPBOX_TOKEN='pk.eyJ1Ijoiam5ld2IiLCJhIjoiY2xxNW8zZXprMGw1ZzJwbzZneHd2NHljbSJ9.gV7VPRfbXFetD-1OVF0XZg'
|
||||
|
||||
|
||||
cd /data/openpilot
|
||||
exec ./launch_openpilot.sh
|
||||
|
||||
/----------------------
|
||||
|
||||
|
||||
(3) rm -rf /data/params/d/DongleId
|
||||
sudo reboot #重启你的c3/c3x
|
||||
|
||||
#### 3. 下载文件和设置导航
|
||||
|
||||
#### 3. 下载文件和设置导航
|
||||
(1) 浏览器中打开 http://<your_domain_name> 例如 [http://laolang.duckdns.org:7898](http://laolang.duckdns.org:7898/static/index.html)
|
||||
输入测试Dongle ID : e7a8b8c1cb559c9d
|
||||
输入测试Dongle ID : e7a8b8c1cb559c9d
|
||||
|
||||
(2) 进入设置导航地址。(仅支持IPhone地图和高德地图)
|
||||
|
||||
|
|
@ -42,7 +43,7 @@ exec ./launch_openpilot.sh
|
|||
|
||||
# openpilot-server for english
|
||||
|
||||
#### 1. Configuration File
|
||||
#### 1. Configuration File
|
||||
(1) In the config.txt file,
|
||||
<ws_bind> IP and port of the websocket server.
|
||||
<http_bind> IP and port of the http server.
|
||||
|
|
@ -50,8 +51,8 @@ exec ./launch_openpilot.sh
|
|||
<upload_url> The domain name of the server.
|
||||
(2) Launch
|
||||
Launch opserver.exe on your windows server.
|
||||
|
||||
#### 2. Configuration in c3/c3x
|
||||
|
||||
#### 2. Configuration in c3/c3x
|
||||
(1) SSH into the c3/c3x device.
|
||||
(2) In "/data/continue.sh" file, export <athena_host> and <upload_url>.
|
||||
export ATHENA_HOST='ws://laolang.duckdns.org:7899'
|
||||
|
|
@ -59,24 +60,24 @@ export API_HOST=' http://laolang.duckdns.org:7898 '
|
|||
export MAPBOX_TOKEN='<register_on_mapbox_website.>'
|
||||
like this:
|
||||
/-----/data/continue.sh file-----------------
|
||||
#!/usr/bin/bash
|
||||
|
||||
#!/usr/bin/bash
|
||||
|
||||
export ATHENA_HOST='ws://laolang.duckdns.org:7899'
|
||||
export API_HOST='http://laolang.duckdns.org:7898'
|
||||
export MAPBOX_TOKEN='<register_on_mapbox_website.>'
|
||||
|
||||
|
||||
cd /data/openpilot
|
||||
exec ./launch_openpilot.sh
|
||||
|
||||
|
||||
/----------------------
|
||||
|
||||
|
||||
(3) rm -rf /data/params/d/DongleId
|
||||
sudo reboot #Restart your c3/c3x
|
||||
|
||||
#### 3. Download and navigation
|
||||
(1) Open http://<your_domain_name> (for example [http://laolang.duckdns.org:7898](http://laolang.duckdns.org:7898/static/index.html)) in your browser
|
||||
|
||||
#### 3. Download and navigation
|
||||
(1) Open http://<your_domain_name> (for example [http://laolang.duckdns.org:7898](http://laolang.duckdns.org:7898/static/index.html)) in your browser
|
||||
Input test Dongle ID : e7a8b8c1cb559c9d
|
||||
|
||||
|
||||
(2) In the web page configure the navigation.(Only support IPhone map and AMap)
|
||||
|
||||
#### 4.Star me. Thank you
|
||||
|
|
|
|||
|
|
@ -2,4 +2,5 @@ ws_bind=0.0.0.0:7899
|
|||
http_bind=0.0.0.0:7898
|
||||
athena_host=ws://laolang.duckdns.org:7899
|
||||
upload_url=http://laolang.duckdns.org:7898
|
||||
amap_key=23428738744447ba93dda0d6473ff026e
|
||||
amap_key=23428738744447ba93dda0d6473ff026e
|
||||
ffmpeg_path=D:\\software\\ffmpeg.exe
|
||||
BIN
opserver.exe
BIN
opserver.exe
Binary file not shown.
Binary file not shown.
|
|
@ -131,6 +131,11 @@
|
|||
window.location = url;
|
||||
}
|
||||
|
||||
function showVOD(){
|
||||
url = "/static/vod.html"
|
||||
window.location = url;
|
||||
}
|
||||
|
||||
function recordOperationTime(){
|
||||
strSec = Math.floor(Date.now() / 1000)
|
||||
localStorage.setItem("operationTime", strSec)
|
||||
|
|
@ -172,8 +177,12 @@
|
|||
</form>
|
||||
|
||||
|
||||
|
||||
|
||||
<div id="btnlist" style="display: none;text-align:center" title="" >
|
||||
</br></br></br></br>
|
||||
</br></br></br></br>
|
||||
<input type="button" value="Vod" class="button button1" onclick = "showVOD();" />
|
||||
</br></br>
|
||||
<input type="button" value="Log" class="button button1" onclick = "showlog();" />
|
||||
|
||||
<input type="button" value="AMap" class="button button1" onclick = "showAmap();" />
|
||||
|
|
|
|||
|
|
@ -0,0 +1,212 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<!--Happy children's day 2024-05-30-->
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link href="https://vjs.zencdn.net/7.14.3/video-js.css" rel="stylesheet">
|
||||
<script src="https://vjs.zencdn.net/7.14.3/video.js"></script>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'Arial', sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.video-container {
|
||||
margin-bottom: 20px;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.controls-container {
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
display: flex;
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
#m3u8Input {
|
||||
flex: 1;
|
||||
padding: 12px;
|
||||
border: none;
|
||||
border-radius: 5px 0 0 5px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 12px 20px;
|
||||
background-color: #4CAF50;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 0 5px 5px 0;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
transition: background-color 0.3s;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #45a049;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<title>openpilot-online</title>
|
||||
|
||||
<script type="text/javascript">
|
||||
function isWeChat(){
|
||||
//window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息，这个属性可以用来判断浏览器类型
|
||||
var ua = window.navigator.userAgent.toLowerCase();
|
||||
//通过正则表达式匹配ua中是否含有MicroMessenger字符串
|
||||
if(ua.match(/MicroMessenger/i) == 'micromessenger'){
|
||||
return true;
|
||||
}else{
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
window.onload = function() {
|
||||
console.log(window.navigator.platform);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="video-frame" class="video-container"></div>
|
||||
<div>
|
||||
<input type='button' style="width:100px; height:50px;" onclick='playVideo(lastUrl);' value='Play'>
|
||||
<input type='button' style="width:100px; height:50px;" onclick='window.location="/static/index.html";' value='Return'>
|
||||
</div>
|
||||
<script>
|
||||
init = false;
|
||||
lastUrl = "";
|
||||
var arr_url;
|
||||
|
||||
dongleid = localStorage.getItem("dongleId");
|
||||
uri = "/vod/"+dongleid
|
||||
|
||||
getVodUrl();
|
||||
var int=self.setInterval("clock()",10000);
|
||||
function clock()
|
||||
{
|
||||
getVodUrl();
|
||||
}
|
||||
|
||||
function getVodUrl() {
|
||||
console.log("getVodUrl");
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', uri, true);
|
||||
xhr.onload = function() {
|
||||
if (this.status === 200) {
|
||||
let arr = this.responseText.split(',');
|
||||
console.log(arr)
|
||||
if (arr.length == 0){
|
||||
alert("No video.");
|
||||
return;
|
||||
}
|
||||
|
||||
arr_url = arr;
|
||||
|
||||
if (!init) {
|
||||
vodUrl = findUrl();
|
||||
if (vodUrl != "") {
|
||||
content = '<video onended="videoEnded()" id="m3u8Player" class="video-js vjs-default-skin" controls width="360" height="640">\
|
||||
<source id="src_m3u8" src="'+vodUrl+ '" type="application/x-mpegURL">\
|
||||
</video>'
|
||||
console.log(content);
|
||||
document.getElementById('video-frame').innerHTML = content;
|
||||
init = true;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
xhr.send();
|
||||
}
|
||||
|
||||
function findUrl() {
|
||||
var arr = arr_url;
|
||||
idx = 99;
|
||||
for (i=0; i < arr.length; i++) {
|
||||
if (lastUrl == arr[i]) {
|
||||
idx = i;
|
||||
console.log(arr[i]);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (idx != 0){
|
||||
if (idx==99) {
|
||||
idx = arr.length - 1;
|
||||
} else {
|
||||
idx = idx -1;
|
||||
}
|
||||
|
||||
lastUrl = arr[idx];
|
||||
return lastUrl;
|
||||
}
|
||||
|
||||
return "";
|
||||
}
|
||||
|
||||
function videoEnded(){
|
||||
console.log("The End.")
|
||||
|
||||
vodUrl = findUrl();
|
||||
if (vodUrl == "") {
|
||||
return
|
||||
}
|
||||
|
||||
console.log(vodUrl);
|
||||
|
||||
src = vodUrl;
|
||||
newSource = {
|
||||
src: vodUrl,
|
||||
type: 'application/x-mpegURL'
|
||||
};
|
||||
|
||||
const videoPlayer = videojs('m3u8Player');
|
||||
videoPlayer.src(newSource);
|
||||
videoPlayer.play();
|
||||
}
|
||||
|
||||
function playVideo(src) {
|
||||
console.log(src);
|
||||
input = document.getElementById('src_m3u8').src
|
||||
document.getElementById('video-frame').style.display="";
|
||||
const videoPlayer = videojs('m3u8Player');
|
||||
|
||||
newSource = {
|
||||
src: src,
|
||||
type: 'application/x-mpegURL'
|
||||
};
|
||||
|
||||
videoPlayer.src(newSource);
|
||||
|
||||
videoPlayer.ready(function(){
|
||||
videoPlayer.on('loadedmetadata', function(){
|
||||
console.log("videoPlayer duration:",videoPlayer.duration());
|
||||
videoPlayer.error(null);
|
||||
})});
|
||||
|
||||
videoPlayer.play();
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue