上传文件返回的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 相关文章推荐
js中document.write使用过程中的一点疑问解答
Mar 20 Javascript
jQuery实现数字加减效果汇总
Dec 16 Javascript
javascript与css3动画结合使用小结
Mar 11 Javascript
基于JavaScript实现网页倒计时自动跳转代码
Dec 28 Javascript
JavaScript入门系列之知识点总结
Mar 24 Javascript
JavaScript中cookie工具函数封装的示例代码
Oct 11 Javascript
js仿手机页面文件下拉刷新效果
Oct 14 Javascript
在js中做数字字符串补0(js补零)
Mar 25 Javascript
详解JavaScript中的六种错误类型
Sep 21 Javascript
从源码看angular/material2 中 dialog模块的实现方法
Oct 18 Javascript
Vue.js watch监视属性知识点总结
Nov 11 Javascript
prettier自动格式化去换行的实现代码
Aug 25 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
PHP中使用TCPDF生成PDF文档实例
2014/07/01 PHP
windows下apache搭建php开发环境
2015/08/27 PHP
php app支付宝回调(异步通知)详解
2018/07/25 PHP
070823更新的一个[消息提示框]组件 兼容ie7
2007/08/29 Javascript
通过Jquery遍历Json的两种数据结构的实现代码
2011/01/19 Javascript
js自执行函数的几种不同写法的比较
2012/08/16 Javascript
jQuery在iframe中无法弹出对话框的解决方法
2014/01/12 Javascript
javascript自定义的addClass()方法
2014/05/28 Javascript
JavaScript模拟深蓝vs卡斯帕罗夫的国际象棋对局示例
2015/04/22 Javascript
Jquery实现瀑布流布局(备有详细注释)
2015/07/31 Javascript
js表单中选择框值的获取及表单的序列化
2015/12/17 Javascript
详解Vue2.0之去掉组件click事件的native修饰
2017/04/20 Javascript
bootstrap fileinput实现文件上传功能
2017/08/23 Javascript
JavaScript解决浮点数计算不准确问题的方法分析
2018/07/09 Javascript
解决vue attr取不到属性值的问题
2018/09/18 Javascript
Vee-validate 父组件获取子组件表单校验结果的实例代码
2019/05/20 Javascript
JavaScript学习教程之cookie与webstorage
2019/06/23 Javascript
vue学习笔记之slot插槽用法实例分析
2020/02/29 Javascript
python中的reduce内建函数使用方法指南
2014/08/31 Python
python3实现全角和半角字符转换的方法示例
2017/09/21 Python
Mac下Anaconda的安装和使用教程
2018/11/29 Python
python使用xlsxwriter实现有向无环图到Excel的转换
2018/12/12 Python
python selenium 执行完毕关闭chromedriver进程示例
2019/11/15 Python
python 图像判断,清晰度(明暗),彩色与黑白实例
2020/06/04 Python
解决pytorch 交叉熵损失输出为负数的问题
2020/07/07 Python
使用分层画布来优化HTML5渲染的教程
2015/05/08 HTML / CSS
浅析数据存储的三种方式 cookie sessionstorage localstorage 的异同
2020/06/04 HTML / CSS
酒店公关部经理岗位职责
2013/11/24 职场文书
主持词开场白
2014/03/17 职场文书
2014年教育教学工作总结
2014/11/13 职场文书
家长学校教学计划
2015/01/19 职场文书
文体活动总结
2015/02/04 职场文书
物业前台接待岗位职责
2015/04/03 职场文书
迎新生欢迎词2015
2015/07/16 职场文书
2016党员学习《反对自由主义》心得体会
2016/01/22 职场文书
《普罗米修斯》教学反思
2016/02/22 职场文书