一、bug场景

部分浏览器图片上传失败。本人参与的系统广告系统A,使用A系统上传图片时,需要调用到B系统的图片api。

二、原因分析

可能原因1 :图片服务器api问题(No)

当时第一反应是,可能是公司图片服务器api的问题,因为图片api部署在多台服务器上,如果图片上传的请求刚好到达"坏掉"的api服务器,图片上传将会失败。但是运营人员抓取了图片api的日志,没有发现错误信息。后来,我们通过查看日志,发现每次调用图片api,都是返回正常状态码200。

上传文件结果----------{"code":200,"msg":"success","result"}

到此,我们觉得可能不是图片api问题,必须找其他原因。

可能原因2: 图片上传的请求到达广告系统的service层后,抛异常(No)

 

通过查看日志,发现部分图片上传的请求压根就没到达广告系统的service层。理由是,在某个时间点,运营人员通过谷歌浏览器发送图片上传的请求,但是在这个时间点上,并没有相关日志。正常情况下,广告系统是有记录日志进行跟踪的。

可能原因3:图片上传的请求没进入到广告系统的web层,就报错了。(Yes)

 

通过公司的日志工具查看access log得知,ip为xxx.xxx.xxx.xxx发送的图片上传请求,服务器返回400的状态码,也即是说,请求无效。到此,我们分析了导致这个问题的几种原因。

1、参数类型转换问题(No)

@RequestMapping(value = "/sourceUpload", method = RequestMethod.POST)
@ResponseBody
public String sourceUpload(@RequestParam(value = "myfiles") MultipartFile fileField,@RequestParam(value = "httpsFlag") StringhttpsFlag) {}

这是图片上传的web层接口,httpsFlag这个字段是String类型的,但是jsp传过来的是数字类型的,如:0,1,2,这样spring mvc会不会转换出错。其实不会的,虽然jsp传过来的是数字类型的,但是其实是以"1","2"字符串的形式传过来的,spring mvc是可以接收到的。

2、httpsFlag参数压根就没传过来。(Yes)

后来,我在本地启动广告系统,使用测试同事的浏览器进行远程debug,发现使用她的电脑,文件上传的请求payload中,是没有包含httpsFlag字段的,只有myfiles的,如下:

payload:02版赠品02-700x500.jpg
------------Ij5cH2gL6ei4KM7KM7GI3gL6ei4cH2
Content-Disposition: form-data; name="myfiles"; filename="02版赠品02-700x500.jpg"
Content-Type: application/octet-stream

由于没有传过来httpsFlag这个参数,而spring mvc的接口又要求必须使用传入这个参数,最后导致请求到达spring mvc的拦截器后,由于匹配不到对应的action而抛出400的错误。现在的问题是,为何httpsFlag这个字段没有传递过来?

最后发现是因为开源上传组件swfupload的一个问题,如下:

this.setPostParams({'httpsFlag':$('#httpsFlag').val()
}); 

swfupload使用上面的代码进行参数传递,但是参数名字必须使用双引号括住,如果使用单引号,部分浏览器会出现问题。把代码改成如下形式即可。

this.setPostParams({"httpsFlag":$('#httpsFlag').val()
}); 

改完后,请求的payload中,终于出现了httpsFlag参数了。

payload:330868-14030420415958.jpg
------------ae0ei4GI3Ij5gL6KM7ae0gL6cH2cH2
Content-Disposition: form-data; name="httpsFlag"
0
------------ae0ei4GI3Ij5gL6KM7ae0gL6cH2cH2
Content-Disposition: form-data; name="myfiles"; filename="330868-14030420415958.jpg"
Content-Type: application/octet-stream

总结:

1、      多使用公司提供的日志工具,帮助定位问题;

2、      每个请求,都会经过多个环节,一个环节一个环节的排除

3、      使用spring mvc定义web层接口参数时,可以加入required = false这个配置,这样的话,即使参数没有传递进来,仍然可以进入到action接口,然后我们可以在action中抛出相关信息,这样问题比较好定位;

4、      部分浏览器上传失败的根本原因目前还不清楚,可能是浏览器配置问题或者pc问题;

