Ajax通信で画像ファイルをアップロードしたいのですが、「SyntaxError: Unexpected token < in JSON at position 0」というエラーが出ます

Question

PHPおよびjQueryの勉強のため、Ajax通信を用いて画像ファイルのアップロードを行うファイルとして以下のソースのhtml・phpファイルを作成しました。しかし、Ajax通信が上手くできていないようで、ソースコード中の.fail(function(jqXHR, textStatus, errorThrown)が呼び出され、コンソールに以下のように表示されます。

fail [object File] 200 parsererror SyntaxError: Unexpected token < in JSON at position 0

送信もしくは受信するJSONファイルの内容に問題があるということだと思いますが、具体的な原因が分かりません。
console.log(fd.get("upfile"));では、コンソールに以下のように表示されます。
File {name: "xxx.jpg", lastModified: 1468386651618, lastModifiedDate: ...(以下省略)}

どなたかご教授いただけるとありがたいです。

###ソースコード
ファイル送信側のHTMLファイル：

<meta charset="utf-8">
<script type="text/javascript" language="javascript" src="jquery/jquery-3.1.0.min.js"></script>

<script type="text/javascript">   
    if(window.FormData){
        console.log("FormDataに対応している");
    }else{
        console.log("FormDataに対応していない");
    }

    jQuery(function(){
        jQuery("#file_upload_form").submit(function(){
            var fd = new FormData(document.getElementById("file_upload_form"));
            console.log(fd.get("upfile"));
            jQuery.ajax({
                url: "uploader.php",
                type: "POST",
                data: fd,
                cache: false,
                processData: false,
                contenttype: false,
                dataType: 'json'
            })
            .done(function(data, textStatus, jqXHR){
                console.log("success " + data);
                alert(data);
            })
            .fail(function(jqXHR, textStatus, errorThrown){
                console.log("fail " + fd.get("upfile") + " " + jqXHR.status+ " " + textStatus+ " " + errorThrown);
                alert("fail");
            });
            return false;
        });
    });
</script>

<form id = "file_upload_form" enctype="multipart/form-data" method="post" name="file_upload_form">
    ファイル：
    <input type="file" name="upfile" id="upfile">
    <input type="submit" value="アップロードする" id="upload_file_button">
</form>

ファイルを受信し、アップロードするPHPファイル（uploader.php）：

<?php
    header('Content-Type: application/json; charset=utf-8');//JSON形式で出力する
    $updir = "./upload/";
    $filename = $_FILES['upfile']['name'];
    if(move_uploaded_file($_FILES['upfile']['tmp_name'],$updir.$filename)==FALSE)
    {
        print("Upload failed");
        print($_FILES['upfille']['error']);
    }
    else{
        print("<b>" .$filename ."</b> uploaded");
        $json = json_decode($filename);
        echo json_encode($json);
    }
?>

Answer 1

多分というか予想というか経験上の「アレかな？」って回答ですが。
PHP側で、NoticeやWarningが出ていて、それがJSONの前に吐かれている気がします。
それらのメッセージテキストはタグで装飾されているので、例えば

<br />
<b>Notice</b>:  Undefined variable:・・・{"first":1,"second":2,"third":3}

とかが返っているのではないかと

jQueryからではなくFiddlerとかTelnetとか使うなりして、Responseを確認してみていただけますか。
若しくは、Chrome等の開発者ツールを使って、ajax通信のレスポンスを確認してみてもいいですが。

Comments

[KIT_spot75]

回答ありがとうございます。
ajax通信のレスポンスを確認したところ、ご指摘の通り
<br />
<b>Notice</b>: Undefined index: upfile in <b>C:\xampp\htdocs\samplephp\uploader.php</b> on line <b>4</b><br />
<br />
<b>Notice</b>: Undefined index: upfile in <b>C:\xampp\htdocs\samplephp\uploader.php</b> on line <b>5</b><br />
null
となっていました。

SyntaxErrorの原因は分かりましたが、Noticeの内容や
JSONとして返ってきてほしい部分がnullになっていることから、
ファイルをPHPに送信する段階で問題が発生していると考えています。

この問題に関しても質問したいのですが、一度今の質問を解決済みにして
新しく質問を作り直すべきでしょうか？

ちなみに、今のPHPファイルは次のようになっています。

<?php
header('Content-Type: application/json; charset=utf-8');//JSON形式で出力する
$updir = "./upload/";
$filename = $_FILES['upfile']['name'];
if(move_uploaded_file($_FILES['upfile']['tmp_name'],$updir.$filename)==FALSE)
{
echo json_encode($filename);
}
else{
$json = json_decode($filename);
echo json_encode($json);
}
?>

[kunai]

別の質問にした方がいいですね。
対象のシステムが同じでも問題が異なるので。

[KIT_spot75]

やはりそうですね。
では、こちらは解決済みにして新しく質問を作ります。
回答いただき、ありがとうございました。

（追記：後でこの質問を見た方へ
この質問の続きは48790番です。）

Answer 2

jQuery側で

fail [object File] 200 parsererror SyntaxError: Unexpected token < in JSON at position 0

と出ているということは、phpから受け取ったレスポンスが「<」で始まっていることが原因と思われます。
upload.phpの

print("<b>" .$filename ."</b> uploaded");

を削除もしくはコメントアウトして再度実行してみてもらえますでしょうか？

printもechoと同様にレスポンスの内容に含まれてしまいますので、
JSONとして受け取りたいのでしたらそれ以外のものは出力しないようにした方がいいと思います。

Comments

[KIT_spot75]

回答ありがとうございます。
なるほど、と思い全てのprint
（move_uploaded_fileが失敗したときのものも含めて）を削除しましたが、
まだ同じエラーが発生しています。