Ajax通信でphpにリクエストをかけCSVファイルの内容をJSON形式でやり取りしたい

Question

前提・実現したいこと

ajaxでphpにリクエストをかけCSVファイルの内容をJSON形式でやり取りしたいのですがうまくいきません。

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

SyntaxError: Unexpected token < in JSON at position 0
…とアラートで表示されます

該当のソースコード

//json_encode.php

//------------------------------------------------------------
//●改行を消す
//------------------------------------------------------------
function indention($str){
    $str = str_replace("\n","",$str);
    $str = str_replace("\r","",$str);
    return $str;
}

//------------------------------------------------------------
//●配列の中身に該当するデータがあれば該当する件数を返す。
//１件以上ある場合「件数」。０件の場合falseを返す。
//------------------------------------------------------------

function searchData($array,$column_num,$serch_ward){
   $hit = 0;
   foreach($array as $value){
      if($value[$column_num] == $serch_ward){
         $hit++;
      }
   }
   return $hit > 0 ? $hit : false ;
}

//------------------------------------------------------------
//●CSVファイルを読み込む
//------------------------------------------------------------

function open_csv($pass){
    $fp = fopen($pass,'r');
    $value = fgets($fp);
    $member = [];
    $flag = 0;
    
    while($value !== false){
       $flag = 1;
       $member[] = explode(",",$value);
       $value = fgets($fp);
    }
    fclose($fp);
 
    return $member;
}

//※「select_num.txt」には１桁の数字が記述されています。
$fp = fopen('./data/select_num.txt','r'); 
$select_num = fgets($fp);
fclose($fp);

$select_num = indention($select_num);

//CSVファイルを開く
$all_question_child = open_csv('./data/question_child.csv');
$all_question_parent = open_csv('./data/question_parent.csv');
//該当する問題データの抽出
$question_child = get_array_by_search($all_question_child,1,$select_num); //◎第三引数
$question_parent = get_array_by_search($all_question_parent,0,$select_num); //◎第三引数

echo json_encode([$question_parent,$question_child]);

ちなみに以下のような記述ならばajax通信が行われ、コンソールログに値が格納されていました。

$data = [
    [1,"ふじ山","110","./../movie/quiz_01.mp4","5","./../img/quiz_icon01.png"],
    [2,"あべのハルカス","1111111","./../movie/quiz_02.mp4","10","./../img/quiz_icon02.png"],
    [3,"ほうりゅう寺","111110","./../movie/quiz_03.mp4","15","./../img/quiz_icon03.png"],
    [4,"かんとう平野","111100","./../movie/quiz_04.mp4","20","./../img/quiz_icon04.png"],
    [5,"おきのとり島","111110","./../movie/quiz_05.mp4","40","./../img/quiz_icon05.png"],
    [6,"くろべ峡谷","11100","./../movie/quiz_06.mp4","60","./../img/quiz_icon06.png"],
    [7,"たざわ湖","1110","./../movie/quiz_07.mp4","100","./../img/quiz_icon07.png"]
 ];
 
 echo json_encode($data);

$(function(){
    $.ajax({
      type: "POST",
      url: "./../php/json_encode.php",
      dataType : "json"
    }).done(function(data){
      console.log(data);
    }).fail(function(XMLHttpRequest, textStatus, error){
      alert(error);
    });
});

ファイルの階層は以下の通りです…！

試したこと

・「JSからの相対パス」や「Ajaxの記述されたJSを読み込むHTMLからの相対パス」もどちらもURLに打ち込んでみましたが失敗しました。

Comments

[hentaiman]

エラーになった時に通信失敗アラート表示するようにしているからエラーじゃないように見えるだけで実際はエラーです。
php側とjs側双方でログを出力し通信内容を確認しましょう

[UpaZiro]

ありがとうございます。確認します。

[UpaZiro]

あ…「ログを出力する」…というと具体的にどのようなことを行えばよいのでしょうか？

[hentaiman]

php側は
・エラーログを見る
・display_errorsをOnにする
・そもそも構文エラーじゃないかチェックする

js側は開発者ツール開けばコンソールタブにエラーが表示される、それからネットワークタブを見る
> }).fail(function(data){
のdataをconsole.logとかで表示しても良い

[UpaZiro]

共に、それぞれブラウザ作動させたのですが特にエラーメッセージは出てないんですよね…。PHP側はJSON形式にエンコードされた配列がechoで問題なく出力されており、JS側もコンソールにエラーメッセージは見当たりません（Chromeのコンソールで確認しています）。
ちなみに、相対パスはこの場合、どこを起点にした記述をすればいいのでしょうか？

[hoshi-takanori]

php 側で json を 2 回出力するのはおかしいのでは。

[m.ts10806]

コメント見る前に回答してしまった。
hoshi-takanoriさんの指摘道理でしょうね。

[UpaZiro]

ありがとうございます！
書き方を変えてみましたが直りませんでした…泣
少し色々模索してみて質問内容を編集してみました。
なにか手がかりがありましたら教えてください…！

Answer 1

エラーを表示させてないので出てないように見えるだけでは。
fail()は3つ引数を受け取れます。

[

jQuery.ajax()](https://api.jquery.com/jquery.ajax/)
・jqXHR.fail(function( jqXHR, textStatus, errorThrown ) {});

学習時期、開発途中ではすべてconsole.log()で出しておいても損はありません。
デバッグですね。

おそらく、原因は下記

echo json_encode($question_child);

echo json_encode($question_parent);

これではJSON形式として正しい文字列とはなりません。
dataTypeが期待する形になっていないというわけです。

<?php
$question_child = [];
$question_parent = [];
echo json_encode($question_child);
echo json_encode($question_parent);

[][]

どういう形のデータを欲しいのかはわかりませんが、
doneに返したいだけならこうかな。

echo json_encode([$question_child,$question_parent]);

Comments

[UpaZiro]

ありがとうございます！
直りませんでした…(-_-;)

配列をjson_encode.phpで直接入力し、エンコードしたものはエラーなく受け取れていたのでPHP側に問題があるのかな…と思ったのですがわかりません。

ファイルの階層や書き換えた内容を質問編集で書いておきました。

なにか糸口があれば教えてください…(-_-;)

[m.ts10806]

「直るかどうか」はそもそも「どういう出力にしたいか」というのを知ってないと判断できません。
質問内容に書いてないのでわかりません。
また、「SyntaxError: Unexpected token < in JSON at position 0」
は結局JSON形式として解釈できない文字列の場合に出るものです。
コード見た感じ、何もPOST送信してないようですし
type: "POST",
↓
type: "GET",
にしたうえで、ブラウザから直接URLを実行してみてください。
何か別のものが混じってるはずです。
結局デバッグするしかないですね。
txtの内容もこちらにはわかりませんし。

[UpaZiro]

phpの方で書き換えた際にエラーが起きていました！
なおしたらコンソールに配列の内容が出てきました！
ありがとうございました！

[m.ts10806]

単体でデバッグするようにしてください。