swfupload组件图片上传失败问题分析与总结相关推荐

  1. 图片上传压缩android,android 图片上传压缩常见问题分析

    图片的上传与压缩是android经常需要用到的步骤,那么,如何解决上传图片oom问题呢?android 图片上传压缩常见问题分析,希望可以帮助大家更加的了解android 图片方面的困惑. 下面,是我 ...

  2. 究极方法!!!CSDN图片上传失败无法重新上传和删除的解决

    有一次CSDN上传文件的时候因为直接复制MD笔记,然后出现一堆图片上传失败 然后草稿就保存不了了 显示这个东西: 如需帮助,请点击,进去也没什么卵用-.- 陷入无法删除也无法重新上传的尴尬,太难了.. ...

  3. 【解决方案】PicGo图片上传失败问题【少走弯路】

    [解决方案]PicGo图片上传失败问题[少走弯路] 1.检查Server设置 选择PicGo设置,选择设置Server,确认设置监听端口为:36677 如果没有问题的话可以尝试关闭,退出APP,再开启 ...

  4. 图片上传失败了?憋慌,有可能不是Bug哦~

    常常有猿猿在创作的时候,会选择图文并茂的形式写成一篇文章.但是有时候会发现图片上传失败,憋慌,这很大可能不是Bug哦!可以先自行排查是否为以下原因: 0.网络状况不佳(如在不稳定的WiFi环境下,或网 ...

  5. 微信小程序之图片上传、多图上传、头像上传、头像获取、图片上传失败问题解决

    小程序用户授权获取用户头像,需点击才可以让用户选择是否授权. 图片上传失败问题解决 图片上传 一定要记得修改合法域名,不然会失败,而且找不到报错信息哟!并且域名采用 https 点击,用户授权,获取用 ...

  6. 富文本编辑器图片上传失败的BUG解决:IndexError:list index out of range

    富文本编辑器图片上传失败的BUG解决 问题原因 我们将通过Django上传的图片保存到了FastDFS中,而保存在FastDFS中的文件名没有后缀名(.png/.jpg/.jif),而ckeditor ...

  7. 解决picgo图片上传失败

    前言 昨天才刚搭建好的 typora+picGo+gitee的token 兴高采烈的写笔记,今天在typora中就图片上传失败了. 我的的解决办法就是更换picGo的图床,从gitee 更换为SM.M ...

  8. jeesite同一表单多fileupload图片上传失败,bizType保存失败

    项目场景: 提示:其中一个图片回显失败 jeesite统一表单提交多图片上传显示错误,bizType保存失败 问题描述 同一表单包含2个图片上传,数据库字段保存成功,其中一个预览图回显失败 原因分析: ...

  9. SpringBoot图片上传失败

    版权声明 本文原创作者:谷哥的小弟 作者博客地址:http://blog.csdn.net/lfdfhl 问题描述 项目执行图片上传时失败,图示如下: 在浏览器中发现了报错信息,图示如下: 错误原因 ...

最新文章

  1. struts2学习笔记(二):Struts2配置
  2. 对话框中加入标签页的5种方法
  3. [caffe]深度学习之图像分类模型VGG解读
  4. WNetAddConnection2 映射网络驱动器
  5. sh: react-scripts: command not found after running npm start
  6. mac mysql not found_mac下mysql提示command not found解决
  7. OpenVINO 部署 Mask-RCNN 实例分割
  8. 【jvm】jvm jstack使用 Java线程Dump分析
  9. java 修改源码_再谈给应用程序diy启动画面和java源代码补丁修改
  10. java_泛型方法使用实例
  11. bzoj 4537: [Hnoi2016]最小公倍数 分块+并查集
  12. Jquery 取色器
  13. 测试TCP和UDP端口的方法
  14. 如何反编译dll文件
  15. android手机向电脑传输文件,手机怎么用数据线连接电脑传输文件
  16. GRE 词汇1(前缀)
  17. ThunderSoft Video to GIF Converter(电脑视频转gif软件)官方正式版V3.3.0 | 轻松将视频转换成GIF图片
  18. 缩减50%调试成本  小匠物联推可远程的串口调试助手
  19. 《让大象飞》读书笔记
  20. Spring详细教程入门(一)

热门文章

  1. 亚马逊云科技Build On2022技能提升计划第二季——揭秘出海爆款新物种背后的黑科技
  2. Canvas实现球体碰撞交互效果(一)
  3. 分享一个 ChatGPT可免费使用的AI助手
  4. HTML5 使用canvas实现画板功能(画笔颜色切换、粗细调整、清除图像)
  5. ucloud算法岗面试
  6. CMU-15445 课程和实验介绍
  7. 24个笔画顺序表田字格_练字丨衡水体26个英文字母写法大揭秘,多拿10分卷面不费劲儿!...
  8. 族谱 php,关系树族谱echarts +php
  9. 免费主题装修wordpress网站(3步骤)
  10. 关于KISSY中的fire