1. 程式人生 > >ajaxFileUpload上傳文件成功後卻無法解析服務器返回的json數據

ajaxFileUpload上傳文件成功後卻無法解析服務器返回的json數據

問題 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 == &quot;json&quot; ) {
eval( &quot;data = &quot; + 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數據