投稿2017/09/09 05:26
編集2017/09/09 14:50###前提・実現したいこと
mysqlのデータをphpで取得し、jsonにして
Ajaxで取得したいのです。
###発生している問題・エラーメッセージ
Ajaxのエラーでこちらがでました。
SyntaxError: Unexpected token < in JSON at position 0
こちらのサイトでも同じエラーので質問されている方がいらっしゃって、
形式がjsonじゃないからということでした。
そこでエラーの内容から
data:textに変更してconsole.logに出力してみると、
自身ののHTMLデータが入っていました。。。
初心者なのですが、ご教授下さい。
###該当のソースコード
php
1/* garally2.php */ 2require_once('./php/ponta.php');// DBに接続 3$db->query('set names utf8'); 4$ps = $db->query('select * from wan2 order by ban desc'); 5$users = null; 6while ($row = $ps->fetchObject()) 7 { 8 $users[] = array( 9 'ban'=> $row->ban 10 ,'nam' => $row->nam 11 ,'ttl' => $row->ttl 12 ,'mes' => $row->mes 13 ,'gaz' => $row->gaz 14 ,'dat' => $row->dat 15 ); 16 } 17// JSON形式で出力する 18 header('Content-Type: application/json; charset=utf-8'); 19 json_decode($users); 20 $users = json_encode( $users ); 21 echo $users; 22?>
"gallery1.php"に別jsファイルとしてこちらを読込ませました。
"gallery2.php"は同じディレクトリです。
js
1$.ajax({ 2 type: "POST", 3 data: "gallery2.php", 4 dataType: "json", 5 crossDomain: false, 6 scriptCharset: "UTF-8", 7 cache: false 8}).done(function(data) { 9 //console.log(data); 10 console.log($.parseJSON(data)); 11}).fail(function(XMLHttpRequest, textStatus, errorThrown) { 12 alert('Error : ' + errorThrown); 13});
###試したこと
まず、gallery2.phpを直接たたいたところ、形式はjsonの形になっているようでした。
gallery2.php
1[{"ban":"56","nam":"eru","ttl":"\u30dd\u30f3\u592a","mes":"\u306e\u306e","gaz":"20170905230540IMG_0322.JPG","dat":"2017-09-05"} 2(中略) 3{"ban":"47","nam":"eru","ttl":"fff","mes":"furanku","gaz":"2017090322121104_10_03_13_34.jpg","dat":"2017-09-03"}]
そこでエラーの内容から
data:textに変更してconsole.logに出力してみると、
自身のgallery1.phpのHTMLデータが入っていました。。。
js
1$.ajax({ 2 type: "POST", 3 data: "gallery2.php", 4 dataType: "text", 5 crossDomain: false, 6 scriptCharset: "UTF-8", 7 cache: false 8}).done(function(data) { 9 //console.log(data); 10 //console.log($.parseJSON(data)); 11}).fail(function(XMLHttpRequest, textStatus, errorThrown) { 12 alert('Error : ' + errorThrown); 13});
###なおしたことその２
php側で
json_decode()→json_encode（）のみにして
header('Content-Type~はdatatypeがjsonなら不要なのではずした。
また、
指摘を頂いてphp側に
echo json_encode(array(
'ban' => 'ban1',
'nam' => 'nam1',
'ttl' => 'ttl1',
'gaz' => 'gaz1',
'dat' => 'dat1',
));
json側でちゃんと読込まれていたので
原因はphp側と判明。
gallery2.php
1<?php 2require_once('./php/ponta.php'); 3$db->query('set names utf8'); 4$ps = $db->query('select * from wan2 order by ban desc'); 5$users = []; 6 7while ($row = $ps->fetchObject()) 8{ 9 $users[] = array( 10 'ban'=> $row->ban 11 ,'nam' => $row->nam 12 ,'ttl' => $row->ttl 13 ,'mes' => $row->mes 14 ,'gaz' => $row->gaz 15 ,'dat' => $row->dat 16 ); 17} 18 19echo json_encode($users); 20?>
一応js側
js
1$.ajax({ 2 type: "POST", 3 data: "gallery2.php", 4 dataType: "json", 5 crossDomain: false, 6 scriptCharset: "UTF-8", 7 cache: false 8}).done(function(data) { 9 //console.log(data); 10 console.log($.parseJSON(data)); 11}).fail(function(XMLHttpRequest, textStatus, errorThrown) { 12 alert('Error : ' + errorThrown); 13});
###補足情報(言語/FW/ツール等のバージョンなど)
PHP 5.6.31
jquery-2.1.1
回答2件
0
ベストアンサー
まず、PHPコードは下記のようにします。json_encode()です。$.ajax()のdataTypeの設定は返された文字列をどのように解釈するかの設定で、jsonに設定しておけば勝手にjsonに解釈されます。
php
1/* garally2.php */ 2require_once('./php/ponta.php');// DBに接続 3 4$db->query('set names utf8'); 5$ps = $db->query('select * from wan2 order by ban desc'); 6$users = []; 7 8while ($row = $ps->fetchObject()) 9{ 10 $users[] = array( 11 'ban'=> $row->ban 12 ,'nam' => $row->nam 13 ,'ttl' => $row->ttl 14 ,'mes' => $row->mes 15 ,'gaz' => $row->gaz 16 ,'dat' => $row->dat 17 ); 18} 19 20// JSON形式で出力する 21echo json_encode($users); 22?>
JavaScriptは下記のようにします。
js
1$.ajax({ 2 type: "POST", 3 url: "gallery2.php", 4 dataType: "json", 5 cache: false 6}).done(function(data) { 7 console.log(data); 8}).fail(function(XMLHttpRequest, textStatus, errorThrown) { 9 console.log(XMLHttpRequest, textStatus, errorThrown); 10});
うまくいかない原因として、JavaScriptが原因なのかPHPが原因なのか明確にします。
garally2.phpを下記のようにしてみます。正しく表示されればPHPが原因ということになります。逆に正しく表示されない場合は、JavaScriptが原因ということになります。
Content-Typeは上記に書いたようにdataTypeを指定すれば普通は必要ありません。
php
1//garally2.php 2echo json_encode(array( 3 'ban' => 'ban1', 4 'nam' => 'nam1', 5 'ttl' => 'ttl1', 6 'gaz' => 'gaz1', 7 'dat' => 'dat1', 8));
JavaScriptコンソールには「Parse Error」となっているので必ずなにかJson文字列として認識できない文字列が入っているはずですが、jQueryのバグの可能性もあります。
ですので、jQueryのバージョンをダウングレードしてみるのも良いかもしれません。
■Jsonエンコードエラーチェック
Jsonのエンコードでエラーが発生している場合は下記のコードのようにjson_last_error()でチェックすることができます。エンコードエラーが発生していない場合は、下記のようにJson Lintチェッカーで構文チェックします。
■Jsonエンコードオプション
その他、Jsonエンコードではオプションを複数渡すことができます。PHPマニュアルのjsonの定義済み定数を参照してください。日本語のユニコードエスケープをさせないようにしたり、Json文字列の構文チェックすることを念頭に置いてインデントと改行でフォーマットして表示することも可能です。
■Json Lintチェッカー
Jsonフォーマットは下記のようなJson Lintでチェックできます。このようなチェッカーサイトでは、ピンポイントでどの行がフォーマットエラーなのか表示してくれます。
https://jsonlint.com/
ブラウザのデバッグ（F12）の「ネットワーク」などからレスポンスソース（JSON文字列）をそのまま上記サイトにコピー＆ペーストしてJsonフォーマットをチェックします。
php
1/* garally2.php */ 2require_once('./php/ponta.php');// DBに接続 3 4$db->query('set names utf8'); 5$ps = $db->query('select * from wan2 order by ban desc'); 6$users = []; 7 8while ($row = $ps->fetchObject()) 9{ 10 $users[] = array( 11 'ban'=> $row->ban 12 ,'nam' => $row->nam 13 ,'ttl' => $row->ttl 14 ,'mes' => $row->mes 15 ,'gaz' => $row->gaz 16 ,'dat' => $row->dat 17 ); 18} 19 20//JSONエンコードしてみる（エラーチェック用） 21json_encode($users, JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT); 22 23$debug = []; 24 25//JSONエンコードエラーチェック 26switch (json_last_error()) { 27 case JSON_ERROR_NONE : 28 $debug = ['SUCCESS' => 'エラーは発生しませんでした']; 29 break; 30 case JSON_ERROR_DEPTH : 31 $debug = ['FAIL' => '配列の深さが最大値を超えました']; 32 break; 33 case JSON_ERROR_STATE_MISMATCH : 34 $debug = ['FAIL' => 'JSON の形式が無効、あるいは壊れています']; 35 break; 36 case JSON_ERROR_CTRL_CHAR : 37 $debug = ['FAIL' => '制御文字エラー。おそらくエンコーディングが違います']; 38 break; 39 case JSON_ERROR_SYNTAX : 40 $debug = ['FAIL' => '構文エラー']; 41 break; 42 case JSON_ERROR_UTF8 : 43 $debug = ['FAIL' => '正しくエンコードされていないなど、不正な形式の UTF-8 文字']; 44 break; 45 case JSON_ERROR_RECURSION : 46 $debug = ['FAIL' => 'エンコード対象の値に再帰参照が含まれています']; 47 break; 48 case JSON_ERROR_INF_OR_NAN : 49 $debug = ['FAIL' => 'エンコード対象の値に NAN あるいは INF が含まれています']; 50 break; 51 case JSON_ERROR_UNSUPPORTED_TYPE : 52 $debug = ['FAIL' => 'エンコード不可能な型の値が渡されました']; 53 break; 54 default : 55 $debug = ['FAIL' => '不明なエラー - Unknown error']; 56 break; 57} 58 59//日本語をユニコードエスケープしない（JSON_UNESCAPED_UNICODE） 60//JSONをインデントと改行をつけて見やすい形式で表示（JSON_PRETTY_PRINT） 61echo json_encode($debug + $users, JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT); 62 63exit();
コメント欄で頂いた、エラーのJSON文字列をコピーしたところ先頭になぜかBOM（\ufeff）が入っていました。何かBOM付ファイルを参照していたりしないでしょうか？
DBから値を取得して配列を作成するときに、\n→<br>が必要な場合はnl2br()を行ってから下記のコードのように制御文字コードを削除するようにします。
下記のコードでもJsonの構文エラーが出る場合は、Jsonをそもそも表示する前に制御文字が出力されている可能性があるので、ob_start(), ob_end_clean()の行をコメントアウトしてみます。
ob_start(), ob_end_clean()間ですべての出力を切り捨てて、制御文字が出力されないようにします。
php
1/* garally2.php */ 2//ob_start(); 3require_once('./php/ponta.php');// DBに接続 4 5$db->query('set names utf8'); 6$ps = $db->query('select * from wan2 order by ban desc'); 7$users = []; 8 9while ($row = $ps->fetchObject()) 10{ 11 foreach (['ban','nam','ttl','mes','gaz','dat'] as $column) { 12 //制御文字を削除 13 $value = preg_replace('/[\x00-\x1F\x80-\xFF]/', '', $row->{$column}); 14 //nl2br()付制御文字削除 15 //$value = preg_replace('/[\x00-\x1F\x80-\xFF]/', '', nl2br($row->{$column})); 16 $users[] = [$column => $value]; 17 } 18} 19 20//ob_start()からここまでの出力を切り捨て 21//ob_end_clean(); 22 23//日本語をユニコードエスケープしない（JSON_UNESCAPED_UNICODE） 24//JSONをインデントと改行をつけて見やすい形式で表示（JSON_PRETTY_PRINT） 25echo json_encode($debug + $users, JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT); 26 27exit();
投稿2017/09/09 09:25
編集2017/09/10 08:42
総合スコア1652
0
data: "gallery2.php", は url: "gallery2.php", では？
【jQuery.ajax() | jQuery API Documentation】
http://api.jquery.com/jquery.ajax/
投稿2017/09/09 05:29
総合スコア69407
あなたの回答
tips
プレビュー
Q&A
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/09/09 10:30
2017/09/09 10:41
2017/09/09 12:58
2017/09/09 13:30
2017/09/09 14:56
2017/09/09 15:43
2017/09/09 16:18
2017/09/10 07:58
2017/09/10 08:23
2017/09/10 08:43
2017/09/10 09:37