ajax中回撥的幾個坑

monkeykg發表於2019-02-16

在前端開發中，經常要用ajax去拿後臺介面返回的資料，總結幾個ajax的回撥的常見問題，供大家參考爬坑。

  1. 未定義contentType，可能會造成的傳入後臺的資料亂碼，可以加上如下程式碼在ajax請求中 contentType:`application/json;charset=UTF-8`,
  2. 約定好傳到後臺以及後臺返回的資料型別，一般定義json型別。
    JSON.stringify():將一個JavaScript值(物件或者陣列)轉換為一個 JSON字串
    JSON.parse():將一個 JSON 字串轉換為物件

這兩個是常用的json轉換的api

  1. 在success或者error回撥中，return 是拿不到值的，即使改變了async:false也拿不到，看下面的例子：
function checkUserTask(taskid){
        $.ajax({
            method:`get`,
            url:URL.checkUserTask,
            async:false,
            data:{`id`:taskid},
            success:(response)=>{
                console.dir(response)
                if(response.code==200 ){
                    return true;
                }else{
                   return false;
                }
            }
        });
    }

這種寫法即使是成功或者失敗，在呼叫checkUserTask方法時都是返回的undefined,拿不到true或者false標識,所以一般寫法修改如下：

function checkUserTask(taskid){
        var flag = false;
      
        $.ajax({
            method:`get`,
            url:URL.checkUserTask,
            async:false,
            data:{`id`:taskid},
            success:(response)=>{
                if(response.code==200 ){
                    flag = true;
                }else{
                    flag = false;
                }
            }
        });
        return flag;
    }

在回撥的後面return 就可以拿到返回值。

相關文章