`
emeifeng
  • 浏览: 7603 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

使用jQuery ajax文件上传ajaxfileupload组建碰到的问题:返回json带有pre标记的解决方案

阅读更多

开发货比百家购物搜索的后台,增加文件异步上传的功能,前端使用的js组建是jquery,曾经使用过ajaxfileupload,直接使用,碰到了个问题:

返回jason格式的数据报了错。于是,firebug下跟踪下,结果如下:


结果是正常的。

检查下spring servlet的配置,也没有错。
    <bean
        class="org.springframework.web.servlet.view.ContentNegotiatingViewResolver">
        <property name="defaultContentType" value="application/json" />
        <property name="mediaTypes">
            <map>
                <entry key="json" value="application/json" />
                <entry key="html" value="text/html" />
            </map>
        </property>
        <property name="viewResolvers">
            <list>
                <bean class="org.springframework.web.servlet.view.BeanNameViewResolver" />
                <bean
                    class="org.springframework.web.servlet.view.InternalResourceViewResolver">
                    <property name="viewClass"
                        value="org.springframework.web.servlet.view.JstlView" />
                    <property name="prefix" value="/jsp/" />
                    <property name="suffix" value=".jsp" />
                </bean>
            </list>
        </property>
        <property name="defaultViews">
            <list>
                <!-- 输出为JSON数据 -->
                <bean
                    class="org.springframework.web.servlet.view.json.MappingJacksonJsonView">
                </bean>
            </list>
        </property>
    </bean>

接着分析下ajaxfileupload源代码,ajaxfileupload 是创建了个iframe,来实现异步上传文件,firebug看下iframe的内容,发现莫名其妙的加上了<pre>,难怪导致解析json数据发生错误。

 

继续看源代码,最下面发现:

if ( type == "json" )
            eval( "data = " + data );

改成:

        if ( type == "json" ){
            data = jQuery.parseJSON(jQuery(data).text());
        }

OK,如此问题就解决了。

比较购物网站 :http://www.huobibaijia.com/ 。研究比较购物技术,感兴趣的朋友QQ联系。

QQ:909546261

 

 本文为原创,雷同者均为抄袭,可以转载作为学习研究或备份所用,本人保留一切权利,转载请注明出处。

原文:http://emeifeng.iteye.com/blog/1307506

  • 大小: 15.1 KB
分享到:
评论

相关推荐

    ajaxFileUpload插件,C#返回Json数据报错问题的解决方案

    在使用ajaxFileUpload插件进行文件上传,尤其是图片上传时,可能会遇到与C#后端交互返回Json数据时出现的错误。本篇文章将详细解析两种常见的错误及其解决方案。 首先,错误信息一:“jQuery.handleError is not a ...

    ajaxFileUpload修改版(增加了注释 增加了多文件上传)

    ajaxFileUpload修改版 1.增加了对多文件上传的处理 2.修复了jQuery.handleError is not a function错误 3.修复了回传json数据失败的问题(回传的json数据多加了&lt;pre&gt; &lt;/pre&gt;标记) 4.增加了注释便于理解

    ajaxFileupload.js

    可上传参数;支持jquery1.4.2前后;解决返回json带&lt;pre&gt;问题

    js ajaxfileupload.js上传报错的解决方法

    在JavaScript的前端开发中,文件上传是一个常见的任务,而`ajaxFileUpload.js`是一个常用的库,用于通过Ajax方式实现文件的异步上传。这个库基于jQuery,提供了方便的API来处理文件上传。然而,在实际使用过程中,...

    ajaxfileupload.js

    添加了handleError,防止因为jquery版本问题报错; uploadHttpData中类型为json时对data进行了处理,去除了返回数据中的&lt;pre&gt;标签 建议后台返回text/html格式的Response;防止在ie下不能识别application/json类型造成的...

    springMVC使用ajaxFailUpload上传图片的方法

    jQuery是用于简化JavaScript操作的库,而Ajax File Upload则是用于处理文件上传的插件。 ```html &lt;script type="text/javascript" src="resources/js/jquery-3.3.1.min.js"&gt; ...

Global site tag (gtag.js) - Google Analytics