I have written some code that tracks the GPS-Data of a user: index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<title>Document</title>
<script type="text/javascript" src="tracking.js"></script>
</head>
<body>
<button class="btn btn-success m-5" onclick="getLocation()">start tracking</button>
<button class="btn btn-danger m-5" onclick="endTrack()">end tracking</button>
</body>
</html>
tracking.js:
var id;
var data = [];
var startTime;
function getLocation() {
startTime = Date.now();
if (navigator.geolocation) {
id = navigator.geolocation.watchPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
var pos = {
lat: position.coords.latitude,
long: position.coords.longitude,
time: Date.now() - startTime
}
data.push(pos);
console.log("Latitude: " + position.coords.latitude +
" Longitude: " + position.coords.longitude);
}
function endTrack() {
console.log("tracking ended");
navigator.geolocation.clearWatch(id);
}
function getData() {
return data;
}
The tracking works fine but I also need to save the data. Best for me would be if the data was saved in a file, e.g. a text file but since I am using Java Script I think this is not possible because it's client side. I know that you can create files and write in files with php but I don't know how to combine php and js in my case to get the data stored in data[] in a file when clicking the end tracking button. How would I do that?
EDIT: I am now sending my data via ajax:
function getData() {
var send = JSON.stringify(data);
console.log(send)
jQuery.post('save.php', {'data': send}, function(data, status) {
alert("Data: " + data + "\nStatus: " + status);
})
}
and receive it like that:
$data = $_POST['data'];
timestamp = date('Y-m-d_H-i-s');
$datei = fopen($timestamp.".txt","x");
fwrite($datei, $data, 100);
fclose($datei);
The problem is if I send a string that looks like that: [{"lat":80.08359300000001,"long":8.4771352,"time":2},{"lat":80.08359300000001,"long":8.4771352,"time":2001}] only 100 characters are printed in the text-file, the console.log(send) shows all characters and also alert("Data: " + data + "\nStatus: " + status); shows all data, only the text-file gives a shortened version. I use XAMPP. I also tried to increase post_max_size and upload_max_size in the php.ini but it doesn't help as well. Why aren't all characters shown? Is there a limit for post (I looked around in other posts and they all said there isn't) or is something wrong with the php or what is it? Btw: I get no error, maybe there is one in the php code but this is not shown to me because it is in another file.
I found the problem: In the php-file was a limit for the amount of characters:
fwrite($datei, $data, 100);
I just needed to change the "100"