上传文件返回的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 相关文章推荐
javascript据option的value值快速设定初始的selected选项
Aug 13 Javascript
jQuery 表格工具集
Apr 25 Javascript
JS this作用域以及GET传输值过长的问题解决方法
Aug 06 Javascript
浅析js绑定事件的常用方法
May 15 Javascript
jQuery插件HighCharts实现气泡图效果示例【附demo源码】
Mar 13 Javascript
总结js中的一些兼容性易错的问题
Dec 18 Javascript
简化版的vue-router实现思路详解
Oct 19 Javascript
如何使用JavaScript实现栈与队列
Jun 24 Javascript
vue全屏事件开发详解
Jun 17 Javascript
使用Angular9和TypeScript开发RPG游戏的方法
Mar 25 Javascript
小程序按钮避免多次调用接口和点击方案实现(不用showLoading)
Apr 15 Javascript
VUE+Element实现增删改查的示例源码
Nov 23 Vue.js
使用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
php metaphone()函数及php localeconv() 函数实例解析
2016/05/15 PHP
PHP数组Key强制类型转换实现原理解析
2020/09/01 PHP
让广告代码不再影响你的网页加载速度
2006/07/07 Javascript
fix-ie5.js扩展在IE5下不能使用的几个方法
2007/08/20 Javascript
Javascript日期对象的dateAdd与dateDiff方法
2008/11/18 Javascript
通过javascript设置css属性的代码
2009/12/28 Javascript
JQuery实现用户名无刷新验证的小例子
2013/03/22 Javascript
Jquery读取URL参数小例子
2013/08/30 Javascript
js实现带关闭按钮始终显示在网页最底部工具条的方法
2015/03/02 Javascript
JavaScript动态添加style节点的方法
2015/06/09 Javascript
JavaScript中的Array 对象(数组对象)
2016/06/02 Javascript
jQuery实现智能判断固定导航条或侧边栏的方法
2016/09/04 Javascript
JS判断来路是否是百度等搜索索引进行弹窗或自动跳转的实现代码
2016/10/09 Javascript
AngularJS解决ng界面长表达式(ui-set)的方法分析
2016/11/07 Javascript
JavaScript简单实现动态改变HTML内容的方法示例
2018/12/25 Javascript
vue 中几种传值方法(3种)
2019/11/12 Javascript
echarts实现获取datazoom的起始值(包括x轴和y轴)
2020/07/20 Javascript
js利用拖放实现添加删除
2020/08/27 Javascript
[02:01]2018完美盛典-开场舞《双子星》
2018/12/16 DOTA
[52:07]完美世界DOTA2联赛PWL S3 LBZS vs access 第二场 12.10
2020/12/13 DOTA
python使用matplotlib绘图时图例显示问题的解决
2017/04/27 Python
利用python 更新ssh 远程代码 操作远程服务器的实现代码
2018/02/08 Python
Python中作用域的深入讲解
2018/12/10 Python
django formset实现数据表的批量操作的示例代码
2019/12/06 Python
Python更新所有已安装包的操作
2020/02/13 Python
浅谈Python的方法解析顺序(MRO)
2020/03/05 Python
django的模型类管理器——数据库操作的封装详解
2020/04/01 Python
PyQt实现计数器的方法示例
2021/01/18 Python
分享一个H5原生form表单的checkbox特效代码
2018/02/26 HTML / CSS
销售实习自我鉴定
2013/12/07 职场文书
大学自我鉴定
2013/12/20 职场文书
挖掘机司机岗位职责
2014/02/12 职场文书
委托代理人授权委托书范本
2014/09/24 职场文书
延安红色之旅心得体会
2014/10/07 职场文书
成本会计岗位职责
2015/02/03 职场文书
如何利用python实现列表嵌套字典取值
2022/06/10 Python