ajaxFileUpload上傳文件成功後卻無法解析服務器返回的json數據
阿新 • • 發佈:2017-07-29
問題 div 文件 服務器 blog word-wrap ext 前臺 ces
- ajaxFileUpload是一款很好用的文件上傳插件,網上也有很多關於它的版本,但在上傳文件成功後想返回json數據給前臺時,卻會出現無法解析json數據的情況。
仔細調試發現其實在向服務器提交數據後,是進入了success回調函數的,只是沒有解析到json數據。那就說明服務器做出了響應的,進入了success方法的,唯一的問題就是前臺接受的數據不是json格式的。
使用console.log輸出data發現並不是純粹的json數據,其中頭部多了<pre style="word-wrap: break-word; white-space: pre-wrap;">{"JsonKey":"JsonValue"}</pre>
找到問題就很好處理了,雖然設置了data-type參數是json類型的,但依然出現了這個bug,再看一下源碼就豁然開朗了
=====這裏是源碼的內容==========
if ( type == "json" ) {
eval( "data = " + data);
}
=======================================
原來返回的json數據是通過eval生成的,意思是接受的數據一直是text類型的,只是根據data-type的參數再轉化,這是因為ajaxFileUpload是通過創建iframe層異步來上傳文件的
根據這個原理可以有2種解決辦法
1:在前臺將<pre style="word-wrap: break-word; white-space: pre-wrap;">{"JsonKey":"JsonValue"}</pre>過濾,這樣就是幹凈的json數據
var reg = /<pre.+?>(.+)<\/pre>/g; var result = data.match(reg); data = RegExp.$1;
2:將源碼裏的eval裏的參數直接過濾
if ( type == "json" ){
data = jQuery.parseJSON(jQuery(data).text());
}
再或者讓服務器返回text類型的data再轉化成json數據
ajaxFileUpload上傳文件成功後卻無法解析服務器返回的json數據