AjaxFileUpload SyntaxError:XML 表达式中缺少

Posted

技术标签:

【中文标题】AjaxFileUpload SyntaxError:XML 表达式中缺少【英文标题】:AjaxFileUpload SyntaxError: missing in XML expression 【发布时间】:2010-10-15 05:37:16 【问题描述】:

我正在尝试使用 $.ajaxFileUpload 上传文件。我的服务器脚本正在返回一个 json 对象,例如。

"imgName": "test.jpg", "imgUrl": "/uploadtest/images/profile/sam.jpg"

当我签入 Firefox 时,它会显示正确的响应。 Json 也被接收。但我仍然收到警报错误:

SyntaxError: missing  in XML expression

我不明白为什么会出现这个错误。 在 firebug Json 对象中也正确显示。

<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>

谁能告诉我错误的原因是什么?

【问题讨论】:

【参考方案1】:

我终于找到了问题所在。问题在于我正在使用的 Jquery 的 AjaxFileUpload 插件。而不是 dataType 中的“json”,它要求将其大写。数据类型:'JSON'。同样在修复此问题后,它会自动将

添加到接收到的 json 数据的开头和结尾。所以它不会被解释为广告 json。

我收到的实际数据是

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

现在我必须删除那里的标签,然后用 $.parseJson() 解析它。 如果有人有同样的错误,请检查这些问题。 我希望 ajaxFileUpload 插件能尽快修复。

【讨论】:

【参考方案2】:

我发现在 Mozilla 的返回数据中我遇到了这个问题。实际上,该消息是用&lt;p&gt;message&lt;/p&gt; 返回的,这是一个错误。

我应用的修复是删除返回消息中不需要的任何内容,并且它正在工作。但我不确定它是否是永久修复。在 ajaxfileupload.js 脚本文件的最后我修改了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;

【讨论】:

在 Safari 和 Chrome 上,json 数据返回将被包裹在
 中。还需要对数据进行圣化。谢谢你解决裘德。
【参考方案3】:

我已经解决了这个问题,

只需更新代码行:

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

有了这个:

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

innerHTML 导致了问题。

【讨论】:

【参考方案4】:

要重新格式化响应中的 pre,您可以使用 regex(credit: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 );
    

我通过在 github 上搜索 ajaxfileupload 找到了 json 问题的解决方案,并发现这个版本在我将 JSON 大写后对我来说可以正常工作

【讨论】:

对我有用的是使用 Jquery eval("data = " + $(data).text()); (在最后一行)***.com/questions/1499889/…【参考方案5】:

如果您希望返回单维 json 响应,Jude Adeline 的回答是正确的。如果您希望从 php 中返回一个多维数组,请将您的代码修改为下面的代码。

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;

【讨论】:

【参考方案6】:

我遇到过这个问题 - 你只需要更改一行 if ((type == "json") || (type == "JSON")) then 在 FireFox 和 IE 中都能正常工作

【讨论】:

【参考方案7】:

我遇到了这样的错误

我用过:

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

在doajaxfileupload.php中,报错:

“AjaxFileUpload SyntaxError:XML 表达式中缺少 ”

我改成:

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

它对我有用

PHP documentation 给出了这个例子:

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

【讨论】:

【参考方案8】:

要解决问题,请确保将答案的 Content-Type 设置为“text/html”。

这看起来确实很奇怪:-)

原因是 Firefox 会处理答案以构建文档。 当答案的 Content-Type 是 "text/plain" Firefox 时,只显示 html,通过添加标签将答案转换为 html。

【讨论】:

以上是关于AjaxFileUpload SyntaxError:XML 表达式中缺少的主要内容,如果未能解决你的问题,请参考以下文章

jQuery插件之ajaxFileUpload

ajaxfileupload

ajaxfileupload 跨域 (二级域名) 可行办法

jQuery插件之ajaxFileUpload

Jquery+ajaxfileupload上传文件

jQuery插件ajaxfileupload.js源码与使用