发送 URL 请求,无需离开页面

send URL request, without leaving page

本文关键字:离开 URL 请求 发送      更新时间:2023-09-26

我有一个网页,有一个流媒体网络摄像头。摄像机使用摄像机内部 Web 服务器上的脚本进行平移和倾斜。我无法修改脚本,它的输出是一个显示"OK"的网页。

当用户访问我的页面时,我希望他们能够使用箭头键平移相机,但没有发送请求的脚本,使用相机流离开页面。此源将平移相机,但您必须单击返回才能进入流。这是我的来源:

<head>
    <?php
    $url = "http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=2";
    ?>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).keypress(function (e){ 
    if(e.keyCode == 37) // left arrow
    {
    window.location.href = <?php echo "'"" . $url . "'""; ?>; 
    }
    else if(e.keyCode == 38)    // up arrow
    { 
$(window.location.href = "http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=6"); 
    }
    else if(e.keyCode == 39)    // right arrow
    { 
    window.location.href = "http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=4";  
    }
    else if(e.keyCode == 40)    // Down arrow
    { 
    window.location.href = "http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=0";      
    }
});
</script>
<title>Navigation</title>
</head>
<body>
<br><h2>use arrows to navigate.</h2> 
<iframe src="http://Camera-server-IP/videostream.cgi?user=user&pwd=Password" width="330" height="260"></iframe>
</body>
</html>

相机服务器 IP 是实际的相机 Web 服务器地址。为什么每个导航箭头的完成方式都不同?因为我正试图弄清楚这一点。

我该怎么做才能使用箭头键将 URL 请求发送到摄像机,但同时停留在摄像机流式传输的页面上?

页面正在向前移动,因为您正在将窗口位置设置为新链接。您要做的是使用 AJAX 进行调用,该调用之后应该会让您留在当前页面上。JQuery 不是必需的,但会让你的事情变得更容易。

使用 Jquery 的示例:

if(e.keyCode == 38)    // up arrow
{ 
    $.get("http://Camera-server-IP/decoder_control.cgi?user=admin&pwd=password&command=6", function() {
        //on successful call
    });
}

您可以在 https://api.jquery.com/jquery.get/查看有关使用 jquery 的请求的更多信息