项目中关于动作的说明需要相应的配图,这样可以更直观的说明动作要点。本篇主要为项目中动作的新增和编辑做准备,确定适合场景的上传操作逻辑以及图片的存储和加载的方法。

一 上传方案

a) 本来所用的模板中是有一款挺好的上传控件的,支持多选、拖拽、并行上传。

但探索了半天后才意识到这个并不适合当前的场景。不管是动作的新增还是编辑,上传图片后最好能即时地看到所添加的图片。这个控件无疑带来了功能上的冗余。

b) 最后采用了基于html file类型的输入框做成的按钮。

查看代码,可以发现这种按钮是在label中包含了一个input,而且input属性为hide。

c) input放在表单中,一般需要点击提交按钮才能上传,但对项目来说,这个提交按钮是多余的,改成选中图片后自动上传。需要注册图片选择按钮的change事件,并在事件中自动提交表单。

d) 上传表单提交到服务器后,读取文件并做后续的处理,可多选上传。SaveImgInCloud是与保存到第三方存储服务相关的方法。


二 云存储

a) 现在使用的云存储要先创建存储空间,并设置空间的访问权限,为了方便上传后的读取操作,设置为公开空间,后面再想别的办法增加访问保护。

然后,根据开发者文档操作,这个虽然之前已经用过了,但仍然遇到不少麻烦。

b) 密钥测试时临时保存在常量中。第一次试验时上传失败,是因为没有设置区域,最后设置为自动识别区域Config.AutoZone()。

c) 另外还有同名文件覆盖的问题,按照文档要设置putPolicy.Scope = bucket + ":" + saveKey,否则会保留第一次上传的。

d) 文档提供了简单上传、字节上传、流式上传几种方式,本次使用流式上传。将file.InputStream作为上传对象即可。

Fit项目图片上传和云存储的调通的更多相关文章

  1. django之创建第10-1个项目-图片上传并记录上传时间

    1.百度云盘:django之创建第10-1个项目-图片上传并记录上传时间 2.主要修改的配置文件有3个,forms.views和models3个文件以及html 3.forms.py文件修改 #cod ...

  2. django之创建第10个项目-图片上传方式1

    1.upload.HTMl <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang=& ...

  3. 后盾网lavarel视频项目---图片上传

    后盾网lavarel视频项目---图片上传 一.总结 一句话总结: 前端还是普通的前端操作,前端上传图片的地址就是图片上传的路由,后端代码也很简单 public function uploader(R ...

  4. 微信小程序中图片上传阿里云Oss

    本人今年6月份毕业,最近刚在上海一家小公司实习,做微信小程序开发.最近工作遇到一个小问题. 微信小程序图片上传阿里云服务器Oss也折腾了蛮久才解决的,所以特意去记录一下. 第一步:配置阿里云地址: 我 ...

  5. base64格式的图片上传阿里云

    base64格式的图片上传阿里云 上传图片的时候,除了普通的图片上传,还有一张图片信息是以base64格式发送到后台的. 后台接受base64格式的图片,上传至阿里云代码:(主要是将base64转化成 ...

  6. 百度editor调用【图片上传阿里云】

    百度editor调用简单,但是图片和文件上传阿里云就有点难度了.下面我详细说一下. 百度富文本编辑器下载地址:http://ueditor.baidu.com/website/download.htm ...

  7. 潭州课堂25班:Ph201805201 tornado 项目 第三课 项目 图片上传,展示 (课堂笔记)

    tornado 相关说明 f增加图片上传功能, 在 main.py ,文件中创建个  UploadHandler 类,用来处理图片上传 上传图片之前,要先渲染这个页面,所以定个 get 方法,把这个页 ...

  8. vue图片上传及java存储图片(亲测可用)

    1.前言 在使用elementui的upload组件时,我一直无法做到上传的图片和其他数据一起提交.单纯的上传文件,java的存储图片的方式也有局限性. 我知道的后端保存图片有两种方式:一种是直接存储 ...

  9. 简单的Django实现图片上传,并存储进MySQL数据库 案例——小白

    目标:通过网页上传一张图片到Django后台,后台接收并存储进数据库 真是不容易!!这个案例的代码网上太乱,不适合我,自己摸索着写,终于成功了,记录一下,仅供自己参考,有的解释可能不对,自己明白就好, ...

随机推荐

  1. [CocoaPods]CocoaPods安装详解

    安装CocoaPods之前先安装ruby: 1.安装ruby ruby官网rubygems.org已被屏蔽,替换当前镜像是否为国内镜像. $gem sources --add https://gems ...

  2. ELKstack简介及环境部署

    ELK工作流程图 环境准备 安装Logstash依赖包JDK Logstash的运行依赖于Java运行环境, Logstash 1.5以上不低于java 7推荐使用最新版本的Java.由于只是运行Ja ...

  3. [源码]Delphi 5KB无输入表下载者

    [源码]Delphi 5KB无输入表下载者源码 PROGRAM Fun; type DWORD = LongWord; THandle = LongWord; BOOL = LongBool; LPC ...

  4. Ubuntu16.04安装Anaconda (转)

    一. Anaconda下载 Anaconda 官方下载链接: https://www.continuum.io/downloads 根据自己的系统选择下载32位还是64位.   二. 进入下载目录 如 ...

  5. Hadoop生态系统之Yarn

    Apache YARN(Yet Another Resource Negotiator) 是Hadoop的集群资源管理系统.YARN被引入Hadoop2最初是为了改善MapReduce的实现,但它具有 ...

  6. SqlServer 循环建表、删除表、更新表

    常用于分库分表 1.批量删除 declare @outter int declare @inner int ) ) ) begin set @tablePrefix='BankPayOrder_'+c ...

  7. 源码安装redis环境

    linux下安装redis 1.下载源码,解压包后编译源码: wget http://download.redis.io/releases/redis-2.8.3.tar.gz tar xzf red ...

  8. spring cloud+.net core搭建微服务架构:配置中心(四)

    前言 我们项目中有很多需要配置的地方,最常见的就是各种服务URL地址,这些地址针对不同的运行环境还不一样,不管和打包还是部署都麻烦,需要非常的小心.一般配置都是存储到配置文件里面,不管多小的配置变动, ...

  9. JAVA代理分析

    JAVA的动态代理 代理模式 代理模式是常用的java设计模式,他的特征是代理类与委托类有同样的接口,代理类主要负责为委托类预处理消息.过滤消息.把消息转发给委托类,以及事后处理消息等.代理类与委托类 ...

  10. Docker入门记1

    Docker是一个部署容器技术,它出现的目的主要解决开发人员在本机开发的时候安装的各类类库等一系列运行程序的包啊库啊,然后把这些引用的第三方类库和操作系统需要的配置打包起来,形成一个原子环境,然后部署 ...