POSTで送信したJSONデータの値をPHPの変数に入れたいです。

Question

前提・実現したいこと

初心者です。最近JavaScriptを勉強し始めました。

JavascriptのPOSTを使用してPHPにJSONデータを送信し、
その後PHPを用いてデータベースへインサートしようとしています。

POSTを用いてPHP側に送信するまではできました。
print_r($_POST)でArray ( [text] => {"array1":1,"array2":2,"array3":3,"array4":"お店"} )と出ます。

値として書いている1, 2, 3の実際の値は、
javascriptで手に入れた位置情報の1: latitude(緯度), 2: longitude(経度), 3:accuracyですので少数を含んだ数字です。

PHPからデータベースにインサートするために、この各値(array1~4)をPHPの変数に代入したいのですが、それができません。

発生している問題・エラーメッセージ

Warning: Trying to access array offset on value of type null
警告：タイプnullの値で配列オフセットにアクセスしようとしています

該当のソースコード

        <script>
          'use strict';
          navigator.geolocation.getCurrentPosition(success, fail);

          function success(pos) {
            $(document).ready(function() {
              var lat = pos.coords.latitude;
              var long = pos.coords.longitude;
              var accu = pos.coords.accuracy;
              let geol = `経度：${lat} / 緯度：${long}`;
              $('#geol').text(geol);
              $('#reg').on('click', function() {
                let loc = window.prompt('登録する場所の名前を記入してください。');
                if (loc) {
                  let data = {
                    'array1': lat,
                    'array2': long,
                    'array3': accu,
                    'array4': loc
                  };
                  var data2 = JSON.stringify(data);
                  postForm(data2);
                }
                //$("#tabledata").append('<td>' + data.array1 + '</td>', '<td>' + data.array2 + '</td>', '<td>' + data.array3 + '</td>', '<td>' + data.array4 + '</td>');
              });
            });
          }

          function fail(error) {
            alert('位置情報の取得に失敗しました。エラーコード：' + error.code);
          }

          function postForm(value) {
            var form = document.createElement('form');
            var request = document.createElement('input');
            form.method = 'POST';
            form.action = 'http://localhost/portfolio/git-portfolio/portfolio2/main-branch.php';
            request.type = 'hidden';
            request.name = 'text';
            request.value = value;
            form.appendChild(request);
            document.body.appendChild(form);

            form.submit();
          }
        </script>

  $text = sanitize($_POST['text']);
  $text = json_decode($text);
  print_r($text);

  $lat = $text['array1'];
  $long = $text['array2'];
  $accu = $text['array3'];
  $loc = $text['array4'];

試したこと

・中身の整形の問題なのかとも思い
$text = str_replace(':', '=>', $text);をやって、
{"array"=>1}のようにしてみましたがだめでした。
（エラーの文面が変わりませんでした。）

・エンコードしてからデコードしなおすというのもしましたが、だめでした。

補足情報（FW/ツールのバージョンなど）

POST送信する際に参考にしたページはこちらです。https://www.sejuku.net/blog/53627
FormによるPOSTの中の「JavaScriptから動的にPOST送信する方法」を基に書きました。

Answer 1

sanitizeで何やっているのか知らないですがそこで壊しているんじゃないでしょうか。

変なことをせず、json_decodeに$_POST['text']を直接渡せば動くように思います。

Comments

[tetejiro]

ご回答と、お早いお返事本当にありがとうございます。

アドバイスいただいた通り、sanitizeを取ってみました。
（htmlspecialcharsを行っていました。）すると

stdClass Object ( [array1] => 1 [array2] => 2, [array3] => 4 [array4] => お店 )となり、
Fatal error: Uncaught Error: Cannot use object of type stdClass as array
致命的なエラー：キャッチされないエラー：タイプstdClassのオブジェクトを配列として使用できません

と表示されてしまいました。
stdClass objectというものを初めて目にしましたので、
今調べている途中なのですが、
もし解決策をご存じでしたら、引き続き対応を教えていただけないでしょうか。

すみませんが、よろしくお願いいたします。

[tetejiro]

すみません。今デコードの第2引数をtrueにすることで解決させることができました。

これに1日つぶれていたので、本当にありがたいです。
これにて解決とさせていただきます。

本当にありがとうございました。