24 lines
No EOL
2.4 KiB
PHP
24 lines
No EOL
2.4 KiB
PHP
<?php
|
||
include "../internal/header.php";
|
||
include "../internal/footer.php";
|
||
include "../internal/comments.php";
|
||
|
||
getHeader("Insecam", "projekte");
|
||
?>
|
||
<p>Insecam ist eine Seite, auf der viele ungesicherte Kameras streams dargestellt werden. Leider wird die Darstellung auf der Seite von Insecam ohne Karte gemacht, obwohl die Position online steht. Daher kam ich auf die Idee selbst eine Karte zu programmieren. Herausgekommen ist <a href="https://insecam.jonasled.tk">diese</a> wunderschöne Karte. Wer sich den Quellcode genauer anschaut wird sich fragen ob es sinnvoll ist alle Daten der Kameras beim Seitenaufbau zu laden, da die Variabel ja mehrere Megabyte groß ist. Die Antwort ist ja, da der Browser nur die Teile lädt die er braucht. Ein Versuch eines Freund das ganze mit einer SQL Datenbank zu lösen war langsamer und aufwendiger, deswegen ist dies die beste Lösung. Aktuell werden nur deutsche Kameras gescannt, dies kann man aber durch das abändern der Länder variable ändern.</p>
|
||
<h2>Update 1:</h2>
|
||
<p>Da ich festgestellt habe, dass die Streams in manchen Browsern in der Vorschau blockiert werden, habe ich einen Proxy eingerichtet, welcher die Streams über eine verschlüsselte Verbindung überträgt. Dadurch sollten das Problem mit der Vorschau behoben sein. Der Proxy Script kann auf GitHub gefunden werden: <a href="https://github.com/jenssegers/php-proxy">https://github.com/jenssegers/php-proxy</a> . In der Config sollte man aber die anpassen, dass die URLs nicht codiert werden.</p>
|
||
<h2>Update 2:</h2>
|
||
<p>Da die Positionsbestimmung nicht immer richtig funktioniert hatte habe ich sie durch eine Suchleiste ersetzt</p>
|
||
<h2>Updaten 3:</h2>
|
||
<p>Am 16.Juli 2018 hat Google seine API für Google Maps umgebaut. Seit diesem Tag verlangt Google Geld um Karten auf Websites einzubinden. Man kann zwar seine Kreditkarte hinterlegen und bekommt jeden Monat 200$, dies wollte ich aber nicht. Daher habe ich die Karte umgeschrieben. Sie setzt jetzt auf die Kartenbibliothek leaflet, welche auf die OpenStreetMap Karten von Mapbox zurückgreift.</p><br>
|
||
<a href="/files/insecam.zip"><button>Download V1</button></a> <a href="/files/Insecam_v2.zip"><button>Download V2</button></a><br>
|
||
<p>Alte Karte mit Google Maps:</p>
|
||
<img src="/img/Insecam.png"><br>
|
||
<p>Neue Karte mit Leaflet:</p>
|
||
<img src="/img/insecam_neu.png"><br>
|
||
<?php
|
||
|
||
$article = basename($_SERVER["SCRIPT_FILENAME"], '.php');
|
||
getComments($article);
|
||
getFooter();
|