增加RTSP
This commit is contained in:
parent
4a4c9dd601
commit
832e3cc92d
@ -57,6 +57,11 @@ namespace Parking_spaces.Controllers
|
||||
{
|
||||
return View();
|
||||
}
|
||||
|
||||
public IActionResult Engineering_RTSP()
|
||||
{
|
||||
return View();
|
||||
}
|
||||
public IActionResult Single_violation_detail(string id)
|
||||
{
|
||||
ViewBag.parking_spaces_name = id;
|
||||
|
||||
263
Parking_spaces/Views/Engineering/Engineering_RTSP.cshtml
Normal file
263
Parking_spaces/Views/Engineering/Engineering_RTSP.cshtml
Normal file
@ -0,0 +1,263 @@
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Engineering_RTSP";
|
||||
Layout = "~/Views/Shared/_Layout_Engineering.cshtml";
|
||||
}
|
||||
|
||||
|
||||
<style>
|
||||
#img_id {
|
||||
width: 50%;
|
||||
display: block; /* 使圖像為塊級元素，以便使用 margin:auto; */
|
||||
margin: auto; /* 將圖像置中 */
|
||||
}
|
||||
</style>
|
||||
<h1>即時影像</h1>
|
||||
|
||||
<div>
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
停車場位置
|
||||
</th>
|
||||
<th>
|
||||
IP位置
|
||||
</th>
|
||||
<th>
|
||||
使用Port
|
||||
</th>
|
||||
<th>
|
||||
攝像頭使用模式
|
||||
</th>
|
||||
<th>
|
||||
|
||||
</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody id="demo">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<!--彈跳視窗-->
|
||||
<div>
|
||||
<dialog id="webcam_view" style="width:80%;">
|
||||
<div>
|
||||
<button class="btn btn-danger" style="float:right" onclick="RTSP_Close();"> 關閉</button></br>
|
||||
<img id="img_id" style="width:50%"/>
|
||||
|
||||
</div>
|
||||
</dialog>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--獲取資料-->
|
||||
<script>
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
var token_ckeck //= document.getElementById("token_ckeck_id").value
|
||||
var position //職位
|
||||
function get_data() {
|
||||
//token_check = document.getElementById("token_check_id").value
|
||||
console.log(token_check)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Parking_spaces_cam",
|
||||
data: {},
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
console.log(Model)
|
||||
set_data(Model)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<!--放置資料-->
|
||||
<script>
|
||||
function set_data(Model) {
|
||||
table = "<tr>";
|
||||
console.log(Model.length)
|
||||
if (Model.length > 0) {
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
if (Model[i].parking_spaces_name != null) {
|
||||
if (parseInt(Model[i].port) > 400) {
|
||||
table += "<td>" + Model[i].parking_spaces_name + "</td>"
|
||||
table += "<td>" + Model[i].ip + "</td>"
|
||||
table += "<td>" + Model[i].port + "</td>"
|
||||
if (Model[i].mode == "pass") { mode = "停車場進出" }
|
||||
if (Model[i].mode == "violation") { mode = "判斷違規左右轉" }
|
||||
if (Model[i].mode == "car_num_check") { mode = "數量確認" }
|
||||
table += "<td>" + mode + "</td>"
|
||||
table += "<td>" + '<button class="btn btn-outline-success " onclick="CAM_RTSP(' + "'" + Model[i].ip + ":" + Model[i].port + "'" + ')">查看影像</button>'
|
||||
}
|
||||
table += "</tr>"
|
||||
table += "<tr>"
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
document.getElementById("demo").innerHTML = table
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<!--串流影像-->
|
||||
<script>
|
||||
var IP_1
|
||||
var stop = false
|
||||
function CAM_RTSP(IP) {
|
||||
console.log(IP)
|
||||
IP_1 = IP
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.21.65:7705/IP/'+IP,
|
||||
headers: {
|
||||
|
||||
},
|
||||
success: function (response) {
|
||||
webcam_view.showModal()
|
||||
stop = false
|
||||
RTSP_START(response)
|
||||
token_check = "true"
|
||||
//from_token_import_id()
|
||||
},
|
||||
|
||||
});
|
||||
}
|
||||
function CAM_RTSP_1() {
|
||||
console.log(IP_1)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.21.65:7705/IP/' + IP_1,
|
||||
headers: {
|
||||
|
||||
},
|
||||
success: function (response) {
|
||||
//webcam_view.showModal()
|
||||
RTSP_START(response)
|
||||
|
||||
token_check = "true"
|
||||
//from_token_import_id()
|
||||
},
|
||||
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!--開啟視窗並串流-->
|
||||
<script>
|
||||
function RTSP_START(img_base_64) {
|
||||
//console.log(img)
|
||||
img = document.getElementById("img_id")
|
||||
img.src = img_base_64
|
||||
if (stop == false){
|
||||
setTimeout('CAM_RTSP_1()', 100);
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--關閉串流-->
|
||||
<script>
|
||||
function RTSP_Close(){
|
||||
webcam_view.close()
|
||||
stop = true
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--檢查token-->
|
||||
<script>
|
||||
function token_check() {
|
||||
// 检查本地存储中是否存在JWT令牌
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
console.log(token)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token_check',
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
console.log(response)
|
||||
token_check = "true"
|
||||
from_token_import_id()
|
||||
},
|
||||
error: function (xhr) {
|
||||
console.log("1")
|
||||
token_check = "false"
|
||||
window.location.href = '/';
|
||||
//get_data()
|
||||
// 处理错误响应，例如跳转到未授权页面
|
||||
//window.location.href = 'https://example.com/unauthorized_page';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function from_token_import_id() {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token-' + token,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
console.log(response)
|
||||
from_id_import_user_data(response)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
function from_id_import_user_data(id) {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/user_id-' + id,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (model) {
|
||||
model = model.result
|
||||
position = model.lastname
|
||||
console.log(position)
|
||||
if (position == "engineer") {
|
||||
get_data()
|
||||
}
|
||||
else {
|
||||
window.location.href = '/';
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--開機自啟-->
|
||||
<script>
|
||||
window.onload = token_check;
|
||||
</script>
|
||||
@ -78,6 +78,7 @@
|
||||
<a class="collapse-item" asp-controller="Engineering" asp-action="Engineering_CAM">查看WEBCAM</a>
|
||||
<a class="collapse-item" asp-controller="Engineering" asp-action="Engineering_LED">字幕機顯示</a>
|
||||
<a class="collapse-item" asp-controller="Engineering" asp-action="Engineering_Violation"> 違規區域</a>
|
||||
<a class="collapse-item" asp-controller="Engineering" asp-action="Engineering_RTSP"> 即時影像</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user