Ladda upp och visa var bilder är tagna är det många webbsidor som erbjuder som tjänst. Vill man kunna göra det själv så är det faktiskt inte så svårt.
I detta inlägg skall jag visa hur du gör detta med PHP och Javaskript.
PHP tillåter i grunden bara filer upp till 2 Mb att laddas upp med skripten. Detta kan man ändra genom att redigera en fil på servern:
sudo vi /etc/php5/apache2/php.ini
Din php.ini kanske finns någon annanstans, men om du skapar ett enkelt php dokument med nedanstående text och kör det genom servern i en webbläsare, så står det där var filen är sparad på servern.
<html> <body> <?php phpinfo( ); ?> </body> </html>
Ändra upload_max_filesize: 2M till något mer passande, jag väljer 8 Mb. När du är klar så startar du om webbservern:
sudo service apache2 restart
Först så skapar man ett enkelt formulär som pekar ut filen man vill ladda upp.
<form action="ladda.php" method="post" enctype="multipart/form-data"> <label for="file">Bild: </label> <input type="file" name="file" id="file"><br><br> <input type="submit" name="submit" value="Ladda Upp"> </form>
Sedan behöver man skapa ett PHP dokument som tar hand om filen, testar den och kopierar den till lämplig plats. Här har jag valt katalogen ”upload” på samma plats där webbsidan finns. För att det skall fungera så måste den mappen finnas och användaren måste ha skrivrättigheter i den ( chmod 777 upload/ ).
<html>
<body>
<p>Uppladdad bild...</p>
<?php
//Funktion för att beräkna GPS data
function getGps($exifCoord, $hemi) {
$degrees = count($exifCoord) > 0 ? dela($exifCoord[0]) : 0;
$minutes = count($exifCoord) > 1 ? dela($exifCoord[1]) : 0;
$seconds = count($exifCoord) > 2 ? dela($exifCoord[2]) : 0;
$flip = ($hemi == 'W' or $hemi == 'S') ? -1 : 1;
return $flip * ($degrees + $minutes / 60 + $seconds / 3600);
}
//Dela EXIF data med "bråk" värde
function dela($coordPart) {
$parts = explode('/', $coordPart);
if (count($parts) <= 0)
return 0;
if (count($parts) == 1)
return $parts[0];
return floatval($parts[0]) / floatval($parts[1]);
}
// Tillåtna extensions
$allowedExts = array("jpeg", "jpg", "JPG", "JPEG");
// Kontrollera att det är bilder och med rätt storlek
$temp = explode(".", $_FILES["file"]["name"]);
$extension = end($temp);
if ((($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/jpg"))
&& ($_FILES["file"]["size"] < 8000000)
&& in_array($extension, $allowedExts))
{
if ($_FILES["file"]["error"] > 0)
{
// Skriv felkod om något gick galet
echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
}
else
{
echo "Uppladdad: " . $_FILES["file"]["name"] . "<br>";
echo "Typ: " . $_FILES["file"]["type"] . "<br>";
echo "Storlek: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
echo "Temp fil: " . $_FILES["file"]["tmp_name"] . "<br>";
$newfile = "upload/" . $_FILES["file"]["name"];
if (file_exists($newfile))
{
// Om filen redan finns
echo $_FILES["file"]["name"] . " finns redan. ";
}
else
{
// Om allt fungerar
//överför filen till den nya platsen med det nya namnet, visa felmeddelande om det inte gick.
$copied = move_uploaded_file($_FILES['file']['tmp_name'],
$newfile);
if (!$copied)
{
echo '<h1>Kopiering misslyckades!</h1>';
} else {
echo "Sparat i: " . $newfile;
//hämta EXIF informationen från filen
$exif = read_exif_data( $newfile);
$emake =$exif['Make'];
$emodel = $exif['Model'];
$eexposuretime = $exif['ExposureTime'];
$efnumber = dela($exif['FNumber']);
$eiso = $exif['ISOSpeedRatings'];
$edate = $exif['DateTime'];
$dir = dela($exif['GPSImgDirection']);
$alt = dela($exif['GPSAltitude']);
$lon = getGps($exif['GPSLongitude'], $exif['GPSLongitudeRef']);
$lat = getGps($exif['GPSLatitude'], $exif['GPSLatitudeRef']);
echo "<br />\n";
echo "Bildfil: <a href='$newfile'>Visa bild</a><br />\n";
echo "Longitud: $lon<br />\n";
echo "Latitud: $lat<br />\n";
echo "Höjd: $alt<br />\n";
echo "Riktning: $dir<br /><br />\n";
echo "Kamera tillverkare: $emake<br />\n";
echo "Modell: $emodel<br />\n";
echo "Exponering: $eexposuretime s<br />\n";
echo "F-numer: $efnumber<br />\n";
echo "ISO: $eiso<br />\n";
echo "Tidpunkt: $edate<br />\n";
}
}
}
}
else
{
// Om det inte är rätt filtyp eller storlek...
echo "Endast JPG/JPEG filer mindre än 8 Mb är tillåtna...";
}
?>
</body>
</html>
I filen ovan så finns även två funktioner som används för att räkna om GPS-information i EXIF data i filerna. Dessutom så kommer en hel del andra EXIF data läsas och skrivas ut på skärmen. Om det finns positionsdata så lagras dessa i variablerna $lat och $lon, vilket gör det enkelt att infoga en leafletkarta panorerade till rätt plats, kanske med en ”pin” som markör.
Lägg bara till html-kod, som i tidigare inlägg, för att skapa webbkartan och ”skjut in” koordinaterna från PHP-skriptet i Javaskriptet som JSON data:
<SCRIPT>
var map = L.map('map', {
center: [<?php echo json_encode($lat); ?>, <?php echo json_encode($lon); ?>],
zoom: 10
});
// Här läggs alla lager till
</SCRIPT>
Det är inte en komplett kod som visas ovan, utan endast hur du infogar PHP kod i Javascript. Vill du se ett exempel på hela koden så ladda hem exempelfilerna från GitHub längre ner.
Om du följt med i serien med hur du skapar en egen server för geodatatjänster, eller om du har en linuxserver med PHP installerat så kan du snabbtesta det jag beskrivet här med nedanstående kommandon. Börja med att gå till en katalog på din webbserver (exempelvis: /var/www ).
sudo mkdir upload sudo chmod 777 upload sudo wget https://github.com/klakar/geosupportsystem/raw/master/ladda.htm sudo wget https://github.com/klakar/geosupportsystem/raw/master/ladda.php
Öppna sidan ”ladda.htm” i webbläsaren Nu skall du förhoppningsvis kunna ladda upp bilder upp till 2 Mb utan felmeddelande och om du ändrar i php.ini enligt det som beskrivits ovan så kan du ladda upp 8 Mb. Jag har snyggat till koden lite i de filer du kan ladda hem ovan, och det ser även lite snyggare ut på skärmen.
Lycka till.