首页 > 解决方案 > 未捕获的 SyntaxError:JSON.parse:JSON 数据的第 1 行第 1 列的意外字符

问题描述

因此,我将建立一个社交网络作为个人爱好,但最近,当我尝试点赞帖子时,控制台日志会返回上面的错误。该代码在最后几天运行良好,但突然出现此错误。

点赞帖子的Restapi代码:

if ($_GET['url'] == "likes") 
           {
                   $postId = $_GET['id'];
                   $token = $_COOKIE['SNID'];
                   $likerId = $db->query('SELECT  user_id FROM tokens WHERE token=:token', array(':token'=>sha1($token)))[0]['user_id'];
   
                   if (!$db->query('SELECT user_id FROM post_likes WHERE post_id=:postid AND user_id=:userid', array(':postid'=>$postId, ':userid'=>$likerId))) {
                           $db->query('UPDATE posts SET likes=likes+1 WHERE id=:postid', array(':postid'=>$postId));
                           $db->query('INSERT INTO post_likes VALUES (\'\', :postid, :userid)', array(':postid'=>$postId, ':userid'=>$likerId));
                           //Notify::createNotify("", $postId);
                   } else {
                           $db->query('UPDATE posts SET likes=likes-1 WHERE id=:postid', array(':postid'=>$postId));
                           $db->query('DELETE FROM post_likes WHERE post_id=:postid AND user_id=:userid', array(':postid'=>$postId, ':userid'=>$likerId));
                   }
                        
                    echo "{";
                    echo '"Likes":';
                    echo $db->query('SELECT likes FROM posts WHERE id=:postid', array(':postid'=>$postId));
                    echo "}";
           }

脚本设计:

$.ajax({

                        type: "GET",
                        url: "restapi/posts",
                        processData: false,
                        contentType: "application/json",
                        data: '',
                        success: function(r) {
                                var posts = JSON.parse(r)
                                $.each(posts, function(index) {
                                        $('.timelineposts').html(
                                                $('.timelineposts').html() + ' <li class="list-group-item" id="'+posts[index].postId+'" style="border-color: #cbcbcb;"><blockquote class="blockquote"><p class="mb-0" style="color: rgb(0,0,0);">'+posts[index].PostBody+'</p><footer class="blockquote-footer">Posted by '+posts[index].PostedBy+' on '+posts[index].PostDate+'</footer></blockquote><button data-id="'+posts[index].postId+'" class="btn btn-primary" type="button" style="background-color: rgba(0,0,0,0);color: rgb(0,0,0);width: 142px;font-family: Alegreya, serif;"  >&nbsp;<i class="icon-fire" data-bs-hover-animate="rubberBand" style="color: rgb(36,0,255);" ></i>&nbsp;'+posts[index].Likes+' likes</button><button class="btn btn-primary" type="button" style="background-color: rgba(0,0,0,0);color: rgb(0,0,0);width: 142px;font-family: Alegreya, serif;" onclick="showCommentsModal()" data-postid="'+posts[index].postid+'" >&nbsp;<i class="typcn typcn-pencil" data-bs-hover-animate="rubberBand" style="color: rgb(255,0,0);"></i>&nbsp;Comentários</button>  </li> </ul>  '
                                        )

                                        $('[data-postid]').click(function() {
                                                var buttonid = $(this).attr('data-postid');

                                                $.ajax({

                                                        type: "GET",
                                                        url: "restapi/comments?postid=" + $(this).attr('data-postid'),
                                                        processData: false,
                                                        contentType: "application/json",
                                                        data: '',
                                                        success: function(r) {
                                                                var res = JSON.parse(r)
                                                                showCommentsModal(res);
                                                        },
                                                        error: function(r) {
                                                                console.log(r)
                                                        }

                                                });
                                        });

                                        $('[data-id]').click(function() {
                                                var buttonid = $(this).attr('data-id');
                                                $.ajax({

                                                        type: "POST",
                                                        url: "restapi/likes?id=" + $(this).attr('data-id'),
                                                        processData: false,
                                                        contentType: "application/json",
                                                        data: '',
                                                        success: function(r) {

                                                                var ress = JSON.parse(r)
                                                                
                                                                $("[data-id='"+buttonid+"']").html(' <i class="icon-fire" data-bs-hover-animate="rubberBand" style="color: rgb(36,0,255);"></i>&nbsp; '+ress.likes+' likes</span>')
                                                        },
                                                        error: function(r) {
                                                                console.log(r)
                                                        }

                                                });
                                        })
                                })

                        },
                        error: function(r) {
                                console.log(r)
                        }

                });

        });

已经验证了所有查询,它们在 sql 中工作正常。

编辑::

在此处输入图像描述

标签: javascriptphprest

解决方案


尝试

echo"<pre>";print_r($_GET); exit();

看看你是否在后端得到任何数据

当您从后端发送数据时,请按以下格式进行

function listOfComments(){
 $response=[
  "success"=>0,
  "message"=>"",
  "data"=>[]
 ];

 //database queries

 if($databaseResponse){
   $response=[
    "success"=>1,
    "message"=>"",
    "data"=>$databaseResponse
   ];
 }else{
   $response["message"]=>"No Data"
 }
 return json.encode($response);
}

在javascript的前端你可以做

var ress = JSON.parse(r);
if(ress.success){
  // render UI
}else{
alert(ress.message);
}

如果您可以分享指向您的 git hub 存储库的链接,我愿意为您提供帮助。使用https://json2html.com/在前端渲染数据。在类上使用 onClick 事件,而不是自定义属性。


推荐阅读