如何在我的网页上显示实时交通摄像头？

-1

我需要显示特定地点的现场交通摄像机（例如，特拉维夫阿亚尔路）。我看到了一些例子，但仍然不明白如何实现它。如何在我的网页上显示实时交通摄像头？

下面是我需要的一个例子：通过选择位置，有一个实时道路相机。

我试过下面的例子：https://github.com/pusher/pusher-realtime-tfl-cameras和http://jsbin.com/mazaf/3/edit?html,js,console,output

这里是我的代码：

<html> 
    <body> 
    </body> 
    <script src="https://js.pusher.com/4.1/pusher.min.js"></script> 
<script> 
    // Open a Pusher connection to the Realtime TfL Traffic Camera API 
    var pusher = new Pusher("f1b8177ecbc7a66de0c7"); 

    var channel = pusher.subscribe("cameras"); 

    var tflURL = "http://tfl.gov.uk/tfl/livetravelnews/trafficcams/cctv/"; 

    // Listen for new updates 
    channel.bind("cameras-update", function(cameras) { 
     var camerasArr = cameras.split("|"); 
     console.log(tflURL + camerasArr[0] + ".jpg"); 
    }); 
</script> 
</html>

这里是我的输出：

推：国家改变：初始化 - >连接 pusher.min.js：8推动者：连接：{“transport”：“ws”，“url”：“wss：//ws-ap2.pusher.com：443/app/e38b1f2ff9c8c301319c？protocol = 7 &客户端= js &版本= 4.1.0 & flash = false“} pusher.min.js：8推动器：状态已更改：连接 - >连接到新的套接字ID 208.479900 pusher.min.js：8推送器：事件已发送：{“event”：“pusher：subscribe”，“data”：{“channel”：“my-channel”}} pusher.min.js：8 Pusher：Event recd：{“event”：“pusher_internal：subscription_succeeded “，”data“：{}，”channel“：”my-channel“} pusher.min.js：8推者：我的频道没有回拨推送者：subscription_succeeded

但是我怎样才能看到生活相机流媒体？

感谢

来源

2017-08-14 Regina Kreimer

您应该https://github.com/pusher/pusher-realtime-tfl-cameras阅读Readme.md，主要是在底部的代码示例。这只允许您访问伦敦地区的TfL相机，因为这些都是API公开。在考虑将其集成到您的应用程序之前，您需要从该街道找到实时视频的来源。

来源

2017-08-14 13:01:02 kn100

“这将只允许您访问伦敦地区的TfL相机” - 没问题，一开始我想展示伦敦地区。 –

正如你所看到的，我已经阅读了https://github.com/pusher/pusher-realtime-tfl-cameras上的Readme.md并尝试了这个例子。我错过了什么吗？ –

'var channel = pusher.subscribe（“cameras”）; var tflURL =“http://tfl.gov.uk/tfl/livetravelnews/trafficcams/cctv/”; //监听新更新 channel.bind（ “相机更新”，功能（照相机）{ 变种camerasArr = cameras.split（ “|”）; 的console.log（tflURL + camerasArr [0] + “.jpg”）; }）;' –

如何在我的网页上显示实时交通摄像头？

回答

相关问题