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. electron-vue初始桌面应用

    1.安装vue-cli脚手架 npm install -g vue-cli 2.创建项目:vue init simulatedgreg/electron-vue my-project 3.安装依赖 : ...

  2. 个人洛谷账号地址——https://www.luogu.org/space/show?uid=181909 附上NOIP查分系统

    个人洛谷地址:       https://www.luogu.org/space/show?uid=181909 NOPI查分地址:      http://bytew.net/OIer/

  3. IOS 极光推送自定义通知遇到的一些坑

    主要方法: //自定义推送 - (void)networkDidReceiveMessage:(NSNotification *)notification { NSDictionary * userI ...

  4. IPC 简说

    IPC(inter-process communication)进程间通信 多进程分为两种情况 1. 同一个应用,使用android:process属性启动的四大组件 2. 多应用 通过android ...

  5. 学习Git笔记（更新中）

    参考网址:https://blog.csdn.net/zmx729618/article/details/52174373 跟着练习一下,写的很好. Git:是一个分布式版本控制系统. GitHub: ...

  6. css设置文字多余部分显示省略号

    如果只显示一行,则可以使用以下方法: overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 如果需要显示多行,在需要设置的元素s ...

  7. Java 8 Lambda 表达式(二)

    lambdas 实现 Runnable 接口 下面是使用 lambdas 来实现 Runnable 接口的示例: // 1.1使用匿名内部类 new Thread(new Runnable() { @ ...

  8. Django JWT Token RestfulAPI用户认证

    一般情况下我们Django默认的用户系统是满足不了我们的需求的,那么我们会对他做一定的扩展 创建用户项目 python manage.py startapp users 添加项目apps INSTAL ...

  9. latex如何定义宏，插图统一尺寸减少工作量

    问题背景是这样的,因为我要在文中插入一系列的图片,但是这些图片的大小我要保持一致,来达到预期的效果. 比如我有三个figure,这三个figure中,每个figure里面有两行,5列图片,我想要的是, ...

  10. Unity判断用户联网状态，WiFi/移动网络/无网络

    Unity判断用户联网状态 本文提供全流程,中文翻译. Chinar 坚持将简单的生活方式,带给世人!(拥有更好的阅读体验 -- 高分辨率用户请根据需求调整网页缩放比例) Chinar -- 心分享. ...