0
jsonファイルにデータを追加する方法について多くの記事が赤く表示されています。私はそれをまとめて自分の状況に使用しようとしましたが、動作しません。基本的に私は、javascriptを使ってhtmlファイルからデータを取得し、XMLHttpリクエストを使用してそのデータをphpファイルに送信し、PHPファイルから.jsonファイルにデータを追加しようとしています。 Anywho、それはそれを追加していないと私はなぜ、どこに問題があるのか分からない。 私の質問はXMLHttpリクエストについてです。それが正しいか？何故なの？ PHPファイルについては 。問題がXMLHttpリクエストにある場合、phpファイルは.jsonファイルにデータを追加しますか？私はjsonファイルで何かを取得しようとしているだけなので、実行可能にするアルゴリズムについて考え始めることができます。 XMLHttpリクエストは私にとってはかなり新しいものです。理解のために、ここに私のコードは次のとおりです。jsonファイルにデータを追加しない
のindex.html：
<!DOCTYPE html>
<html>
<head>
<title>Project</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/style_mob.css" type="text/css" rel="stylesheet">
<script src="script/jquery.js"></script>
<script src="script/sendData.js"></script>
</head>
<body>
<div id="top">
<h1>Click only in case of an emergency!</h1>
</div>
<div id="divButtons">
<button class="button" id="polizei">Polizei</button>
<button class="button" id="feuerwehr">Feuerwehr</button>
<button class="button" id="krankenwagen">Krankenwagen</button>
</div>
</body>
</html>
sendData.js：
$(document).ready(function() {
var type;
var latitude;
var longitude;
var currentdate = new Date();
$(".button").click(function(){
type = $(this).attr("id");
var dateTime = "Date: " + currentdate.getDay() + "/"+(currentdate.getMonth()+1)
+ "/" + currentdate.getFullYear() + " time - "
+ currentdate.getHours() + ":"
+ currentdate.getMinutes();
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(sendData);
} else {
alert("Geolocation is not supported by this browser.");
}
function sendData(position) {
latitude = position.coords.latitude;
longitude = position.coords.longitude;
}
var hr = new XMLHttpRequest();
hr.open("POST", "emergencyData.php", true);
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
alert("about to send data to php file");
hr.send("type="+type+"&latitude="+latitude+"&longitude="+longitude+"$dateTime="+currentdate+"");
});
});
emergencyData.php：
<?php
header("Content-Type: application/json");
$type = $_POST["type"];
$latit = $_POST["latitude"];
$longit = $_POST["longitude"];
$dateTime = $_POST["dateTime"];
echo $type;
// Loading existing data:
$json = file_get_contents("emergencyData.json");
$data = json_decode($json, true);
// Adding new data:
$data[0] = array('type' => $type, 'latitude' => $latit, 'longitude' => $longit, 'date' => $dateTime);
// Writing modified data:
file_put_contents('emergencyData.json', json_encode($data, JSON_FORCE_OBJECT));
?>
これは、Chromeの開発ツールの[ネットワーク]タブを使用してデバッグを開始できます。適切なリクエストがサーバーに送信されているかどうかを確認し、適切なものが応答として返送されているかどうかを確認します。 AJAXリクエスト（xmlhttp ...）が正しく動作することを確認したら、PHPロジックのデバッグを開始できます。現在のところ、新しいデータを追加していないように見えますが、データは常に0番目のインデックスに設定されています。だから、PHPの配列にデータを追加する方法を見てください。また、jQueryを使用している限り、XMLHttpRequestの代わりに$ .AJAXを使用する必要があります。それはより簡単です。 –
ウェブサーバーをセットアップしているのですか、これをローカルで実行しようとしていますか？ –
はい、私は言及するのを忘れました。私は無料のオンラインWebサーバーでこれを試しています。 – Oskars