【ajax】phpの配列をjsで取得したい

Question

前提・実現したいこと

phpで作成した配列をjsでajaxを使って
echoやprint_rなどを使わないで受け取りたい。

該当のソースコード

//ajax.php
<?php
$data = [
  "test"=>[
    [
      "色"=>"赤",
      "形"=>"丸",
      "硬度"=>"固い"
    ],
    [
      "色"=>"青",
      "形"=>"四角",
      "硬度"=>"固い"
    ],
　　 [
      "色"=>"緑",
      "形"=>"丸",
      "硬度"=>"柔らかい"
    ],
  ]
];
print_r($data); //print_rすると一応表示はされる
 ?>

$(function () {
  // Ajax
  $.ajax({
    url: 'ajax.php',
    type: "POST",
    dataType: "json",
    success: function(data){
      var dataArray = data.test;
      console.log(dataArray); //なにも表示されない

試したこと

jsのurl部分をphpではなく下記のようなjsonファイルの場合は正常に表示される

test.json

{
  "test":[
    {
      "色":"赤",
      "形":"丸",
      "硬度":"固い"
    },
    {
     "色":"青",
      "形":"四角",
      "硬度":"固い"
    },
    {
      "色":"緑",
      "形":"丸",
      "硬度":"柔らかい"
    }
  ]
}

また、ajax.phpに上記のjsonを読み込んだ場合も正常に表示されました。

$url = "test.json";
$json = file_get_contents($url);
$json = mb_convert_encoding($json, 'UTF8', 'ASCII,JIS,UTF-8,EUC-JP,SJIS-WIN');
echo $json;

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

Chromeのコンソールでみた際には下記のように表示させたいです。

(3) [{…}, {…}, {…}]
0:{色:"赤" 形:"丸", 硬度:"固い"}
1:{色:"青" 形:"四角", 硬度:"固い"}
2:{色:"緑" 形:"丸", 硬度:"柔らかい"}
length:3
__proto__:Array(0)

ご教示宜しくお願いします。

Comments

[KaiShoya]

echoやprint_rを使いたくない理由はなんですか？

[MeB]

ファイルにアクセスされた際にデータ（ここでいう色や形）が見れてしまうのを避けたいためです。

[m.ts10806]

前の回答参考にしてます？javascript上で扱うということは誰でも参照可能ですよ。

[m.ts10806]

それに「文字列で返す」と回答したはずが配列そのまま返そうとしてるし。。。もうちょっとちゃんと調べてください。

Answer 1

• ajax.php

mb_internal_encoding("UTF-8");
$data = [
  "test"=>[
    [
      "色"=>"赤",
      "形"=>"丸",
      "硬度"=>"固い"
      ],
    [
      "色"=>"青",
      "形"=>"四角",
      "硬度"=>"固い"
      ],
    [
      "色"=>"緑",
      "形"=>"丸",
      "硬度"=>"柔らかい"
      ],
    ]
  ];
print json_encode($data);

$(function(){
  $.ajax({
  url: 'ajax.php',
  type: "POST",
  dataType: "json",
  }).done(function(data){
    console.log(data);
  }).fail(function(xhr,err){
    console.log(err);
  });
});

parsererrorが出る場合は、dataTypeをtextにしてデバッグ