AjaxFileUpload SyntaxError: missing} nell'espressione XML

Question

Sto tentando di caricare un file utilizzando $ .ajaxFileUpload. Lo script del mio server restituisce un oggetto json es.

{ "imgName": "test.jpg", "imgurl": "/uploadtest/images/profile/sam.jpg"}

Quando controllo in Firefox che mostra la risposta corretta. JSON è anche ricevuto. Ma sto ricevendo un errore di avviso:

SyntaxError: missing } in XML expression 

Non ho potuto capire perché questo errore viene visualizzato. Anche in firebug l'oggetto Json è mostrato correttamente.

<script type='text/javascript' src='/js/ajaxfileupload.js'></script> 
<script type='text/javascript'> 
    function doFileUpload(){ 
     $("#loading") 
     .ajaxStart(function(){ 
      $(this).show(); 
     }) 
     .ajaxComplete(function(){ 
      $(this).hide(); 
     }); 
     $.ajaxFileUpload(
      { 
      url:'/json/image/upload.html?action=saveImage&nameSpace=tot', 
      secureuri:false, 
      fileElementId:'imgFile', 
      dataType: 'json', 
      success: function (data, status){ 
       alert("Success: "+data.imgUrl); 
       }, 
      error: function (data, status, e){ 
       alert("Error: "+e+"---URL: "+data.imgUrl); 
       } 
      } 
     ) 
    } 
</script> 

.... ....

<div> 
<strong>Upload Images:</strong><br> 
<input type='file' name='imgFile' id='imgFile'>&nbsp;&nbsp; 
<img src='/images/loading.gif' id='loading' height='60px' width='60px' style='display:none'> 
<br><button name='upload' id='upload' onclick='return doFileUpload();'>Upload</button> 
</div> 

Qualcuno mi può dire che cosa è la ragione per l'errore?

Answer 1

Ho finalmente trovato il problema. Il problema è con il plugin AjaxFileUpload di Jquery che sto usando. Invece di 'json' in dataType richiede che sia in maiuscolo. dataType: 'JSON'. Inoltre, dopo averlo corretto, aggiunge automaticamente > e </> all'inizio e alla fine dei dati JSON ricevuti. Quindi non è interpretato ad json.

dati effettivi che ho ricevuto era

<pre>{"imgName": "test.jpg", "imgUrl": "/uploadtest/images/profile/sam.jpg"}</pre> 

ora dovrò rimuovere lì tag e quindi analizzarlo con $ .parseJson(). Se qualcuno ha lo stesso errore, controlla questi problemi. Spero che il plugin ajaxFileUpload venga risolto a breve.

Answer 2

Ho trovato che con i dati di ritorno in Mozilla stavo avendo questo problema. In realtà il messaggio veniva restituito con <p>message</p> e questo stava dando un errore.

La correzione che ho applicato è stata quella di rimuovere tutto ciò che non è necessario nel messaggio di risposta e funziona. Ma non sono sicuro che sia una soluzione permanente. Alla fine del file di script ajaxfileupload.js ho modificato la funzione uploadHttData

uploadHttpData: function(r, type) { 
    var data = !type; 
    var dataparsed = r.responseText.split("{"); //added by Jude 
    dataparsed = dataparsed[1].split("}"); //added by Jude 
    ///Commented By Jude 
    ///data = type == "xml" || data ? r.responseXML : r.responseText; 
    // If the type is "script", eval it in global context 
    data = type == "xml" || "{ " + dataparsed[0] + " }"; //added by Jude 
    if (type == "script") 
     jQuery.globalEval(data); 
    // Get the JavaScript object, if JSON is used. 
    if (type == "json") { 
     eval("data = " + data); 
    } 
    // evaluate scripts within html 
    if (type == "html") 
     jQuery("<div>").html(data).evalScripts(); 
        //alert($('param', data).each(function(){alert($(this).attr('value'));})); 
    return data; 
} 

Answer 3

Per risolvere il problema assicurarsi di impostare il Content-Type di si risponde a "text/html".

Quello sguardo strano :-)

La ragione è che la risposta viene elaborato da Firefox per costruire un documento. Quando il tipo di contenuto della risposta è "text/plain" Firefox, che visualizza solo html, converti la risposta in html aggiungendo i tag.

Answer 4

La risposta di Jude Adeline era corretta se stavi cercando di restituire una risposta json monodimensionale. Se stai cercando di restituire un array multidimensionale da PHP, modifica il tuo codice in questo sotto.

uploadHttpData: function(r, type) { 
    var data = !type; 
    var dataparsed = r.responseText.substr(1); //changed-added 

    dataparsedLength = dataparsed.length; //changed-added 
    dataparsed = dataparsed.substr(0, dataparsedLength-1); //changed-added 

    data = type == "xml" || "{ " + dataparsed + " }"; //changed-added 
    // If the type is "script", eval it in global context 
    if (type == "script") 
     jQuery.globalEval(data); 

    // Get the JavaScript object, if JSON is used. 
    if (type == "json") 
     eval("data = " + data); 

    // evaluate scripts within html 
    if (type == "html") 
     jQuery("<div>").html(data).evalScripts(); 

    return data; 
} 

Answer 5

io sono stato anche se questo problema - u bisogno di cambiare una sola linea if ((tipo == "json") || (tipo == "JSON")) funziona allora bene sia in Firefox e IE

Answer 6

ho avuto un errore come questo

ho usato:

$Ex=end(explot('.', image)); 

in doajaxfileupload.php, che ha dato l'errore:

"AjaxFileUpload SyntaxError: missing } in XML expression"

ho cambiato in:

$tmp=explot('.', image); 
$Ex=end($tmp); 

Ha funzionato per me

Il PHP documentation dà questo esempio:

mixed end (array &$array); 
$fruits = array('apple', 'banana', 'cranberry'); 
echo end($fruits); // cranberry 

Answer 7

ho fissato questo,

Basta aggiornare il riga di codice:

xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null; 

Con questa:

xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.textContent:null; 

L'innerHTML è la causa del problema.

Answer 8

riformattare il pre dalla risposta è possibile utilizzare espressioni regolari (di credito: https://github.com/carlcarl/AjaxFileUpload)

if (type == "json") 
    { 
     // If you add mimetype in your response, 
     // you have to delete the '<pre></pre>' tag. 
     // The pre tag in Chrome has attribute, so have to use regex to remove 
     var data = r.responseText; 
     var rx = new RegExp("<pre.*?>(.*?)</pre>","i"); 
     var am = rx.exec(data); 
     //this is the desired data extracted 
     var data = (am) ? am[1] : ""; //the only submatch or empty 
     eval("data = " + data); 
    } 

ho trovato la soluzione al problema JSON cercando GitHub per ajaxfileupload, e ha trovato questa versione che ha funzionato correttamente per me una volta ho capitalizzato JSON