jQuery ajax一直调用error方法,问题解决

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/springsunss/article/details/70276046

首先说原因,然后再说具体情况:
原因一:返回的json格式不对。
原因二:在返回数据之前不能有任何的输出,包括打开调试。例如:后端用的是php,像在返回json数据之前,echo,var_dump等输出是不能有的,debug也要关闭。

* 问题描述

实现功能:点赞功能
问题:在页面点赞,并执行了后端的代码,但是前端一直调用error方法
下面贴出代码来说明该问题
前端代码:

$("#like").on("click",function(){
    var like_status = $("#like-status").html();
    var like_number = parseInt($("#like-num").html());

    $.ajax({
        url:"../usercenter/clickLike",
        type:"POST",
        data:        {"like_status":like_status,"like_cnt":like_number,"vid":video_id,"uid":user_id},
        dataType:"json",
        success:function(data){
        alert(data.error_code)
            if(data.error_code == 0){
                if(like_status == 0){ 
                    var num = Math.floor(Math.random() * 3 + 1);
                    var index=$('.like').children('img').length;
                    var rand = 20;

                    $(".like").append("<img class='img-like1' src=''>");
                    $(".like").append("<img class='img-like2' src=''>");
                    $('.img-like1:eq(' + index + ')').attr('src','http://videostyle.qyer.ad/img/ic_feed_like_sel.png');
                    $('.img-like2:eq(' + index + ')').attr('src','http://videostyle.qyer.ad/img/ic_feed_like_sel.png');
                    $(".img-like1").animate({
                        bottom:"300px",
                        opacity:"0",
                        left: rand
                        },2000);
                       $(".img-like2").animate({
                        bottom:"400px",
                        opacity:"0",
                        left: rand
                        },2000);
                        $("#like").removeClass("like-no");
                        $("#like").addClass("like-yes");
                        $("#like-status").html(1);
                        $("#like-num").html(like_number+1);
                        }else{
                            $("#like").removeClass("like-yes");
                            $("#like").addClass("like-no");
                            $("#like-status").html(0);
                            $("#like-num").html(like_number-1);
                            $(".img-like1").remove();
                            $(".img-like2").remove();
                        }
                    }else{
                         alert(data.error_code);  
                    }
                },
                error:function(data){
                    alert("错误");
                }
            });
        }).on("touchstart", function(event) {
            event.stopPropagation(); 
        });

php端代码:

/**
 * 用户点击喜欢,取消喜欢
 */
    public function clickLikeAction(){
        $uid = getRequestInt("uid");
        if(!$uid){
            json_error(1,"请先登录");
        }

        $vid = getRequestInt("vid");
        $like_status = getRequestInt("like_status");
        $like_cnt = getRequestInt("like_cnt");
        if(!$vid){
            json_error(1,"vid未得到");
        }

        if(!$like_status ){//用户没有喜欢过才为其添加喜欢,并令喜欢量加1
            Table_Video_Vlike::inst()->addUserLike($uid,$vid);
            Table_Video_Statistics::inst()->increaseLikeCnt($vid,$like_cnt);
            json_success();

        }

        //取消喜欢,并令喜欢量减1
        Table_Video_Vlike::inst()->deleteUserLike($uid,$vid);
        $res = Table_Video_Statistics::inst()->decreaseLikeCnt($vid,$like_cnt);
        if(!$res){
            json_error();
        }
        json_success();
    }

其中json_success() ,json_error()是两个封装好的返回给前端的json格式的字符串,但是在执行“点击喜欢”的时候,没有任何问题,当点击“取消喜欢”的时候,数据库的数据已修改,但是ajax一直调用error方法

* 问题解决

网上资料说是json数据格式不对,但是调用的是同一个函数,怎么会json格式不对呢,面对上面的问题觉得很奇怪,后来发现我在decreaseLikeCnt() 这个方法中使用了 echo, 把这个注释掉问题就解决了。另外一种情况,我开启了数据库调试模式,也会出现ajax一直调用error方法。为什么注释掉就解决问题了呢?
原因分析: 前后端定义了数据的交互方式,前端默认后端返回的数据格式是一个json而且格式也是规定好的,现在在后端返回给前端数据时,echo或debug等都会导致前端接受不到定义好的json串,从而导致错误。

猜你喜欢

转载自blog.csdn.net/springsunss/article/details/70276046