上传文件返回的json数据会被提示下载问题解决方案


Posted in Javascript onDecember 03, 2014

最近项目中出现上传文件返回的json数据会被提示下载,只有在ie10+中才会出现这个问题。前端使用jQuery的插件ajaxForm提交表单,后台返回的数据格式为json。代码如下:

 后端Python:

def jsonp(func):

    """Wraps JSONified output for JSONP requests."""

    @wraps(func)

    def decorated_function(*args, **kwargs):

        callback = request.args.get('callback', False)

        temp_content =  func(*args, **kwargs)

        if isinstance(temp_content, dict):

            temp_content.setdefault('success', True)

            temp_content.setdefault('code', 200)

            try:

                temp_content = json.dumps(temp_content, indent=4)

            except UnicodeDecodeError:

                try:

                  temp_content = ujson.dumps(temp_content)

                except StandardError as e:

                  logger.exception(e)

                  temp_content = json.dumps({'success': False, 'code': 500, 'info': 'INVALID_CONTENT'})

            temp_content = cgi.escape(temp_content)

            if callback:

                # 依据 http://evilcos.me/?p=425,jsonp添加/**/头部会安全一些

                content = '/**/' + str(callback) + '(' + temp_content + ')'

                mimetype = 'application/javascript'

                headers = {'charset':'utf-8'}

                return current_app.response_class(content, mimetype=mimetype,headers=headers)

            else:

                mimetype = 'application/json'

                headers = {'charset':'utf-8'}

                content = temp_content

                return current_app.response_class(content, mimetype=mimetype,headers=headers)

        elif isinstance(temp_content, basestring):

            temp_content = cgi.escape(temp_content)

            return temp_content

        else:

            return temp_content

    return decorated_function

@mod.route('/patch/install.json', methods=['POST'])

@jsonp

def patch_install():

    return {'data': 'data'}

前端js代码:

$('#form').ajaxSubmit({

    url      : '/patch/install.json',

    type     : 'post',

    dataType : 'json',

    iframe   : true,

    success: function(res) {

        // code

    }

});

解决办法:

需要将后端返回的数据格式改成text/html格式的,如下:

def plain(func):

    """wrap text/html reponse"""

    @wraps(func)

    def _inner(*args, **kwargs):

        resp = func(*args, **kwargs)

        if isinstance(resp, dict):

            resp.setdefault('success', True)

            resp.setdefault('code', 200)

            resp = json.dumps(resp)

            resp = cgi.escape(resp)

            return current_app.response_class(resp, mimetype='text/html', headers={'charset': 'utf-8'})

        elif isinstance(resp, basestring):

            resp = cgi.escape(resp)

            return current_app.response_class(resp, mimetype='text/html', headers={'charset': 'utf-8'})

        else:

            return resp

    return _inner

@mod.route('/patch/install.json', methods=['POST'])

@plain

def patch_install():

    return {'data': 'data'}

注意:此例后端是用Python,如果项目中遇到同样问题,改成对应语言

总结,其实解决这个问题,简单的说就一句话“将后端返回的数据格式改成text/html格式的”

Javascript 相关文章推荐
prototype class详解
Sep 07 Javascript
JavaScript 判断判断某个对象是Object还是一个Array
Jan 28 Javascript
jQuery源码分析-05异步队列 Deferred 使用介绍
Nov 14 Javascript
通过javascript把图片转化为字符画
Oct 24 Javascript
JS+CSS实现Div弹出窗口同时背景变暗的方法
Mar 04 Javascript
jQuery超简单选项卡完整实例
Sep 26 Javascript
JavaScript重载函数实例剖析
May 13 Javascript
将JSON字符串转换成Map对象的方法
Nov 30 Javascript
Vue.js鼠标悬浮更换图片功能
May 17 Javascript
JS使用ActiveXObject实现用户提交表单时屏蔽敏感词功能
Jun 20 Javascript
详解js删除数组中的指定元素
Oct 31 Javascript
ES6基础之默认参数值
Feb 21 Javascript
使用jQuery实现验证上传图片的格式与大小
Dec 03 #Javascript
使用正则表达式的格式化与高亮显示json字符串
Dec 03 #Javascript
jquery中获取元素里某一特定子元素的代码
Dec 02 #Javascript
JS逆序遍历实现代码
Dec 02 #Javascript
javascript框架设计读书笔记之数组的扩展与修复
Dec 02 #Javascript
javascript框架设计读书笔记之字符串的扩展和修复
Dec 02 #Javascript
javascript框架设计读书笔记之模块加载系统
Dec 02 #Javascript
You might like
探讨:使用XMLSerialize 序列化与反序列化
2013/06/08 PHP
PHP父类调用子类方法的代码例子
2014/04/09 PHP
PHP的MVC模式实现原理分析(一相简单的MVC框架范例)
2014/04/29 PHP
ThinkPHP使用心得分享-分页类Page的用法
2014/05/15 PHP
thinkPHP框架对接支付宝即时到账接口回调操作示例
2016/11/14 PHP
基于jquery的web页面日期格式化插件
2011/11/15 Javascript
jquery判断浏览器类型的代码
2012/11/05 Javascript
JavaScript自定义事件介绍
2013/08/29 Javascript
javascript 中__proto__和prototype详解
2014/11/25 Javascript
javascript面向对象之对象的深入理解
2015/01/13 Javascript
有关jquery与DOM节点操作方法和属性记录
2016/04/15 Javascript
浅析jQuery 遍历函数,javascript中的each遍历
2016/05/25 Javascript
jquery实现数字输入框
2017/02/22 Javascript
js中的事件委托或是事件代理使用详解
2017/06/23 Javascript
vue.js组件vue-waterfall-easy实现瀑布流效果
2017/08/22 Javascript
js 发布订阅模式的实例讲解
2017/09/10 Javascript
jQuery实现下拉菜单动态添加数据点击滑出收起其他功能
2018/06/14 jQuery
Vue+Element实现表格编辑、删除、以及新增行的最优方法
2019/05/28 Javascript
七行JSON代码把你的网站变成移动应用过程详解
2019/07/09 Javascript
layui关闭层级、简单监听的实例
2019/09/06 Javascript
基于JS实现简单滑块拼图游戏
2019/10/12 Javascript
解决vue 退出动画无效的问题
2020/08/09 Javascript
Python2.x版本中基本的中文编码问题解决
2015/10/12 Python
python编码最佳实践之总结
2016/02/14 Python
python django使用haystack:全文检索的框架(实例讲解)
2017/09/27 Python
PyCharm在win10的64位系统安装实例
2017/11/26 Python
Python内置模块logging用法实例分析
2018/02/12 Python
Python面向对象程序设计类变量与成员变量、类方法与成员方法用法分析
2019/04/12 Python
Python Pandas 箱线图的实现
2019/07/23 Python
django数据关系一对多、多对多模型、自关联的建立
2019/07/24 Python
python 实现视频 图像帧提取
2019/12/10 Python
心理健康教育制度
2014/01/27 职场文书
图书馆标语
2014/06/19 职场文书
实习生矿工检讨书
2014/10/13 职场文书
兵马俑导游词
2015/02/02 职场文书
情况说明书怎么写
2015/10/08 职场文书