上传头像,自己感觉了好久,就是上传文件呗其实,存在一个路径,数据库存储这个路径,然后展示给前端,啥都不说,看怎么实现的。

数据库设置如下

user_image=db.Column(db.String(252),nullable=True)

form 表单设计:

avatar=FileField('头像')

后端实现代码

 avatar=request.files['avatar']
fanme=avatar.filename
upfile=os.getcwd()+('/app/static/avatar/')
ALLOWER_EXIT=['pang','jpg','jpeg','jig']
flag='.' in fanme and fanme.split('.')[1] in ALLOWER_EXIT
if not flag:
return render_template('editperson.html',form=form)
avatar.save('{}{}{}'.format(upfile,user.username,fanme))
user.user_image='/static/avatar/{}{}'.format(user.username,fanme)
db.session.add(user)

存储路径是

/static/avatar/,支持格式 pang、jpg、jpeg等格式,这个可以根据自己的需求进行设置。 
存储后会在数据库存储一个路径
最后实现后数据库

接下来是前端的展示

{% if username.user_image%}
<img src="{{username.user_image}}" style="height:80px;">
{%else%}
<img src="/static/img/0.jpg" style="height:70px;width:80px">
{%endif%}

这里说明下,这里的后端实现上传的头像的代码 在Windows上回报错,说文件不存在,我试着去修改了,就是路径名字别太长,

路径 名字短可以,长了就报错。Windows开发很有弊端,在Ubuntu 实现没有一点问题

项目地址 https://github.com/liwanlei/flask_blog

flask 上传头像的更多相关文章

  1. day105:Mofang:设置页面初始化&更新头像/上传头像&设置页面显示用户基本信息

    目录 1.设置页面初始化 2.更新头像 1.点击头像进入更新头像界面 2.更新头像页面初始化 3.更新头像页面CSS样式 4.头像上传来源选择:相册/相机 5.调用api提供的本地接口从相册/相机提取 ...

  2. swift上传头像

    很久没有写博客了,今天特地写了这个,也是一边仿照别人写的demo,注释部分都是需要的.需要的同学可以参考一下. @IBAction func headImageBtnPage(){  //上传头像 / ...

  3. html5 上传头像的裁剪

    本示例使用HTML5 canvas,简单的编写了上传头像的裁剪效果,移动端支持拖拽后裁剪, 虽然样式不好看,但是功能还算全: 下图为裁剪后的效果: html部分: <!DOCTYPE html& ...

  4. 完美实现类似QQ的自拍头像、上传头像功能!(Demo 源码)

    现在很多下载客户端程序都需要设定自己头像的功能,而设定头像一般有两种方式:使用摄像头自拍头像,或者选择一个图片的某部分区域作为自己的头像. 一.相关技术 若要实现上述的自拍头像和上传头像的功能,会碰到 ...

  5. Jcrop+uploadify+php实现上传头像预览裁剪

    最近由于项目需要,所以做了一个上传头像预览并且可以预览裁剪的功能,大概思路是上传的图片先保存到服务器,然后通过ajax从服务器获取到图片信息,再利用Jcrop插件进行裁剪,之后通过PHP获取到的四个裁 ...

  6. asp.net mvc上传头像加剪裁功能介绍

    正好项目用到上传+剪裁功能,发上来便于以后使用. 我不能告诉你们其实是从博客园扒的前台代码,哈哈. 前端是jquery+fineuploader+jquery.Jcrop 后台是asp.net mvc ...

  7. 上传头像,界面无跳转,php+js

    上传头像,界面无跳转的方式很多,我用的是加个iframe那种.下面直接上代码. html: //route 为后端接口//upload/avatar 为上传的头像的保存地址//imgurl=/uplo ...

  8. php实现手机拍照上传头像功能

    现在手机拍照很火,那么如何使用手机拍照并上传头像呢?原因很简单,就是数据传递,首先手机传递照片信息,这个就不是post传递 也不是get函数传递, 这个另外一种数据格式传递,使用的是$GLOBALS ...

  9. Android基础之——startActivityForResult启动界面并返回数据,上传头像

    在android应用的开发过程中,常常会出现启动一个界面后填写部分内容后带着数据返回启动前的界面,最典型的应用就是登录过程.在非常多应用程序的模块中,都有"我的"这个模块,在未登录 ...

随机推荐

  1. weiphp的学习

    ##2015-07-27 **token 一定要加 不然在lists页面无法显示** ##2015-07-20 1. 自定义回复里面添加 微现场 跳转url OAuth2.0网页授权演示      & ...

  2. 升讯威微信营销系统开发实践:(5) Github 源码:微信接口的 .NET 封装。

    微信开发系列教程,将以一个实际的微信平台项目为案例,深入浅出的讲解微信开发.应用各环节的实现方案和技术细节. 本系列教程的最终目标是完成一个功能完善并达到高可用性能指标的微信管理软件,所以除了与微信本 ...

  3. CentOS系统搭建gitolite服务

    1.安装相关支持软件 a.$yum install perl-Time-HiRes openssh-server perl -y b.$yum -y install git 2.服务端操作:创建git ...

  4. 019 关联映射文件中集合标签中的lazy(懒加载)属性

    <set>.<list>集合上,可以取值:true/false/extra,(默认值为:true) 实例一:(集合上的lazy=true(默认))class默认lazy=tru ...

  5. 干货——基于Nop的精简版开发框架(附源码)

    .NET的开发人员应该都知道这个大名鼎鼎的高质量b2c开源项目-nopCommerce,基于EntityFramework和MVC开发,拥有透明且结构良好的解决方案,同时结合了开源和商业软件的最佳特性 ...

  6. salesforce零基础学习(七十二)项目中的零碎知识点小总结(一)

    项目终于告一段落,虽然比较苦逼,不过也学到了好多知识,总结一下,以后当作参考. 一.visualforce标签中使用html相关的属性使用 曾经看文档没有看得仔细,导致开发的时候走了一些弯路.还好得到 ...

  7. python之路 序列化 pickle,json

    运行代码,毫不留情地得到一个TypeError: Traceback (most recent call last): ... TypeError: <__main__.Student obje ...

  8. 不知道Linux的mysql的root密码

    用了好几次了这个方法.记一下: 1.停止Mysql /etc/init.d/mysql stop 或者(根据安装配置的位置不同,而不同) /etc/init.d/mysqld stop 2.进入Mys ...

  9. JVM类加载以及执行的实战

    前几篇文章主要是去理解JVM类加载的原理和应用,这一回讲一个可以自己动手的例子,希望能从头到尾的理解类加载以及执行的整个过程. 这个例子是从周志明的著作<深入理解Java虚拟机>第9章里抄 ...

  10. 解决 Excel 打开 UTF-8 编码 CSV 文件乱码的 BUG

    解决 Excel 打开 UTF-8 编码 CSV 文件乱码的 BUG zoerywzhou@163.com http://www.cnblogs.com/swje/ 作者:Zhouwan 2017-6 ...