後端圖片上傳成功,但是ajax 返回走error readyState=4 status=200;

前端js代碼:

if ($("#file").val() == '') {
                return;
        }
        var formData = new FormData($("#uploadForm")[0])
        console.log(formData)
        formData.append('photo', $('#upload')[0].files[0]);
     $.ajax({
             url:xyt+'upload.php?method=addImg',
             type: "post",
             data: formData,
             cache: false,
             dataType:'json',
             contentType: false,
             processData: false,
             success: function(data){
                console.log(data);
                if (data.status === 3) {
                    localStorage.setItem('toux_img',data.url)
                    console.log(data.url)
                } else if (data.status === 4) {
                    alert('上傳失敗網絡錯誤,請重新上傳');
                } else if (data.status === 6) {
                    alert('上傳方式錯誤');
                } else if (data.status === 1) {
                    alert('格式錯誤')
                } else if (data.status === 2) {
                    alert('圖片過大')
                }
            },
            error:function(response){
                    console.log(response);
            }
     });

返回值:

{"readyState":4,"responseText":"adsfasdf","status":200,"statusText":"parsererror"}

很奇怪對不對,status=200表明遠端處理是成功的,問題出在前端解析上了。dataType的可設置範圍如下:

"xml": 返回 XML 文檔,可用 jQuery 處理。
"html": 返回純文本 HTML 信息;包含的 script 標籤會在插入 dom 時執行。
"script": 返回純文本 JavaScript 代碼。不會自動緩存結果。除非設置了 "cache" 參數。注意:在遠程請求時(不在同一個域下),所有 POST 請求都將轉爲 GET 請求。(因爲將使用 DOM 的 script標籤來加載)
"json": 返回 JSON 數據 。
"jsonp": JSONP 格式。使用 JSONP 形式調用函數時,如 "myurl?callback=?" jQuery 將自動替換 ? 爲正確的函數名,以執行回調函數。
"text": 返回純文本字符串
 

說明:

後端返回實際是做了json處理的,dataType 類型不論是修改爲 json\text 還是默認不寫,都無法正常返回,最終在js裏面將返回的內容又轉了一次json  ,問題解決

補充:js中將字符串轉化成json對象的常見三種方法:


var data='[{"name":"xiao","age":12},{"name":"xiao","age":12}]';
//方式一
var json1 = JSON.parse(data);
dy(":"+json1[0].name);
//方式二
var json2 = eval("(" + data+ ")");
dy(json2[0].name);
//方式三
var json3 = (new Function("return " + data))();

 


 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章