事象
下記のようなエラーが発生する
JSON.parse: unexpected character at line 1 column 1 of the JSON data
文字列(JSON形式)をJSON.parse()
でJSのオブジェクト型に変換する際に、
JSON構文エラーになっている模様。
構文チェッカーでチェックしても普通に問題はない。
JSON Pretty Linter - JSONの整形と構文チェック
環境
- サーバー側(PHP)とフロントエンド側(JavaScript、JQuery)でAjax的なことをする
- サーバー側にPOSTでアクセスすると、結果がJSONで返却される
以下JavaScript側サンプルコード
//サーバー上のファイルを削除する function cancel(){ if(!confirm('サーバー上のファイルを削除します。よろしいですか?')){ return false; } //サーバーに受け渡し $.ajax({ type: 'POST', url: 'php/cancel.php' <<<<< ★ }).done((result)=>{ showResultMsg(result); }); } function showResultMsg(json){ console.log(json); var result = JSON.parse(json); // <<<<<<こいつがエラーを吐く if (result.result != 'SUCCESS'){ //エラー時 $('#result').attr('class','warning'); console.log(result); } else { //成功時 $('#result').attr('class',''); } $('#result').text(result); }
原因
サーバー側のcancel.php
が原因。
他ファイルは全てUTF-8で統一されていたが、こいつだけUTF-8-BOM
になっていた。
なので、'echo`して返却したJSONがおかしいことに なっていたっぽい
BOMとは
感想
クソハマったのでつらかった。