1.    方向1 用户提交表单, 图片和表单同步上传.(由同一服务器处理, 服务器压力大. 没有分离)

2.    方向2 图片和表单分开上传. 如图片访问ftp,表单提交后台(图片和后台分离)
2.1  图片立刻上传, 再提交表单. 
图片每次上传的操作就立刻上传到服务器. 然后将返回的url地址和表单一起提交.

存在问题:图片循环上传甚至不提交表单
(1) 垃圾图片太多
思路1 上传到临时目录, 表单上传成功后移动. 
思路2 通过约定的名字,每次上传前都知道规定的名字. 图片上传自动覆盖之前的图片. 
思路3 通过图片上传后通过redis等写入自己的表单操作id和图片. 只有表单成功请求后, 操作id对应通知redis/db. 通过每天定时的job删除没有对应操作id确认地址的图片(即没有表单对应的图片).
(2) 频繁上传.
通过需要限流解决. 比如代码或者图片服务器.

2.2 用户提交时,提交表单. 图片异步或者同步上传.
(1)用户提交表单时, 触发表单和图片上传分2个操作处理. 用户等待2个处理都成功才返回成功通知. 本质上和1的方法1很类似. 用户提交才处理. 区别是用户提交后是调用一次request处理表单和图片的同时上传. 还是调用多次不同的请求.
调用一次可保证没有垃圾图片, 简单. 回到方法1.
调用多次就存在部分失败的问题,  表单先提交->上传图片->更新表单.
这种表单先提交可以延伸为类似手机提交到本地, 或者web的状态控制. 然后补图片.

(2)用户提交表单, 触发表单和图片上传分2个操作处理. 
表单提交完毕. 操作结束. 图片后台上传(小程序/APP的场景较多)
表单提交完毕. 图片前台模态上传成功/失败 操作才结束

综上可以拆分为
方向1 图片上传实时发生. 表单提交另外发生.
方向2 用户提交时, 才进行图片和表单的提交. 此时将图片和表单作为同个操作事务单元. (如图片base64作为表单的一部分提交)
方向3 用户提交时, 才进行图片和表单的提交. 图片和表单是不同的操作事务单元.
此方案本质和方向1相同. 需要处理垃圾图片, 频繁上传的问题.

方向3的实现思路, 无论图片是前台显示提交(如loading窗口)还是后台上传, 区别只是用户提交后窗口在表单提交还是表单+图片都提交成功后才关闭)
都要处理图片和表单关联的问题. 关联可通过约定图片名字等方式实现.
图片和表单的关联可通过通过表单id或者有一个当前操作的事务id来确定.
比如将该id作为图片名字的一部分.
通过表单id或者事务操作id可保证通过对应表单id来触发告知用户图片上传的成功/失败. 可通过表单关联寻址到图片.
如果只使用事务id, 即可能出现没有表单 只上传图片的情况. 
这也可通过定期将redis或者临时目录的文件和db中的表单对应. 如无对应则进行删除.

建议合理方案为图片名字加密后含对应表单id方式, 表单需要先保存. 如只使用事务id, 则需要定期清理.









puzz: 图片和表单上传的不一致问题的更多相关文章

  1. java模拟表单上传文件,java通过模拟post方式提交表单实现图片上传功能实例

    java模拟表单上传文件,java通过模拟post方式提交表单实现图片上传功能实例HttpClient 测试类,提供get post方法实例 package com.zdz.httpclient; i ...

  2. 相册选择头像或者拍照 上传头像以NSData 图片二进制格式 表单上传

    一.点击头像图片 或者按钮 在相册选择照片返回img,网络上传头像要用data表单上传 (1)上传头像属性 // 图片二进制格式 表单上传 @property (nonatomic, strong) ...

  3. [转]html5表单上传控件Files API

    表单上传控件:<input type="file" />(IE9及以下不支持下面这些功能,其它浏览器最新版本均已支持.) 1.允许上传文件数量 允许选择多个文件:< ...

  4. PHP流式上传和表单上传(美图秀秀)

    最近需要开发一个头像上传的功能,找了很多都需要授权的,后来找到了美图秀秀,功能非常好用. <?php /** * Note:for octet-stream upload * 这个是流式上传PH ...

  5. 一般处理程序上传文件(html表单上传、aspx页面上传)

    html 表单上传文件        一般处理程序由于没有 apsx 页面的整个模型和控件的创建周期,而比较有效率.这里写一个用 html 表单进行文件上传的示例.        1. 表单元素选用 ...

  6. 文件的上传(表单上传和ajax文件异步上传)

    项目中用户上传总是少不了的,下面就主要的列举一下表单上传和ajax上传!注意: context.Request.Files不适合对大文件进行操作,下面列举的主要对于小文件上传的处理! 资源下载: 一. ...

  7. 普通文件的上传(表单上传和ajax文件异步上传)

    一.表单上传: html客户端部分: <form action="upload.ashx" method="post" enctype="mul ...

  8. Express下使用formidable实现POST表单上传文件并保存

    Express下使用formidable实现POST表单上传文件并保存 在上一篇文章中使用formidable实现了上传文件,但没将它保存下来. 一开始,我也以为是只得到了文件的相关信息,需要用fs. ...

  9. 文件的上传(1)(表单上传和ajax文件异步上传)

    文件的上传(表单上传和ajax文件异步上传) 项目中用户上传总是少不了的,下面就主要的列举一下表单上传和ajax上传!注意: context.Request.Files不适合对大文件进行操作,下面列举 ...

随机推荐

  1. MyBatis通过Mapper动态代理来实现curd操作

    MyBatis官方推荐使用mapper代理方法开发mapper接口,程序员不需要编写mapper实现类,使用mapper代理方法时,输入参数可以使用pojo包装对象或者map对象,保证dao的通用性 ...

  2. 万维网(WWW)

    简介:万维网(WWW)是 Internet上最为普及的一种应用服务,它是由成千上万万维网站点(简称网站)组成的一个联机信息存储系统. 万维网的工作模式采用客户机/服务器方式,在用户计算机上运行浏览器作 ...

  3. centos7.4 调整根目录大小

    由于系统初始时根目录一般空间为50左右 有时会被占满,而/home目录却有大量空间 这里需要调整: 1.终止占用 /home 进程 fuser -m -v -i -k /home​ 2.备份/home ...

  4. Laravel写讯搜的ini配置文件的一处陷阱

    讯搜客户端在连接服务端之前需要读取配置文件里的配置信息. 配置文件里, 我一开始这样写: server.index = 127.0.0.1:8383 ; 表示索引接口 server.search = ...

  5. ---————for循环打印爱心

    //打印爱心public class Xin{ public static void main (String [] args){ for(int i=1;i<=4;i++){ for(int ...

  6. SVG分组和引用

    这是我在掘金中的文章链接地址:https://juejin.im/post/5bcfe0fa51882577e3760467

  7. 获取choice的value

  8. c#枚举描述

    1.枚举遍历 public enum e_Sex{ male=, female= } foreach (var value in Enum.GetValues(typeof(e_Sex)){ /* 获 ...

  9. Linux系统环境下Tomcat8、httpd、mysql8开机自启动配置

    Linux系统环境下Tomcat8.httpd.mysql8开机自启动配置: 相关命令:chkconfig 参考链接:https://jingyan.baidu.com/article/6525d4b ...

  10. 新 radio样式修改

    https://blog.csdn.net/qq_41617704/article/details/80973966